สมมุติว่าเรามี
const action = () => {}
เราจะใช้งานมันได้ 4 วิธี
1. ง่ายที่สุดเรียกมันตรงๆ
action()
2. ใช้ call()
action.call(obj, a, b, c)
call จะพิเศษกว่าการเรียกธรรมดา ตรงที่เราสามารถเอาค่าใน obj ไปใช้ใน action ได้ผ่าน "this"
เช่น
const obj = { name: 'ilumin' }
const action = (a, b) => console.log(`Hello, ${this.name}, this is ${a} and ${b}.`)
action.call(obj, 'Anakin', 'Obiwan') // log: Hello, ilumin, this is Anakin and Obiwan.
3. ใช้ apply
action.apply(obj, args)
จริงๆแล้ว apply ก็เหมือน call เลย แต่พิเศษกว่าตรงที่มันรองรับการใส่ args เป็น array แต่ call ต้องเอาให้ชัวร์ว่ามีกี่ args เช่น
const obj = { name: 'ilumin' }
const action = (a, b) => console.log(`Hello, ${this.name}, this is ${a} and ${b}.`)
action.apply(obj, ['Anakin', 'Obiwan']) // log: Hello, ilumin, this is Anakin and Obiwan.
4. ใช้ bind
bind ถือว่าเป็นท่าที่เทพสุด เพราะเป็นการสร้าง function เอาไว้ใช้งานทีหลัง เช่น
const obj = { name: 'ilumin' }
const action = (a, b) => console.log(`Hello, ${this.name}, this is ${a} and ${b}.`)
const bindedAction = action.bind(obj)
bindedAction('Anakin', 'Obiwan') // log: Hello, ilumin, this is Anakin and Obiwan.
ไม่มีกฏตายตัวว่าอะไรดีที่สุด ทั้งหมดขึ้นอยู่กับบริบทของโค้ด เลือกเอาไปใช้อย่างมีสติ และตั้งมั่นอยู่บนความง่าย สะดวก สะอาด และประหยัด :D
Top comments (2)
เหมือนข้อ 3 จะต้องเปลี่ยนจาก Call เป็น apply ไหมครับ
ใช่ครับ copy เพลิน :D ขอบคุณมากครับ