이번에는 javascript에서 호출, 적용, 바인딩의 차이점과 자바스크립트에서 호출, 적용, 바인딩 사용 시 주의사항에 대해 알려드리겠습니다. 다음은 실제 사례입니다.
먼저 ES5에서 제안된 엄격 모드 개념을 추가하세요.
“use strict”
라고 쓰면 다음 JavaScript 코드가 엄격 모드로 작성될 것임을 현재 브라우저에 알릴 수 있습니다.
function fn() { console.log(this); }
fn.call(); // 일반 모드에서는 창, 엄격 모드에서는 정의되지 않음
fn.call(null) // 일반 모드에서는 창, 엄격 모드에서는 null
fn.call(undefine); // 일반 모드에서는 window이고, strict 모드에서는 정의되지 않습니다.
apply 메소드와 call 메소드는 완전히 동일한 기능을 갖고 있으며, 둘 다 메소드의 this 키워드를 변경하는 데 사용됩니다. 메소드를 실행하고, strict 모드와 non-strict 모드에서 첫 번째 매개변수가 null/undefine일 때 규칙은 동일하지만 function의 매개변수를 전달할 때 차이가 있습니다.
function fn(num1, num2) { console.log(num1 + num2); console.log(this); }fn.call(obj , 100 , 200);fn.apply(obj , [100, 200]);123456
call이 fn에 매개변수를 전달할 때 값을 하나씩 전달하지만 Apply는 하나씩 전달하지 않고 fn에 전달할 동일한 매개변수 값을 배열에 넣습니다. 이 작업은 fn의 형식 매개변수에 값을 하나씩 할당하는 것과도 동일합니다.
바인드 메소드는 적용 및 호출과 약간 다릅니다. 바인드 메소드는 fn의 this를 미리 원하는 결과로 변경하고 해당 매개변수 값을 향후 사용할 경우 직접 실행할 수 있습니다. 즉, 바인드도 이것의 방향을 바꿀 수 있지만 적용, 호출과 달리 바로 실행되지는 않습니다.
var tempFn = fn.bind(obj, 1, 2); tempFn();
코드의 첫 번째 줄은 fn에서 이것을 obj로 변경하고 두 개의 매개변수 값 1과 2를 fn에 전달하지만 이때 fn 함수는 실행되지 않습니다. 바인드 실행 시 반환 값이 있습니다. 이 반환 값 tempFn은 fn의 값을 변경한 결과입니다.
참고: 바인딩 방법은 IE6~8에서 호환되지 않습니다.
이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트기타 관련 기사를 주목하세요!
추천 도서:
위 내용은 자바스크립트에서 호출, 적용, 바인딩의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!