call apply bind

改变this指向

Function.prototype.call()

Function 实例的 call() 方法会以给定的 this 值和逐个提供的参数调用该函数。

例子

let name="王五" //全局的name

  

let obj = {

   name: '张三',

}

  

function sayName() {

    console.log(this.name);

}



sayName()//undefined?
//this指向obj
sayName.call(obj)//张三

• call 改变this的指向,指向obj
• sayName函数执行了

function Product(name, price) {
  this.name = name;
  this.price = price;
}

function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}

console.log(new Food('cheese', 5).name);
// Expected output: "cheese"

手写call

Function.prototype.apply()

Function实例的 apply() 方法会以给定的 this 值和作为数组（或类数组对象）提供的 arguments 调用该函数。

例子

const numbers = [5, 6, 2, 3, 7];

const max = Math.max.apply(null, numbers);

console.log(max);
// Expected output: 7

const min = Math.min.apply(null, numbers);

console.log(min);
// Expected output: 2

手写

Function.prototype.bind()

Function实例的 bind() 方法创建返回一个新函数，
 
 当调用该新函数时，它会调用原始函数并将其 this 关键字设置为给定的值，同时，还可以传入一系列指定的参数，这些参数会插入到调用新函数时传入的参数的前面。

例子

const module = {
  x: 42,
  getX: function () {
    return this.x;
  },
};

const unboundGetX = module.getX;
console.log(unboundGetX()); // The function gets invoked at the global scope
// Expected output: undefined

const boundGetX = unboundGetX.bind(module);
console.log(boundGetX());
// Expected output: 42

手写