2017-10-26 1 views
0

에 종료 프로젝트에서이 줄은 나에게 구문 오류"대해 forEach를 (엘 => {})"와 "대해 forEach (함수() {})"자바 스크립트

document.querySelectorAll('[name="callqualitycheck"]').forEach(e=> { 
    if(e.checked){comment = comment + "," + e.value;} 
}); 

을 제공하는 경우 I forEach(e=> {forEach(function(e) {으로 변경하십시오. 잘 작동합니다. 하지만 차이점은 무엇인지 확실하지 않으며 앞으로 문제가 발생하지 않을 것입니다. 누구든지 이것을 설명 할 수 있습니까?

+2

=>은 ES2015 기능입니다. 화살표 기능입니다. 이 값이 내부 메소드에 전달된다는 것을 제외하고는 function()과 동일한 기능을 수행합니다. 즉,이 값을 함수에 바인드 할 필요가 없습니다. 더 많은 정보는 여기에 있습니다 - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions – Jackthomson

+2

화살표 함수 구문'=>'은 더 새로운 것입니다. 이걸 어디에서 실행하려고합니까? 브라우저에서? 브라우저가 새로운 구문을 이해합니까? 이 기사의 브라우저 섹션을 확인하십시오. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions – mortb

답변

-1

람다 함수에 대괄호 {}가 필요하지 않습니다. 예를 들어 삼항 연산자로 수행 할 수 있습니다.

document.querySelectorAll('[name="callqualitycheck"]').forEach(e=> 
    comment += e.checked?','+e.value:''); 
+0

해당 사항 없음 – DanilGholtsman

+0

네, 맞습니다. 다음 번에 코드 대신 질문에 더 집중해야합니다 ;-) – zruF

2

forEach(e => { code })forEach(function(e){ other code }) 그러나 그들은 그 자체로 동등하지 않은, 같은 작업을 수행 할 수 있습니다.

첫 번째 버전은 화살표 기능을 ECMA6에 도입했습니다. 화살표 함수는 바깥 쪽 범위의 this을 캡처합니다. 즉, this을 사용할 때 해당 함수의 범위를 나타냅니다. 그러나 일반 함수는 this입니다. 화살표 기능에 자신의 this이 없다는 사실은 사실 그것이 도입 된 이유 중 하나입니다. (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions)

두 번째 차이점은 화살표 기능을 바인딩 할 수 없다는 것입니다.

엄격 모드에서는 또 다른 차이가 발생합니다. 이것이 주변의 어휘 문맥에서 오는 것을 감안할 때, 이것에 관한 엄격한 모드 규칙은 화살표 함수에 의해 무시됩니다.

기본적으로 둘 중 하나를 사용하여 동일한 작업을 수행 할 수 있지만 사용자의 경우에 따라 다른 작업보다 편리 할 수 ​​있습니다.

+2

그들은 동등하지 않습니다 - 주요 차이점이 있습니다. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions –

+3

그들은 ** ** 상당합니다! Arrow 함수는 외부 범위의'this'를 캡쳐하는 반면, 정규 함수는 자신의'this'를 가질 것이다. 아무런 차이가 없지만 기능이 동일하지 않은 OP의 코드에서. 또한 화살표 함수를'.bind() '할 수 없습니다. –

관련 문제