>  기사  >  웹 프론트엔드  >  JS의 this 키워드를 깊이 이해하세요.

JS의 this 키워드를 깊이 이해하세요.

迷茫
迷茫원래의
2017-03-26 17:44:231410검색

석사 학위 방어를 마친 후 저는 직업 전환을 위해 계속 열심히 노력하기 시작했습니다. Xiaobai는 어려움을 겪을 것입니다. 이 기사는 JS 핵심 시리즈: 기능 범위에 대한 간략한 설명에서 인용되었습니다.

함수에서 this는 항상 현재 함수의 소유자 객체를 가리킵니다. 이것의 특정 지점은 런타임에만 결정될 수 있으며 호출 객체는 알 수만 있습니다.

window.name = "window";
function f(){
    console.log(this.name);
}
f();//输出window

var obj = {name:'obj'};
f.call(obj); //输出obj

f()가 실행되면 f()를 호출한 쪽이 window 객체이므로 "window"가 출력됩니다.

f.call(obj)은 obj 객체에 f()를 넣고 실행하는데, 이는 obj.f()와 동일합니다. 이때 f에서는 obj이므로 출력은 "obj입니다. ".

code1:

var foo = "window";
var obj = {
    foo : "obj",
    getFoo : function(){
        return function(){
            return this.foo;
        };
    }
};
var f = obj.getFoo();
console.log(1+":"+f()); //输出window

code2:

var foo = "window";
var obj = {
    foo : "obj",
    getFoo : function(){
        var that = this;
        return function(){
            return that.foo;
        };
    }
};
var f = obj.getFoo();
console.log(f()); //输出obj

code1:
var f = obj.getFoo()를 실행하면 다음과 같은 익명 함수가 반환됩니다.
var f = function(){
return this.foo;
}
f()는 window.f()와 동일하므로 f의 this는 창 객체를 가리키고 this.foo는 다음과 같습니다. window.foo이므로 f()는 "window"를 반환합니다.

code2:
var f = obj.getFoo()를 실행하면 다음과 같은 익명 함수도 반환됩니다.
var f = function() {
Return that.foo;
}
유일한 차이점은 f의 this가 that이 된다는 것입니다. 어떤 객체인지 알기 전에 먼저 f의 범위 체인을 결정하세요. f->getFoo-> ; 창에서 해당 항목을 검색하면 getFoo에서 이를 참조하는 것을 찾을 수 있습니다. var f = obj.getFoo()에서 우리는 이것이 getFoo를 가리킨다는 것을 알 수 있습니다. 는 obj 객체이므로 that.foo는 obj.foo와 동일하므로 f()는 "obj"를 반환합니다.

스코프 체인에 대해 잘 모르는 학생은 Scope부터 Closure까지 JavaScript를 참조할 수 있습니다.

위 내용은 JS의 this 키워드를 깊이 이해하세요.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.