자바스크립트 이 | 설명

Jabaseukeulibteu I Seolmyeong



JavaScript에서 가장 어렵고 자주 사용되는 개념 중 하나는 ' 이것 ' 키워드. 자바스크립트는 ' 이것 ” 키워드는 다른 언어와 다릅니다. 그러나 고급 JavaScript 코드를 작성하는 데 필수적입니다. 초심자로서 언급된 키워드의 사용을 이해하는 것이 다소 어려울 수 있지만 걱정하지 마십시오!

이 게시물은 ' 이것 ” 키워드와 JavaScript에서의 사용법.







JavaScript에서 '이것'이란 무엇입니까?

' 이것 '는 기존 코드 블록을 실행하는 객체를 나타내는 JavaScript의 키워드입니다. 현재 함수를 호출하는 개체를 나타냅니다. 다음과 같은 다양한 방식으로 여러 시나리오에서 사용됩니다.



    • 방법에서
    • 이벤트 처리에서
    • 기능에서

언급된 용도를 하나씩 확인해보자!



JavaScript 메소드에서 'this'를 사용하는 방법은 무엇입니까?

' 이것 '는 JavaScript 메서드에서 암시적 바인딩으로 사용됩니다. 함수가 객체와 점의 도움으로 호출되면 암시적 바인딩으로 간주되며 ' 이것 '는 함수 호출 중에 객체를 가리킵니다.





예시

먼저 몇 가지 속성과 메서드를 사용하여 개체를 만든 다음 ' 이것 ” 키워드를 사용하여 객체의 속성 값을 가져옵니다.



var 사람 정보 = {
이름: '남자' ,
나이 : 이십 ,
정보: 기능 ( ) {
console.log ( '하이! 나는 ' + this.이름 + ' 그리고 나는 ' + this.나이 + ' 살이에요' ) ;
}
}


다음으로 ' 정보() ” 메소드와 객체 이름:

사람정보.정보 ( ) ;


현재 개체의 지정된 속성 값이 성공적으로 표시되는 것을 볼 수 있습니다.


'를 사용하려면 이것 ” 이벤트 처리 시 아래 항목을 따르세요.

JavaScript 이벤트 처리에서 'this'를 사용하는 방법은 무엇입니까?

이 예에서 ' 이것 ' 이벤트 처리의 키워드. 이를 위해 한 번의 클릭으로 버튼을 숨기는 예를 고려하십시오. 그렇게 하려면 버튼을 만들고 ' 클릭() ' 이벤트를 사용하여 ' 이것 ” 클릭 시 버튼을 숨길 키워드:

< h3 > 버튼을 숨기려면 클릭 h3 >
< 단추 클릭 = 'this.style.display='없음'' > 여기를 클릭하십시오 ! 단추 >


산출


'의 사용에 대해 혼란스러우면 이것 ” 키워드는 JavaScript의 사용자 정의 함수에서 지정된 섹션을 따릅니다.

JavaScript 함수에서 'this'를 사용하는 방법은 무엇입니까?

'를 사용하는 동안 이것 ” 함수에는 다음을 포함하여 JavaScript에 세 가지 유형의 바인딩이 있습니다.

    • 기본 바인딩
    • 암시적 바인딩
    • 명시적 바인딩

개별적으로 이해합시다!

예 1: 기본 바인딩에서 이 키워드 사용

기본 바인딩에서 ' 이것 ” 키워드는 전역 객체 역할을 합니다. 주로 독립 실행형 기능에서 사용됩니다.

예를 들어 명시된 개념을 이해합시다.

먼저 변수 ' 엑스 '하고 값을 할당하십시오. 열 다섯 ':

변수 x = 열 다섯 ;


그런 다음 ' 함수DB() '와 그 함수 정의에 대해 '같은 이름의 변수를 생성합니다. 엑스 '하고 값을 할당하십시오. 5 '를 입력하고 '를 사용하여 값을 인쇄합니다. console.log() '와 ' 이것 ' 키워드:

변수 함수DB = 기능 ( ) {
변수 x = 5 ;
console.log ( 이.x ) ;
}


마지막으로 ' 함수DB() ' 기능:

기능DB ( ) ;


'의 사용으로 인해 이것 ' 키워드, 출력은 '의 값을 표시합니다. 엑스 ' 처럼 ' 열 다섯 '는 전역 개체로 작동하고 프로세스를 ' 동적 바인딩 ':


예 2: 암시적 바인딩에서 이 키워드 사용

함수가 객체나 점 기호에 의해 호출될 때 ' 이것 ” 키워드는 암시적 바인딩 역할을 합니다. 함수 호출 중에 객체를 가리킵니다.

이 예에서는 ' 정보() '를 사용하고 ' 이것 ' 함수 정의의 키워드:

기능 정보 ( ) {
console.log ( '하이! 나는 ' + this.이름 + ' 그리고 나는 ' + this.나이 + ' 살이에요' )
}


그런 다음 ' 사람정보 ' 정의된 속성:

var 사람 정보 = {
이름: '남자' ,
나이 : 이십 ,
정보: 정보
}


이제 객체를 따라 함수를 호출합니다.

사람정보.정보 ( ) ;


산출


예 3: 명시적 바인딩에서 이 키워드 사용

명시적 바인딩은 ' 하드 바인딩 '를 위해 특정 객체를 활용하기 위해 강제로 함수를 호출하기 때문입니다. 이것 ' 개체에 속성 함수 참조를 두지 않고 바인딩합니다. 이를 위해 call(), apply() 및 bind() 메서드를 사용할 수 있습니다.

이제 '라는 동일한 기능을 사용할 것입니다. 정보() '는 이전 예에서 정의되었습니다. 그런 다음 ' 사람정보 '를 다음 값과 함께 사용합니다.

var 사람 정보 = {
이름: '남자' ,
나이 : 이십
}


'라는 함수를 호출하기 위해 정보() ', 우리는 ' 전화() '메소드를 만들고 생성된 객체를 인수로 전달합니다.

info.call ( 사람정보 ) ;


info()는 객체의 일부가 아니므로 명시적으로 액세스했습니다.


함수를 명시적으로 호출하기 위해 apply() 및 bind() 메서드를 사용할 수도 있습니다. apply() 메서드는 call() 메서드와 동일하지만 bind() 메서드는 원래 함수와 동일한 방식으로 동작하는 동일한 본문 및 범위를 가진 새 함수를 생성합니다. bind() 메서드는 나중에 사용할 수 있는 함수를 반환하는 데 사용할 수 있습니다.

apply() 메서드로 info()를 호출하려면 다음 명령문을 사용하십시오.

정보.적용 ( 사람정보 ) ;


call() 메서드가 제공하는 것과 동일한 출력을 제공합니다.


'라고 부르기 위해 정보() ' 이랑 ' 묶다() ” 메소드를 사용하려면 다음과 같이 주어진 명령문을 활용하십시오.

info.bind ( 사람정보 ) ;


산출


우리는 '와 관련된 모든 필수 정보를 수집했습니다. 이것 ' 키워드.

결론

' 이것 '는 기존 코드 블록을 실행하는 객체를 나타내는 JavaScript의 키워드입니다. 현재 함수를 호출하는 개체를 나타냅니다. 메서드, 이벤트 처리 및 함수를 포함하여 다양한 방식으로 여러 시나리오에서 사용됩니다. 이 게시물에서 우리는 ' 이것 '라는 키워드를 자바스크립트에서