화살표 함수의 일부 특징과 주의사항

3631 단어 js기술
1. typeof 연산자는 일반적인 함수와 같다
let commFunc = () => {};
console.log(typeof commFunc);

출력은 function 입니다.
let arrowFunc = () => {};
console.log(typeof arrowFunc);

출력도 function 입니다.이로써 화살표 함수의 유형은 일반적인 함수와 같다function.
2、instanceof 또한 반환true되어 Function의 실례임을 나타냅니다.
let func = () => {};
console.log(func instanceof Function);
true로 출력됨으로써 화살표 함수도 Function의 인스턴스임을 알 수 있습니다.
3. 화살표 함수 중의 this 계승 외곽 작용역
let person = {
    name: "galler",
    say: () => {
        console.log(this);
        console.log(this.name);
    }
};
person.say();
this의 값은 "{}"또는 window, this.name의 값은 undefined 또는 "(빈 문자열) 입니다.위의 이 코드를 파일에 쓰고 node 환경에서 실행합니다. this 의 값은'{}'로 출력됩니다. 이 빈 대상은 exports 입니다. exports 를 쓰지 않았기 때문에 exports 은 기본적으로 module.exports 를 가리키고 module.exports 은 빈 대상입니다.그러나 명령줄에서 위 코드(여전히 node 환경에서)를 실행하면 this 대상global 대상(중심에서 벗어날 수 있지만 이 코드 앞에 exports.name = "susan" 을 붙이면 this 대상{"name","susan"} 대상, this.name 값이 susan
let person = {
    name: "galler",
    speak: function() {
        console.log(this); 
        console.log(this.name); 
    }
};
person.speak();
this의 값은person 대상,this.name의 값은galler이다.
소결: 화살표 함수 자체가 없습니다this.위의 demo에서 어법 작용 영역에 따라 위로 찾기this를 하면 this대상(브라우저 환경) 또는 {}(Node 환경)을 가리키고, window및 {}대상window속성이 없기 때문에name은''(브라우저 환경) 또는this.name(Node 환경)
4. 반환 대상은 괄호로 묶는다
let person = () => {    
    name:"galler"
}
console.log(person()); 

출력은 undefined 입니다.이 때 "{}"는 함수의 시작 위치와 끝 위치를 나타냅니다. 이 함수는 반환 값이 없기 때문에 호출된 시간 값은undefined입니다.
let person = () => ({    
    name:"galler"
});
console.log(person());

출력은 undefined 입니다."{}"는 객체를 정의하는 것을 나타냅니다."()"로 묶으면 표현식이며 기본적으로 반환됩니다.
5, 화살표 함수에서는 사용할 수 없음{name:"galler"}
let Person = (name) => {
    this.name = name;
};
let one = new Person("galler");

이 프로그램을 실행하면 new6、arguments
function person() {
    console.log(arguments);
}
person(1);

일반적인 함수 사용TypeError: Person is not a constructor, 브라우저에서 하나의 그룹으로 출력: arguments, Node 환경에서 하나의 대상으로 출력: [1]
let person = () => {    
    console.log(arguments);
};
person("galler");

화살표 함수 사용{'0':1}, 브라우저 환경arguments, Node 환경ReferenceError이로써 화살표 함수와 일반 함수의 또 다른 차이점을 알 수 있다. {"0":{},……} 대상을 사용할 수 없다.
7. 원형이 없다
let person = () => {}
console.log(person.prototype); 

출력은 arguments 입니다.이로써 화살표 함수에 원형이 없다는 것을 알 수 있다.

화살표 함수 생성 목적

  • 간결한 문법
  • 상위 도메인과 키워드 공유undefined
  • 화살표 함수의 장점

  • 화살표 함수를 사용하여 일반 함수보다 동사가 적다. 예를 들어 this 또는 function
  • return을 미리 정의하고 상하문에서 포획할 수 있다this.

  • 주의: 화살표 함수 내용 실체에서statement를 표현식expression으로 사용할 수 없습니다.

    좋은 웹페이지 즐겨찾기