javascript 기초:this 포인터 수정

3355 단어

제목.


f의this가 지정한 대상을 가리키도록 함수 f를 봉인합니다.

입력 예

bindThis(function(a, b) {
    return this.test + a + b;
}, {test: 1})(2, 3);

출력 예

6

분석하다.


제목 해제


이 제목의 요구는 하나의 함수 bindThis를 봉인하는 것이다. 이 함수는 두 개의 매개 변수가 있다. 첫 번째 매개 변수는 내부에this지침을 사용하는 함수 f이고 두 번째 매개 변수는 대상obj이다. bindThis를 실행한 후에 하나의 함수를 되돌려주면 이 함수 안의 this는obj에 묶여 있다.그래, 나도 이걸 처음 봤을 때 어지러웠다는 걸 인정한다. 하지만 내가 그것을 아래의 모습으로 쓰면 많이 좋아지지 않을까?
function f(a, b) {
    return this.test + a + b;
}

function bindThis(f, obj) {
    // 
}

// 
var a = bindThis(f,{test:1});
a(2,3);

this 소개


this는 Javascript 언어의 키워드입니다.이것은 함수 를 대표하며 자동으로 생성된 내부 대상은 함수 내부에서만 사용할 수 있다(유사한arguments).구체적인 것은 완일봉의 자바스크립트의this용법과 변수가 다르고 키워드this는 작용역의 제한이 없으며 끼워 넣은 함수는 호출된 함수에서this를 계승하지 않는다.간단하게 this의 지향을 네 가지 상황으로 나눈다.
  • 함수 호출은 함수의 가장 일반적인 사용법으로 전역 호출에 속한다. 그this의 값은 전역 대상 글로벌(비엄격한 모드에서)이 아니라undefined(엄격한 모드에서)이다.
  • 대상 방법 호출 함수는 특정한 대상의 방법으로 호출할 수 있는데 이때this는 이 상급 대상을 가리킨다.
  • 구조 함수는 이른바 구조 함수를 호출하는데 이 함수를 통해 새로운 대상(object)을 생성하는 것이다.이때,this는 이 새로운 대상을 가리킨다.
  • bind apply call apply ()는 함수 대상의 한 방법으로 함수의 호출 대상을 바꾸는 역할을 한다. 첫 번째 매개 변수는 변경된 함수의 호출 대상을 나타낸다.따라서this는 이 첫 번째 매개 변수를 가리킨다.bind, 콜이 유사합니다.

  • 총괄:this 키워드는 누가 나를 호출하면 내가 누구를 가리키는 것이다.

    해결 방법


    먼저, this 라는 몇 글자를 보고 조건 반사를 원하지 않는 자바스크립트의 삼총사:bind apply call?

    bind apply call의 차이점


    콜과 apply는 모두 어떤 함수가 실행될 때의context 즉 상하문을 바꾸기 위해 존재하는 것이다. 다시 말하면 this 를 위한 것이다.JavaScript의 함수에는 정의할 때 상하문과 실행할 때 상하문, 그리고 상하문은 바꿀 수 있다는 개념이 존재하기 때문이다.
  • 공통점: 함수에this를 귀속할 수 있습니다.
  • 차이점:call과 apply의 기본적인 차이점: 파라미터가 다르다.pply()는 두 개의 매개 변수를 수신하는데 첫 번째는this를 연결하는 값이고 두 번째는 매개 변수 그룹이다.콜()은 첫 번째 매개 변수도this에 귀속된 값이지만 뒤에 받아들인 것은 부정확한 매개 변수이다. 더 이상 하나의 수조가 아니다. 즉, 평소에 함수에 전참하는 것처럼 이 매개 변수를 하나하나 전달할 수 있다.bind의 차이: 새로운 함수를 만듭니다.구체적인 것은 이 글을 보면 자바스크립트의 Function을 이해할 수 있다.prototype.bind

  • 해결 방법 1:bind 사용()


    다음 예는 그 중의 해결 방법이고bind() 방법은 새로운 함수를 만들었다는 것을 설명한다.
    function f(a, b) {
        return this.test + a + b;
    }
    
    function bindThis(f, obj) {
        // 
        return f.bind(obj);
    }
    
    // 
    var a = bindThis(f,{test:1});
    console.log(a(2,3));
    console.log(f(2,3));
    

    결과 출력:
    6
    NaN
    

    해결 방법2: apply 사용()

    function bindThis(f, obj) {
        // 
        return function () {
            return f.apply(obj, arguments);
        };
    }
    

    여기에 함수를 사용하여 apply 방법을 포장한 다음 이 함수를 되돌려줍니다.arguments는 JavaScript의 모든 함수에 특별한 변수arguments에 접근할 수 있습니다.이 변수는 이 함수에 전달되는 모든 매개 변수의 목록을 유지하고 있습니다.
    주의:arguments는 함수 내의 변수로 정의되었기 때문입니다.따라서 var 키워드를 통해arguments를 정의하거나arguments를 하나의 형식 매개 변수로 설명하면 원생적인arguments가 생성되지 않습니다.
    arguments 변수는 배열(Array)이 아닙니다.문법상 수조와 관련된 속성length가 있지만, Array에서 사용하지 않습니다.prototype 상속, 실제로는 하나의 대상 (Object) 이다.

    해결 방법 3:call() 사용


    apply ()와 유사하며 매개 변수의 전송 방식만 다릅니다.
    function bindThis(f, obj) {
        // 
        return function (a,b) {
            return f.call(obj, a,b);
        };
    }
    

    총결산


    이 제목은 주로 this 키워드와 this의 지향을 바꾸는 방법을 고찰한 다음에 재능이 부족하고 학문이 얕아서 이 몇 가지 방법을 찾을 수 밖에 없다. 그러나 자바스크립트라는 언어의 유연성을 감안하면 저는 항상 다른 방법이 있을 것 같아서 여러분들이 아낌없이 가르침을 주실 수 있기를 바란다.

    좋은 웹페이지 즐겨찾기