JS：Function对象call、apply、bind改变this指向

文档 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function

语法

Function.length // 返回形参个数
Function.name //  返回函数实例的名称

Function.prototype.call(thisArg, arg1, arg2, ...)

Function.prototype.apply(thisArg, [arg1, arg2, ...]) // 调用给定this值的函数

Function.prototype.bind(thisArg[, arg1[, arg2[, ...]]]) // 创建一个新的函数

1、对象中的this

var name = 'Tom';

let obj = {
  name: this.name,
};

console.log(obj);

// Chrome
// {name: "Tom"}

// Node.js
// { name: undefined }

2、函数中的this

let tom = {
  name: 'Tom',

  sayHello() {
    //   this 默认指向了tom 对象
    console.log(`name is ${this.name}`);
  }
};

let jack = {
  name: 'Jack',
};

tom.sayHello();
// name is Tom


// 改变 this指向

tom.sayHello.call(jack);
// name is Jack

tom.sayHello.apply(jack);
// name is Jack

// 注意bind之后需要再次调用执行
tom.sayHello.bind(jack)();
// name is Jack

参考 javascript中call()、apply()、bind()的用法终于理解 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/call