이에 대한 설명을 Javascript로

Javascript의 this은

초심자 javascript가 js에 대해 많은 혼란을 겪게 될 것임을 가리킵니다. 다음 예 : var

a = 'jack';var obj = {a: ,b : function (){                   콘솔.log(this.a) ;}} ;var c = obj .b;c();//outputjackjs을 처음 접하는 사람들은 이해할 수 있습니다 ,

일부에서는 다른 객체 지향 언어

여기 출력은 tom,이어야 한다고 생각합니다. 하지만 실제로 여기 출력은 jack , 근데 이게 무엇을 요구하는 걸까요?그리고 포스터가 단계별로 분석할 것입니다. step. js를 가리키는 일반적인 this

는 4 유형:1으로 나뉩니다. 객체

객체에 있는 내용

this , 즉, 객체의 속성은 function, 이고

function

에는 this, 의 사용이 포함됩니다. 예를 들어 다음 예는 다음과 같습니다. :

var obj = {a: 'tom',b: function(){            콘솔.log( this.a);}};obj.b(); //출력은 입니다. tom

이 경우 this는 함수를 호출하는 개체를 가리킵니다. 여기는 obj입니다. 또 다른 예는 다음과 같습니다:

var obj = {a: 'tom',b: function(){    console.log (이 . a);},c: {c0: '장미',c1 : 기능 () {                     콘솔.log(this.c0);} } };obj.c .c1();//outputjack

함수 가 호출되면 에는 여러 개체가 포함됩니다. 이 함수는 가장 바깥쪽 개체에 의해 호출되지만 this는 해당 상위 개체

만 가리킵니다. 시작 예에서 왜

?

var a = 'jack';var obj = {a : '톰 ', b: function(){​​​​​​​​​​(this. a); } };var c = obj.b;c();//outputjack 모두들 한 가지씩 this

는

라고 마지막으로 호출한 개체를 가리킵니다. 는 여기의 c 값도 obj.b, 에 할당되어 있지만 변수 c는 여전히 전역 window 개체 , 에 걸려 있으므로 결국 this은 전역 window 개체 2를 가리킵니다. 직접전화하세요 함수

즉, 함수의 선언적 선언이나 변수 선언을 직접 사용

, 글로벌 세계에서 함수를 직접 호출

var name = 'tom';var a = function(){ var 이름 = ' jack';console.log(this.name);};console.log (a( ; ow.a()그래서 this는 전역 window

개체

를 가리킵니다. 에는 이 경우가 포함됩니다. :var 이름 = '톰 ' ;var a = function

(){

var name = 'jack' ;기능 b ㅋㅋㅋ ) //출력톰 ㅋㅋㅋ 아 ()) ; //출력tom

a 및 b는 모두 tom을 출력하고, 함수 b 는 함수에서 이후에 호출될 때 여전히 전역 windowobject를 가리킵니다. , 왜 이것이 한 문장을 기억할 수 있습니다. js에 함수를 직접 호출하는 개체가 없으면 함수가 호출될 때 this의 포인터가 됩니다. 은 window 객체 를 가리킬 것입니다. , obect.function()을 호출할 때 이전 예제와 같습니다. this

은

에서 object을 가리킬 것입니다. 좋아요 var

obj = {a: 'tom',b: function (){ 콘솔. log (this.a);}};obj.b() ; //출력 tom 첫 번째 예와 마찬가지로 이 문장으로 이해하기 쉽습니다 , 함수

c 호출에는 개체 호출이 없으므로 전역 창문 개체

var a = 'jack';var obj = {a: 'tom', b: function(){      console.log(this.a); } };var c = obj.b;c();//outputjack

3. 생성자에 있는 this

의 포인터입니다.

Js 에서는 생성자와 일반 함수 사이에 명확한 구분이 없습니다. 일반 함수를 사용하여 객체 유형을 생성하는 경우 이를 생성자 또는 생성자라고 합니다. 함수가 실제 생성자로 작동하려면 다음 조건을 충족해야 합니다:

1 일반적으로 속성과 메서드를 추가하여 함수 내에서 새 객체(this)의 속성을 설정합니다.

2, 생성자는 반환 문을 포함할 수 있지만(권장되지 않음) 반환 값은 this 또는 기타 비객체 유형 값이어야 합니다.

예를 들어:

기능 People(name, age, sex){this.name = 이름;this p = new People ('tom',12,'남성 '); console.log (p.name + p.sex + p.age); //Outputtom 남자12 여기 this는 현재 생성된 객체를 가리킵니다. 물론 생성자에도 특별한 경우가 있습니다, 예를 들어:

기능 People(name, age, sex){this.name = 이름;this ㅋㅋㅋ ;}var p = new People('tom',12,'남성 ' );콘솔. log(p.name);//outputundefine여기서 생성자의 반환 값이 this 또는 객체가 아닌 유형 , 여기서 People은 엄밀한 의미에서 생성자가 아닙니다, 여기에 선언된 p은 실제로 함수 People의 반환 값일 뿐입니다. , 그래서 최종 출력은

undefine 입니다.

여기서 반환된 값을 객체가 아닌 유형으로 변경하면 최종 결과는 달라집니다

기능 People(name, age, sex){this.name = 이름;this ㅋㅋㅋ p = 새 People('tom',12,'male');콘솔 로그(p. name);//outputtom엄밀한 의미에서 People은 생성자입니다, So thisstill 현재 생성된 것을 가리킨다. 개체

4. call 또는 applyCall 함수

Call과 apply 함수는 거의 같습니다, 첫 번째 매개변수는 호출 함수의 개체입니다 , 뒤에 의 매개변수는 모두 함수 매개변수입니다, 는 단지 call입니다. 함수의 매개변수 전달 방법은 무제한의 매개변수 , , 즉 call([ thisObject[,arg1 [,arg2 [ ,...,argn]]]]) 뒤의 매개변수는 각각 함수 호출의 매개변수 , 에 해당하며 apply 함수의 첫 번째 매개변수는 call과 동일, 두 번째 매개변수는 배열 유형입니다, apply([thisObj [,argArray] ])배열의 각 요소는 함수 호출의 매개변수에도 해당합니다. , call 또는 apply를 사용하는 경우 함수는 이며, 메서드의 this은 call의 첫 번째 매개 변수로 리디렉션됩니다. 또는 신청하세요 기능 , 예를 들어:

var a = 1;var b = 2;var c = {a: 3 ,b: 4};function add(){  console.log( 이. a + this.b)}add();//output3add .신청(c );//Output7

첫 번째 add 호출에는 개체에 대한 직접 호출이 없으므로 전역 window 개체를 가리킵니다. 출력 결과는 3입니다. 첫 번째 add 함수는 apply 함수를 통해 호출되므로 this의 포인터는 c 로 향하게 됩니다. 최종 출력 결과는 7

Es6Expansion:

입니다.

this Es6에 있는 화살표 함수의 this 포인터는 es5의 this과 다릅니다. 여기서 언급하겠습니다: 제본 this, 이는 자신이 있는 컨텍스트(즉, 정의된 위치)의 this 값을 자체 this 값으로 캡처하므로 call() / apply() / 바인딩() 메소드는 화살표 함수에 매개변수만 전달하며 해당 this 에는 영향을 미치지 않습니다. this 이 어휘 수준에 있다는 점을 고려하면 엄격 모드에서

this

과 관련된 규칙은 무시됩니다.

1 objectvar a = {name: 'tom',b: { c: ( ) => };a.b , so 객체에서 화살표 기능을 사용할 때 this의 포인터도 전역 창을 가리킵니다. object.2. 메소드에서 화살표 함수 호출

var test = function(){this.시간 = 1 ;setTimeout(()= > 00)}; var t = new test();// 출력 1 거기 this는 화살표 함수의 pointer, so 포인팅은 생성된 컨텍스트에만 관련됩니다. , 여기에 생성자의 호출이 있으므로 this를 포인팅합니다. test의 는 t

object

, 따라서 화살표 함수의 this도 반환 개체 를 가리킵니다. 에 대한 더 많은 관련 내용을 보려면 PHP 중국어 웹사이트를 주목하세요. 관련 추천: Word, txt, Excel, PPT 및 기타 파일을 업로드하는 WeChat 미니 프로그램에 대한 자세한 설명 백엔드 PHP를 통해 WeChat 미니 프로그램을 통해 파일을 다운로드하는 방법 MySQL 성능 향상을 위한 7가지 팁 소개

위 내용은 이에 대한 설명을 Javascript로의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!