具体内容以及示例可参见网站： https://www.codingame.com/playgrounds/9799/learn-solve-call-apply-and-bind-methods-in-javascript

需要记住的基本规则

1. "this"指代一个对象

2. "this"指的是调用它包含的函数的对象。

3. 在全局上下文中，“this”指的是窗口对象，或者如果使用“严格模式”则是未定义的。

   var car = { 
    registrationNumber: "GA12345",
    brand: "Toyota",
   
    displayDetails: function(){
        console.log(this.registrationNumber + " " + this.brand);
    }
   }

   car.displayDetails(); // GA12345 Toyota

一旦想要借用一个方法

var myCarDetails = car.displayDetails; myCarDetails();

好吧，这将不起作用，因为“this”现在将分配给既没有 registrationNumber 也没有brand属性的全局上下文。

bind()方法

var myCarDetails = car.displayDetails.bind(car); myCarDetails(); // GA12345 Toyota

bind() 方法创建了一个新函数，其中“this”指的是上述案例“car”中括号中的参数。 这样，bind() 方法就可以使用指定的“this”值调用函数。

用bind()方法提供参数的方法

var car = { 
    registrationNumber: "GA12345",
    brand: "Toyota",

    displayDetails: function(ownerName){
        console.log(ownerName + ", this is your car: " + this.registrationNumber + " " + this.brand);
    }
}

var myCarDetails = car.displayDetails.bind(car, "Vivian"); myCarDetails() // Vivian, this is your car: GA12345 Toyota

只需要将参数放置在引用对象后面，用音乐号进行分割，就可以将参数传入car对象的displayDetails方法中

call()以及apply()方法

当遇到独立于对象之外的函数时，可以使用call()或者apply()方法

var car = { 
    registrationNumber: "GA12345",
    brand: "Toyota"
}

function displayDetails(ownerName) {
    console.log(ownerName + ", this is your car: " + this.registrationNumber + " " + this.brand);
}

使用apply()方法

displayDetails.apply(car, ["Vivian"]); // Vivian, this is your car: GA12345 Toyota

或者

displayDetails.call(car, "Vivian"); // Vivian, this is your car: GA12345 Toyota

请注意，使用 apply() 函数时，参数必须放在数组中。 Call() 接受参数数组和参数本身。

一些代码段示例

var func = function() {
    console.log(this)
}.bind(1);

func();

[Number: 1]

var func = function() {
    console.log(this)
}.bind(1);

 var obj = {
    callFun : func
 }
obj.callFun.func();

/project/target/index.js:8 obj.callFun.func(); ^ TypeError: obj.callFun.func is not a function

function checkFun(a, b, c){
    console.log(this);
    console.log(a);
    console.log(b);
    console.log(c);
}
checkFun.call(1,2,3,4);

[Number: 1] 2 3 4

function checkFun(a, b, c){
    console.log(this);
    console.log(a);
    console.log(b);
    console.log(c);
}
checkFun.apply(1,[2,3,4]);

[Number: 1] 2 3 4

"use strict";
var zipcode = {
    checkZipcode : function() {
        console.log(this);
        function updateZipCode() {
            console.log(this);
        }
        updateZipCode.call(this);
    }
}
zipcode.checkZipcode();

{ checkZipcode: [Function: checkZipcode] } { checkZipcode: [Function: checkZipcode] }

"use strict";
var zipcode = {
    checkZipcode : function() {
        console.log(this);
        var updateZipCode = function() {
            console.log(this);
        }.bind(this);
        updateZipCode();
    }
}
zipcode.checkZipcode();

{ checkZipcode: [Function: checkZipcode] } { checkZipcode: [Function: checkZipcode] }

"use strict";
var person = {
    name : "Jack",
    prop : {
        name : "Daniel",
        getName : function() {
            return this.name;
        }
    }
}

var name = person.prop.getName.bind(person);
console.log(name());

var  name = person.prop.getName();
console.log(name);

Jack Daniel