JavaScript 일반 함수와 화살표 함수의 차이점은 무엇입니까?

이 기사에서 제공하는 내용은 일반 JavaScript 함수와 화살표 함수의 차이점이 무엇입니까? 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

화살표 함수를 자주 사용하지만 화살표 함수에 대한 깊은 이해가 없습니다. 이제 이 두 함수의 차이점을 찾아보겠습니다.

1. 프로토타입(prototype)

화살표 함수에는 프로토타입이 없으므로 화살표 함수 자체에는 이것이 없습니다

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. 화살표 함수는 인수를 사용합니다

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('完成第二个普通函数')

위에서 다음 두 가지 점을 그릴 수 있습니다

화살표 함수가 창을 가리키면 인수는 정의되지 않은 오류를 보고합니다
1. 창이 아닌 경우 외부 레이어에 있는 첫 번째 일반 함수의 인수입니다
2. #🎜🎜 #4. 화살표 함수는 new를 사용할 수 없습니다

#🎜🎜 #화살표 함수가 가리키는 위치에 관계없이 new를 사용하여 화살표 함수를 호출하면 화살표 함수에 생성자가 없습니다

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

# 🎜🎜#[관련 권장사항:

JavaScript 비디오 튜토리얼

】#🎜🎜 #

위 내용은 JavaScript 일반 함수와 화살표 함수의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!