Mengapa Anda Perlu Mengelak Fungsi Anak Panah Semasa Menentukan Kaedah Objek ES6?

Menggunakan Fungsi Anak Panah dalam Objek ES6

Dalam ES6, terdapat dua cara untuk menentukan kaedah objek: menggunakan sintaks fungsi tradisional dan menggunakan trengkas bentuk. Kedua-dua kaedah ini adalah sah:

var chopper = {
    owner: 'Zed',
    getOwner: function() { return this.owner; }
};

var chopper = {
    owner: 'Zed',
    getOwner() { return this.owner; }
}

Walau bagaimanapun, menggunakan fungsi anak panah dalam kaedah objek memberikan cerita yang berbeza. Mari kita terokai perkara ini dengan lebih terperinci.

Fungsi Anak Panah dan Kaedah Objek

Fungsi anak panah tidak sesuai untuk mentakrifkan kaedah objek. Ini kerana mereka mewarisi nilai ini konteks leksikal sekeliling, yang mungkin tidak sama dengan nilai ini dalam objek.

Sebagai contoh, pertimbangkan kod berikut:

var chopper = {
    owner: 'John',
    getOwner: () => { return this.owner; }
};

Dalam contoh ini, ini dalam kaedah getOwner merujuk kepada objek tetingkap (atau objek globalThis dalam mod ketat), bukan objek pencincang. Akibatnya, ungkapan this.owner akan kembali tidak ditentukan, membuang ralat.

Sintaks Fungsi Tradisional lwn. Sintaks Kaedah ES6

Untuk mentakrifkan kaedah objek, ia adalah dinasihatkan untuk menggunakan sintaks fungsi tradisional atau sintaks kaedah ES6, yang kedua-duanya secara eksplisit mentakrifkan nilai ini dalam kaedah.

Berikut ialah contoh menggunakan sintaks fungsi tradisional:

var chopper = {
    owner: 'Zed',
    getOwner: function() {
        return this.owner;
    }
};

Dan berikut ialah contoh menggunakan sintaks kaedah ES6:

var chopper = {
    owner: 'Zed',
    getOwner() {
        return this.owner;
    }
};

Kaedah ini menggunakan kata kunci ini untuk rujuk kepada objek semasa, memastikan bahawa ungkapan this.owner mengembalikan yang betul nilai.

Kesimpulan

Walaupun fungsi anak panah menawarkan sintaks ringkas untuk mentakrifkan fungsi mudah, ia tidak sesuai digunakan sebagai kaedah objek dalam ES6. Untuk tujuan ini, adalah disyorkan untuk berpegang pada sintaks fungsi tradisional atau sintaks kaedah ES6, yang kedua-duanya menyediakan cara yang lebih jelas dan boleh dipercayai untuk menentukan kaedah pada objek.

Atas ialah kandungan terperinci Mengapa Anda Perlu Mengelak Fungsi Anak Panah Semasa Menentukan Kaedah Objek ES6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!