웹 프론트엔드 JS 튜토리얼 js에서 이 포인터를 변경하는 방법은 무엇입니까?

js에서 이 포인터를 변경하는 방법은 무엇입니까?

May 06, 2024 pm 01:57 PM
범위

JavaScript에서는 다음 방법을 사용하여 이 포인터를 변경할 수 있습니다. 바인딩: 이 값이 지정된 개체에 바인딩된 새 함수를 반환합니다. 호출 및 적용: 함수를 직접 호출하고 이 값을 지정할 수 있습니다. 화살표 함수: 이를 상위 범위에 암시적으로 바인딩합니다.

js에서 이 포인터를 변경하는 방법은 무엇입니까?

JavaScript에서 가리키는 this를 변경하는 방법this 指向的方法

在 JavaScript 中,this 关键字引用当前执行上下文的当前对象。但是,有时候需要改变 this 的指向,以便在不同的对象上下文中使用相同的方法。以下是在 JavaScript 中改变 this 指向的几种方法:

1. 绑定(Bind)

bind() 方法返回一个新函数,该函数的 this 值已绑定到指定的对象。语法如下:

<code>function.bind(object)</code>
로그인 후 복사

例如:

<code>const person = {
  name: 'John',
  greet: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

const boundGreet = person.greet.bind({ name: 'Mary' });
boundGreet(); // 输出:"Hello, my name is Mary"</code>
로그인 후 복사

2. 调用(Call)和应用(Apply)

call()apply() 方法直接调用一个函数,并允许您指定 this 值。语法如下:

<code>function.call(object, arg1, arg2, ...)
function.apply(object, [arg1, arg2, ...])</code>
로그인 후 복사

bind() 不同,call()apply() 会立即执行函数。

例如:

<code>const person = {
  name: 'John'
};

function greet(greeting) {
  console.log(`${greeting}, my name is ${this.name}`);
}

greet.call(person, 'Hello'); // 输出:"Hello, my name is John"
greet.apply(person, ['Hello']); // 输出:"Hello, my name is John"</code>
로그인 후 복사

3. 箭头函数

箭头函数(=&gt;)隐式地绑定 this 到其父级作用域。这意味着箭头函数内的 this

JavaScript에서 this 키워드는 현재 실행 중인 현재 개체를 나타냅니다. 문맥. 그러나 때로는 동일한 메소드가 다른 객체 컨텍스트에서 사용될 수 있도록 this의 포인터를 변경해야 하는 경우가 있습니다. 다음은 JavaScript에서 this의 지점을 변경하는 여러 가지 방법입니다.

🎜1. Bind(Bind)🎜🎜bind() 메서드는 새 값을 반환합니다. this 값이 지정된 개체에 바인딩된 함수입니다. 구문은 다음과 같습니다. 🎜
<code>const person = {
  name: 'John',
  greet: () =&gt; {
    console.log(`Hello, my name is ${this.name}`);
  }
};

person.greet(); // 输出:"Hello, my name is John"</code>
로그인 후 복사
🎜예: 🎜rrreee🎜🎜2. 호출 및 적용🎜🎜call()apply() 메서드 호출 함수를 직접 사용하고 this 값을 지정할 수 있습니다. 구문은 다음과 같습니다. 🎜rrreee🎜 bind()와 달리 call()apply()는 함수를 즉시 실행합니다. 🎜🎜예: 🎜rrreee🎜🎜3. 화살표 함수🎜🎜화살표 함수(=&gt;)는 암시적으로 this를 상위 역할 영역에 바인딩합니다. 즉, 화살표 함수 내부의 this 값은 항상 해당 함수를 생성한 개체를 가리킵니다. 🎜🎜예: 🎜rrreee

위 내용은 js에서 이 포인터를 변경하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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

뜨거운 기사 태그

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

C 언어에서 typedef 구조체 사용법 C 언어에서 typedef 구조체 사용법 May 09, 2024 am 10:15 AM

C 언어에서 typedef 구조체 사용법

Java에서 예상되는 변수를 해결하는 방법 Java에서 예상되는 변수를 해결하는 방법 May 07, 2024 am 02:48 AM

Java에서 예상되는 변수를 해결하는 방법

js 클로저의 장점과 단점 js 클로저의 장점과 단점 May 10, 2024 am 04:39 AM

js 클로저의 장점과 단점

C++에서 include의 의미는 무엇입니까? C++에서 include의 의미는 무엇입니까? May 09, 2024 am 01:45 AM

C++에서 include의 의미는 무엇입니까?

C++ 스마트 포인터: 수명 주기에 대한 포괄적인 분석 C++ 스마트 포인터: 수명 주기에 대한 포괄적인 분석 May 09, 2024 am 11:06 AM

C++ 스마트 포인터: 수명 주기에 대한 포괄적인 분석

js에서 이것이 다음을 가리키는 여러 가지 상황이 있습니다. js에서 이것이 다음을 가리키는 여러 가지 상황이 있습니다. May 06, 2024 pm 02:03 PM

js에서 이것이 다음을 가리키는 여러 가지 상황이 있습니다.

C++에서 함수 정의와 호출을 중첩할 수 있나요? C++에서 함수 정의와 호출을 중첩할 수 있나요? May 06, 2024 pm 06:36 PM

C++에서 함수 정의와 호출을 중첩할 수 있나요?

Java에서는 클로저가 어떻게 구현됩니까? Java에서는 클로저가 어떻게 구현됩니까? May 03, 2024 pm 12:48 PM

Java에서는 클로저가 어떻게 구현됩니까?

See all articles