Apakah ciri-ciri fungsi anak panah es6?

Ciri-ciri fungsi anak panah es6 ialah: 1. Fungsi anak panah tidak mempunyai objek argumen 2. Nilai fungsi anak panah ini bergantung pada nilai ini bagi fungsi bukan anak panah di luar fungsi, dan fungsi anak panah tidak boleh mengubah arah ini; 3. Fungsi Anak panah tidak boleh diisytiharkan dengan kata kunci baharu;

Persekitaran pengendalian tutorial ini: sistem Windows 7, ECMAScript versi 6, komputer Dell G3.

Standard ES6 menambah fungsi baharu: Fungsi Anak Panah.

Mengapa ia dipanggil Fungsi Anak Panah? Kerana takrifnya menggunakan anak panah:

x => x * x

Fungsi anak panah di atas adalah bersamaan dengan:

function (x) {    
return x * x;
}

Fungsi anak panah bersamaan dengan fungsi tanpa nama dan memudahkan takrifan fungsi. Terdapat dua format fungsi anak panah Satu adalah seperti di atas, yang mengandungi hanya satu ungkapan, malah {...} dan pengembalian ditinggalkan. Terdapat juga kaedah yang boleh mengandungi berbilang pernyataan Dalam kes ini, { ... } dan pulangan tidak boleh ditinggalkan:

x => {
    if (x > 0) {
        return x * x;
    }
    else {
        return - x * x;
    }
}

Jika tidak ada satu parameter, ia perlu disertakan dalam kurungan (. ):

// 两个参数:
(x, y) => x * x + y * y

// 无参数:
() => 3.14

// 可变参数:
(x, y, ...rest) => {
    var i, sum = x + y;
    for (i=0; i<rest.length; i++) {
        sum += rest[i];
    }
    return sum;
}

Jika anda ingin mengembalikan objek, sila ambil perhatian bahawa jika ia adalah satu ungkapan, ralat akan dilaporkan jika anda menulisnya seperti ini:

// SyntaxError:
x => { foo: x }

Kerana terdapat konflik sintaks dengan { ... } dalam badan fungsi, jadi Untuk ditukar kepada:

// ok:
x => ({ foo: x })

Ciri-ciri fungsi anak panah es6

1. Fungsi anak panah tidak mempunyai argumen

let test1 = () => {
    console.log(arguments)
}
test1(123) // arguments is not defined

Fungsi anak panah hanya akan mencari fungsi bukan anak panah luar apabila mencari objek argumen lapisan luar ialah fungsi fungsi bukan anak panah dan ia tidak mempunyai objek argumen, ia akan mengganggu dan kembali, dan ia tidak akan pergi ke lapisan luar Pergi ke

function test2(a, b, c){
    return () => {
    console.log(arguments) // [1]
    }
}
test2(1)()

2. Fungsi anak panah nilai ini

Nilai fungsi anak panah ini bergantung pada nilai ini bagi fungsi bukan anak panah di luar fungsi Jika lapisan sebelumnya Ia masih fungsi anak panah, maka teruskan melihat ke atas. Jika anda tidak menemuinya, maka ini ialah objek tetingkap

let person = {
    test: () => {
        console.log(this)
    },
    fn(){
        return () => {
            console.log(this)
        }
    }
}
person.test()  // window
person.fn()()  // person对象

Fungsi anak panah tidak boleh mengubah titik ini

let person = {}
let test = () => console.log(this)
test.bind(person)()
test.call(person)
test.apply(person)

Ini ditentukan semasa pra-penyusun.

3. Fungsi anak panah tidak boleh diisytiharkan dengan kata kunci baharu

let test = () => {}
new test() // Uncaught TypeError: test is not a constructor

4. Fungsi anak panah tidak mempunyai atribut prototaip

Adakah semua fungsi dalam JavaScript mempunyai atribut prototaip Ini salah?

let test = () => {}
test.prototype // undefined
test.__proto__ === Function.prototype // true

Fungsi anak panah tidak boleh menamakan semula parameter

// 箭头函数不能重复命名参数
let bbb = (b, b, b) => {
} 
// Uncaught SyntaxError: Duplicate parameter name not allowed in this context
let bb = function(b, b, b){
}
// es5 不会报错

[Cadangan berkaitan: tutorial video javascript, bahagian hadapan web]

Atas ialah kandungan terperinci Apakah ciri-ciri fungsi anak panah es6?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!