ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScript の通常関数とアロー関数の違いは何ですか?

JavaScript の通常関数とアロー関数の違いは何ですか?

不言
不言転載
2019-04-11 10:59:052676ブラウズ

この記事の内容は、通常のJavaScript関数とアロー関数の違いについてです。一定の参考値があるので、困っている友人は参考にしていただければ幸いです。

私はアロー関数をよく使用しますが、アロー関数については深く理解していません。次に、これら 2 つの関数の違いを見てみましょう

1. アロー関数自体は、プロトタイプがない (プロトタイプ))

アロー関数にはプロトタイプがないため、アロー関数自体には this

let a = () => {}
console.log(a.prototype) // undefined
let b = function () {}
console.log(b.prototype) // Object

2 がありません。アロー関数の this は this を指します

let a;
let barObj = {
    msg: 'bar的this指向'
}
let fooObj = {
    msg: 'foo的this指向'
}
bar.call(barObj)
foo.call(fooObj) // { msg: 'bar的this指向'  }
bar.call(fooObj)
a() // { msg: 'foo的this指向' }

function foo() {
    a()
}
function bar () {
    a = () => {
        console.log(this)
    }
}

上記の例から結論付けることができます:

アロー関数のこれは、定義されたときに外層の最初の通常関数を指します。

継承した通常関数のthisはChangeを指しており、アロー関数のthisも変化します。

アロー関数の this を直接変更することはできません

継承された通常の関数の this ポインタを変更することができ、それに応じてアロー関数の this も変更されます

3. アロー関数 引数の使用

let b = () => {
        console.log(arguments);
    }
    b(1,2,3,4) // arguments is not defined

    function bar () {
        console.log(arguments);  // 完成第二个普通函数
        bb('完成第一个普通函数')
        function bb() {
            console.log(arguments); // 完成第一个普通函数
            let a = () => {
                console.log(arguments); // 完成第一个普通函数
            }
            a('箭头函数')
        }
    }
    bar('完成第二个普通函数')

上記から、次の 2 つの点を引き出すことができます

##アロー関数がウィンドウを指す場合、引数は未定義のエラーを報告します
  1. ウィンドウでない場合は、外層の最初の通常関数の引数です
  2. 4. アロー関数は new

どこにいても使用できませんarrow 関数のポイントのうち、 new を使用して arrow 関数を呼び出すとエラーが報告されます。 arrow この関数にはコンストラクターがありません

let a = () => {}
    let b = new a() // a is not a constructor

[関連する推奨事項:

JavaScript ビデオ チュートリアル

#]

以上がJavaScript の通常関数とアロー関数の違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はsegmentfault.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。