es6 화살표 함수의 특징은 무엇입니까?

ES6 화살표 함수의 특징은 다음과 같습니다. 1. 화살표 함수에는 인수 개체가 없습니다. 2. 화살표 함수의 this 값은 함수 외부의 화살표가 아닌 함수의 this 값에 따라 달라집니다. 3. 화살표 함수는 새로운 키워드 선언을 사용할 수 없습니다. 4. 화살표 함수에는 프로토타입 속성이 없습니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, ECMAScript 버전 6, Dell G3 컴퓨터.

ES6 표준에는 Arrow Function이라는 새로운 기능이 추가되었습니다.

애로우 함수라고 불리는 이유는 무엇인가요? 정의에서 화살표를 사용하기 때문에:

x => x * x

위의 화살표 함수는 다음과 동일합니다.

function (x) {    
return x * x;
}

화살표 함수는 익명 함수와 동일하며 함수 정의를 단순화합니다. 화살표 함수에는 두 가지 형식이 있습니다. 하나는 위와 같으며 표현식이 하나만 포함되어 있고 {...} 및 return도 생략됩니다. 여러 문장을 담을 수 있는 메소드도 있습니다. 이 경우 { ... } 와 return 은 생략할 수 없습니다:

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

매개변수가 하나가 아니면 괄호()로 묶어야 합니다:

// 两个参数:
(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;
}

객체를 반환하려면 반드시 해야 합니다. 단일 표현식인 경우 다음과 같이 작성하면 오류가 보고된다는 점에 유의하세요.

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

함수 본문에 {...}와 문법적 충돌이 있기 때문에,

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

es6 화살표 함수의 특징

1. 화살표 함수에는 인수가 없습니다.

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

화살표 함수는 찾을 때 화살표가 아닌 외부 함수 함수만 찾습니다. 인수 개체의 경우 외부 레이어가 화살표가 아닌 함수 함수인 경우 인수 개체가 없으면 중단되고 반환됩니다.

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

2 및 화살표 함수는 외부 레이어에서 이 값을 찾습니다.

화살표 함수의 this 값은 함수 외부의 비화살 함수의 this 값에 따라 달라집니다. 상위 레이어가 여전히 화살표 함수라면 계속해서 찾아보고, 찾을 수 없으면 이것이 창입니다. object

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

화살표 함수는 이

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

사전 컴파일 과정에서 이 점을 결정했습니다.

3. Arrow 함수는 새로운 키워드로 선언할 수 없습니다

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

4. Arrow 함수에는 프로토타입 속성이 없습니다.

JavaScript의 모든 함수에는 프로토타입 속성이 있습니까?

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

화살표 함수는 매개변수 이름을 바꿀 수 없습니다

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

[관련 권장 사항: javascript 비디오 튜토리얼, 웹 프론트 엔드]

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