這篇文章主要介紹JavaScript普通函數和箭頭函數有哪些區(qū)別，文中介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要看完！

黃陵網站制作公司哪家好，找創(chuàng)新互聯！從網頁設計、網站建設、微信開發(fā)、APP開發(fā)、成都響應式網站建設等網站項目制作，到程序開發(fā)，運營維護。創(chuàng)新互聯從2013年成立到現在10年的時間，我們擁有了豐富的建站經驗和運維經驗，來保證我們的工作的順利進行。專注于網站建設就選創(chuàng)新互聯。

我常常的使用箭頭函數，卻還沒有對箭頭函數有個深入的了解，現在找一下這2個函數的不同點

1. 箭頭函數本身沒有prototype(原型)

由于箭頭函數沒有原型，因此箭頭函數本身沒有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指向定義時所在的外層第一個普通函數，跟使用位置沒有沒有關系

被繼承的普通函數的this指向改變，箭頭函數的this也會跟著改變。

不能直接修改箭頭函數的this

可以通過修改被繼承的普通函數的this指向，然后箭頭函數的this也會跟著改變

3. 箭頭函數使用arguments

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. 箭頭函數指向window時，arguments會報未定義的錯誤
2. 如果不是window,那么就是外層第一個普通函數的arguments

4. 箭頭函數不可以使用new

無論箭頭函數的this指向哪里，使用new調用箭頭函數都會報錯，箭頭函數沒有構造函數

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

以上是JavaScript普通函數和箭頭函數有哪些區(qū)別的所有內容，感謝各位的閱讀！希望分享的內容對大家有幫助，更多相關知識，歡迎關注創(chuàng)新互聯行業(yè)資訊頻道！

當前名稱：JavaScript普通函數和箭頭函數有哪些區(qū)別
URL標題：http://jinyejixie.com/article24/pdcjce.html

成都網站建設公司_創(chuàng)新互聯，為您提供網站維護、品牌網站設計、域名注冊、電子商務、面包屑導航、響應式網站

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯