javascript_javascript 기술의 call(), apply() 및 바인딩() 사용법에 대한 간략한 설명

call(thisObj, arg1, arg2...) 및 apply(thisObj, [obj1, obj2...]) 두 메소드는 모든 함수에 포함되는 상속되지 않는 메소드입니다

(thisobj[, args]) 호출 및 적용(thisobj[, args])

효과는 동일합니다. 간단히 말해서 현재 이 메서드를 사용하는 개체의 this 포인터를 호출 메서드의 thisObj 개체를 가리키도록 변경합니다. 둘 사이의 차이점은 첫 번째 매개변수가 동일하다는 것입니다. 호출 메소드에 전달됩니다. 입력된 매개변수는 하나씩 나열되며, 적용 메소드의 두 번째 매개변수는 배열입니다.

예를 들면 더 직관적입니다.

window.color='red';
var o={color:"blue"};
function sayColor(){
alert(this.color);
};
sayColor(); //red（全局函数，this是window）
sayColor.call(this);//red(调用call方法，指定对象是this，这里的this是window，没什么意义)
sayColor.call(window);//red(调用call方法，指定对象是window，没什么意义)
sayColor.call(o); //blue (调用call方法，指定对象是o，所以this指代对象o，这里由原来的window指向了o)
sayColor.apply(o);//blue (调用call方法，指定对象是o，所以this指代对象o，这里由原来的window指向了o)

ECMAScript5의 바인딩() 메서드는 처음 두 메서드와 유사합니다. 바인딩() 메서드는 함수의 인스턴스를 생성하고 이 인스턴스의 this 값은 함수에 전달된 값에 바인딩됩니다. 바인드() 함수

예:

function a(y){
return this.x+y;
};
var o={x:1};
var g=a.bind(o);
g(2);//3

함수 a가 객체 o에 바인딩되어 새로운 함수 g를 반환하는 것을 예시에서 볼 수 있습니다. g가 호출되면 함수 a가 객체 o의 메서드로 호출됩니다.
바인딩() 메소드는 함수를 객체에 바인딩하고 새 함수를 반환합니다. 이 새 함수에 전달된 모든 매개변수는 바인딩된 함수에 전달됩니다.

차이점을 살펴보겠습니다

JS에서는 이 세 가지가 함수의 this 객체 포인터를 변경하는 데 사용됩니다.
차이점에 대해 이야기하기 전에 세 가지의 유사점을 요약해 보겠습니다.
1. 이들은 모두 함수의 this 개체의 지점을 변경하는 데 사용됩니다.
2. 첫 번째 매개변수는 이것이 가리키는 객체입니다.
3. 후속 매개변수를 사용하여 매개변수를 전달할 수 있습니다.
그럼 차이점은 무엇입니까? 먼저 예를 살펴보겠습니다.
              var xw = {
                      이름: "작은왕",
성별 나이: 24세,
말하세요: function() {
Alert(this.name " , " this.gender " ,올해 " this.age); |                 }
              var xh = {
                      이름: "小红",
성별 나이: 18
                }
                    xw.say();
그 자체로는 할 말이 많지 않습니다. 보이는 사람은 올해 24세의 남성 Xiao Wang임에 틀림없습니다.

그래서 xw의 say 메소드를 사용하여 xh의 데이터를 표시하는 방법은 무엇입니까?

통화하려면 다음을 수행하세요.

코드 복사

코드는 다음과 같습니다. xw.say.call(xh);

신청하려면 다음을 수행하세요.

코드 복사

코드는 다음과 같습니다. xw.say.apply(xh);

바인드의 경우 다음과 같아야 합니다.

코드 복사

코드는 다음과 같습니다. xw.say.bind(xh)();

如果直接写xw.say.bind(xh)是不会有任何结果的，看到区别了吗？call和apply都是对函数的直接调用，而bind方法返回的仍然是一个函数，因此后面还需要()来进行调用才可以。
那么call和apply有什么区别呢？我们把例子稍微改写一下。

        var xw = {
            name : "小王",
            gender : "男",
            age : 24,
            say : function(school,grade) {
                alert(this.name + " , " + this.gender + " ,今年" + this.age + " ,在" + school + "上" + grade);                
            }
        }
        var xh = {
            name : "小红",
            gender : "女",
            age : 18
        }

可以看到say方法多了两个参数，我们通过call/apply的参数进行传参。
对于call来说是这样的

复制代码 代码如下:

xw.say.call(xh,"实验小学","六年级");      

而对于apply来说是这样的

复制代码 代码如下:

xw.say.apply(xh,["实验小学","六年级郑州牛皮癣医院"]);

看到区别了吗，call后面的参数与say方法中是一一对应的，而apply的第二个参数是一个数组，数组中的元素是和say方法中一一对应的，这就是两者最大的区别。
那么bind怎么传参呢？它可以像call那样传参。

复制代码 代码如下:

xw.say.bind(xh,"实验小学","六年级")();

但是由于bind返回的仍然是一个函数，所以我们还可以在调用的时候再进行传参。

复制代码 代码如下:

xw.say.bind(xh)("实验小学","六年级");

以上所述就是本文的全部内容了，希望大家能够喜欢、