Bagaimanakah Kata Kunci 'ini' Berbeza Antara Fungsi Anak Panah dan Fungsi Biasa dalam JavaScript?

Fungsi Anak panah dan "Ini" tanpa Konteks

Dalam ES6, fungsi anak panah menyediakan sintaks ringkas untuk pengisytiharan fungsi. Walau bagaimanapun, satu perbezaan utama antara fungsi anak panah dan fungsi tradisional ialah pengendalian kata kunci "ini".

Apabila anda menggunakan fungsi anak panah di dalam objek seperti yang ditunjukkan dalam kod yang diberikan:

var person = {
  name: "jason",

  shout: () => console.log("my name is ", this.name)
}

Kata kunci "ini" dalam fungsi anak panah tidak merujuk kepada objek "orang". Sebaliknya, ia menunjuk kepada skop di mana fungsi anak panah dicipta, yang dalam kes ini ialah skop global. Oleh itu, apabila memanggil "person.shout()", ia mencatatkan "nama saya" tanpa sifat "jason".

Untuk menyelesaikan isu ini, anda boleh menggunakan sintaks fungsi biasa dan bukannya fungsi anak panah:

var person = {
  name: "jason",

  shout: function() {
    console.log("my name is ", this.name)
  }
}

Dalam fungsi biasa, "ini" merujuk kepada objek yang memiliki fungsi tersebut. Oleh itu, ia akan mengeluarkan "nama saya jason" dengan betul apabila dipanggil.

Sebagai alternatif, anda boleh memanfaatkan sintaks pengisytiharan kaedah ES6, yang serupa dengan sintaks fungsi anak panah:

var person = {
  name: "jason",

  shout() {
    console.log("my name is ", this.name)
  }
}

Dengan sintaks ini, pengisytiharan fungsi menghilangkan titik bertindih (:) dan kata kunci "fungsi". Walau bagaimanapun, ia masih menggunakan sintaks pengisytiharan fungsi biasa, memastikan bahawa "ini" terikat pada objek.

Atas ialah kandungan terperinci Bagaimanakah Kata Kunci 'ini' Berbeza Antara Fungsi Anak Panah dan Fungsi Biasa dalam JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!