JavaScript: โทร ใช้ ผูก

ใน JavaScript วิธีการ call, apply และ bind ใช้เพื่อเปลี่ยนบริบทของฟังก์ชัน หรือเพื่อตั้งค่า this ภายในฟังก์ชัน โดยทั่วไปจะใช้ในสถานการณ์ที่คุณต้องส่งฟังก์ชันเป็นการเรียกกลับ หรือเมื่อคุณต้องการใช้ฟังก์ชันซ้ำกับบริบทหรืออาร์กิวเมนต์ที่แตกต่างกัน

ต่อไปนี้คือตัวอย่างและกรณีการใช้งานแต่ละวิธี:

โทร

เมธอด call ช่วยให้คุณสามารถเรียกใช้ฟังก์ชันที่มีค่า this ที่ระบุและอาร์กิวเมนต์ที่ระบุแยกกัน

ตัวอย่าง:

const person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}

const person1 = {
  firstName: "John",
  lastName: "Doe"
}

const person2 = {
  firstName: "Mary",
  lastName: "Smith"
}

console.log(person.fullName.call(person1)); // Output: "John Doe"
console.log(person.fullName.call(person2)); // Output: "Mary Smith"

ในตัวอย่างข้างต้น เมธอด call ใช้เพื่อเรียกใช้ฟังก์ชัน fullName โดยมี person1 และ person2 เป็นค่า this

กรณีการใช้งาน:

call สามารถใช้เพื่อเรียกใช้ฟังก์ชันที่มีบริบทเฉพาะได้ ซึ่งจะมีประโยชน์เมื่อคุณมีฟังก์ชันที่ขึ้นอยู่กับบริบทเฉพาะ ตัวอย่างเช่น คุณอาจมีฟังก์ชันที่ทำงานบนวัตถุเฉพาะ และคุณต้องการเรียกใช้ฟังก์ชันนั้นด้วยวัตถุที่แตกต่างกัน

<แข็งแกร่ง>2. สมัคร

เมธอด apply คล้ายกับ call แต่ใช้อาร์เรย์ของอาร์กิวเมนต์ แทนที่จะใช้อาร์กิวเมนต์ที่ให้แยกกัน

ตัวอย่าง:

const numbers = [5, 6, 2, 3, 7];

const max = Math.max.apply(null, numbers);

console.log(max); // Output: 7

ในตัวอย่างข้างต้น ใช้เมธอด apply เพื่อค้นหาค่าสูงสุดในอาร์เรย์ของตัวเลข

กรณีการใช้งาน:

apply สามารถใช้เพื่อเรียกใช้ฟังก์ชันที่มีอาร์เรย์ของอาร์กิวเมนต์ได้ ซึ่งจะมีประโยชน์เมื่อคุณมีฟังก์ชันที่รับอาร์กิวเมนต์จำนวนตัวแปร ตัวอย่างเช่น คุณอาจมีฟังก์ชันที่รับอาร์กิวเมนต์เป็นจำนวนเท่าใดก็ได้ และคุณต้องการเรียกฟังก์ชันนั้นด้วยอาร์เรย์อาร์กิวเมนต์

3.ผูกมัด

เมธอด bind ส่งคืนฟังก์ชันใหม่ที่มีค่า this และอาร์กิวเมนต์ที่ระบุ

ตัวอย่าง:

const person = {
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
}

const person1 = {
  firstName: "John",
  lastName: "Doe"
}

const person2 = {
  firstName: "Mary",
  lastName: "Smith"
}

const fullName1 = person.fullName.bind(person1);
const fullName2 = person.fullName.bind(person2);

console.log(fullName1()); // Output: "John Doe"
console.log(fullName2()); // Output: "Mary Smith"

ในตัวอย่างข้างต้น เมธอด bind ใช้เพื่อสร้างฟังก์ชันใหม่ 2 ฟังก์ชัน fullName1 และ fullName2 ที่ผูกไว้กับ person1 และ person2 ตามลำดับ

กรณีการใช้งาน:

bind สามารถใช้เพื่อสร้างฟังก์ชันใหม่ที่ถูกผูกไว้กับบริบทเฉพาะ สิ่งนี้มีประโยชน์เมื่อคุณมีฟังก์ชันที่ต้องเรียกใช้ด้วยบริบทเฉพาะ แต่คุณไม่ต้องการเปลี่ยนฟังก์ชันดั้งเดิม ตัวอย่างเช่น คุณอาจมีฟังก์ชันที่ใช้ในหลายบริบท และคุณต้องการสร้างฟังก์ชันใหม่สำหรับแต่ละบริบท

JavaScript: โทร ใช้ ผูก

คำถามในหัวข้อ