> 웹 프론트엔드 > JS 튜토리얼 > 자바스크립트에서 바인딩이란 무엇을 의미하나요?

자바스크립트에서 바인딩이란 무엇을 의미하나요?

藏色散人
풀어 주다: 2023-01-05 16:11:07
원래의
5808명이 탐색했습니다.

JavaScript의 바인딩은 EcmaScript5의 새로운 메서드입니다. 호출 시 제공된 값에 this 키워드를 설정합니다. 제공된 시퀀스를 제공합니다. 논쟁의.

자바스크립트에서 바인딩이란 무엇을 의미하나요?

이 문서의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

JS의 바인드에 대한 간략한 이야기

이 기사에서는 JS의 바인드 애플리케이션을 주로 소개합니다. 이 글에서는 샘플 코드를 통해 자세히 소개합니다. 공부나 업무에 필요한 모든 사람에게 필요한 학습 가치가 있습니다. 에디터와 함께 배워보세요

바인드 메소드라고 하면 다들 Call 메소드와 Apply 메소드를 떠올릴 텐데요. 모두 Function 객체에 내장된 메소드이고 첫 번째 매개변수를 사용해서 변경을 합니다. 호출 메서드에서 이에 대한 포인터입니다. 바인딩은 나중에 호출할 수 있도록 새 함수를 반환하고 원래 함수를 즉시 호출한다는 점에 유의해야 합니다. 오늘은 주로 바인드 메소드의 이해와 사용법을 설명하겠습니다.

bind 메서드는 EcmaScript5의 새로운 메서드입니다. 이 메서드는 다음과 같이 mdn에 도입되었습니다.

bind() 메서드는 호출 시 새 함수(바인딩 함수라고 함)를 생성합니다. 제공된 값, 새 함수를 호출할 때 모든 공급 전에 주어진 인수 시퀀스를 제공합니다.

구문: ​​

fun.bind(thisArg[, arg1[, arg2[, …]]])
로그인 후 복사

매개변수 thisArg의 의미: 바인딩된 함수가 호출될 때 이 매개변수는 이에 대한 포인터로 사용됩니다. 이 매개변수는 new 연산자를 사용하여 바인딩된 함수를 호출할 때 아무런 효과가 없습니다.

매개변수 arg1, arg2, ...는 바인딩된 함수가 호출될 때 이러한 매개변수가 실제 매개변수보다 먼저 바인딩된 메서드에 전달됨을 의미합니다.

먼저 예를 살펴보겠습니다.

this.name="jack";
var demo={
name:"rose",
getName:function(){return this.name;}
}
 
console.log(demo.getName());//输出rose 这里的this指向demo
 
var another=demo.getName;
console.log(another())//输出jack 这里的this指向全局对象
  
//运用bind方法更改this指向
var another2=another.bind(demo);
console.log(another2());//输出rose 这里this指向了demo对象了
로그인 후 복사

bind application

함수의 초기 매개변수를 미리 설정할 수 있습니다.

function a(){
return Array.prototype.slice.call(arguments);//将类数组转换成真正的数组
}
var b=a.bind(this,15,20)
alert(b());//弹出 15,20
var s=b(25,30);
alert(s);//弹出 15,20,25,30
로그인 후 복사

js 바인드의 다중 바인딩은 처음에만 유효합니다.

var getname = function(){console.log(this.name)};
var m = getname.bind({name:'q1'}).bind({name:'q2'});
m();
로그인 후 복사

출력은 q1입니다

【권장됨 학습: javascript 고급 튜토리얼

위 내용은 자바스크립트에서 바인딩이란 무엇을 의미하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿