js의 화살표 함수 형식 및 이에 대한 설명과 일반 함수와의 차이점

이 글은 js의 화살표 함수의 형식과 일반 함수와의 차이점에 대한 설명을 제공합니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

화살표 함수의 형식

// ES5
var selected = allJobs.filter(function (job) {
  return job.isSelected();
});

// ES6 箭头函数
var selected = allJobs.filter(job => job.isSelected());

// ES6
$("#confetti-btn").click(event => {
  playTrumpet();
  fireConfettiCannon();
});

1. 여러 매개변수가 있는 함수(또는 매개변수가 없거나 기본값 또는 구조화되지 않은 매개변수)를 작성하려면 매개변수 목록 주위에 괄호를 추가하세요.
2. 블록이 있는 화살표 함수는 자동으로 값을 반환하지 않습니다. 반품문을 이용해 주세요.
3. 화살표 함수를 사용하여 일반 객체를 생성할 때 주의할 점이 하나 있습니다. 항상 개체를 괄호로 묶습니다.

this는

을 가리킵니다. 화살표 함수에는 고유한 this 값이 없습니다. 이 화살표 함수 내부의 값은 항상 둘러싸는 범위에서 상속됩니다.

object.method() 구문을 사용하여 호출되는 메서드의 경우 화살표가 아닌 함수를 사용하세요. 이러한 함수는 호출자로부터 의미 있는 this 값을 가져옵니다. 다른 모든 것은 화살표 기능을 사용합니다.

{
  ...
  addAll: function addAll(pieces) {
    var self = this;
    _.each(pieces, function (piece) {
      self.add(piece);
    });
  },
  ...
}

// ES6
{
  ...
  addAll: function addAll(pieces) {
    _.each(pieces, piece => this.add(piece));
  },
  ...
}

화살표 함수와 일반 함수의 차이점

화살표 함수와 비화살표 함수 사이에는 또 다른 작은 차이점이 있습니다. 화살표 함수에는 자체 인수 개체가 없습니다.

일반 함수:
1. 함수가 전역 함수로 호출되면 전역 객체를 가리킵니다. 2. 함수가 객체에서 메서드로 호출되면 객체를 가리킵니다. 3. 생성자로 사용되며 new
4 함수의 새 객체를 가리킵니다. 화살표 함수에는 this가 없습니다. 함수 내부는 부모의 가장 가까운 비화살표 함수에서 나오며 이 방향은 변경할 수 없습니다.
2. 화살표 함수에는 super
3이 없습니다. 화살표 함수에는 인수가 없습니다

4. 화살표 함수에는 new.target 바인딩이 없습니다.

5. New는 사용할 수 없습니다.
6. 프로토타입이 없습니다.
7. 중복된 이름의 매개변수는 지원되지 않습니다.

관련 추천:

ES6 화살표 함수에서 이 질문에 답하세요

JavaScript 화살표 함수에 대한 자세한 설명

위 내용은 js의 화살표 함수 형식 및 이에 대한 설명과 일반 함수와의 차이점의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!