# call & apply

call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。applycall只有一个区别,就是 call()方法接受的是一个参数列表,而 apply() 方法接受的是一个包含多个参数的数组。

# 语法

  • call

javascript function.call(thisArg, arg1, arg2, ...)

  • apply

javascript function.apply(thisArg, [argsArray])

# 关于 this

callapply的第一个参数是thisArg, 如果这个参数不为空,则执行函数的this会绑定到thisArg上。如果thisArg为空或者null,这个要看是否运行在严格模式,严格模式下执行函数的this指向undefined,非严格模式指window

function greet() {
  var reply = [this.animal, "typically sleep between", this.sleepDuration].join(
    " "
  );
  console.log(reply);
}

var obj = {
  animal: "cats",
  sleepDuration: "12 and 16 hours",
};

greet.call(obj); // cats typically sleep between 12 and 16 hours
1
2
3
4
5
6
7
8
9
10
11
12
13
"use strict";

var sData = "Wisen";

function display() {
  console.log("sData value is %s ", this.sData);
}

display.call(); // Cannot read the property of 'sData' of undefined
1
2
3
4
5
6
7
8
9

# 应用场景

# 用 apply 将数组各项添加到另一个数组

var array = ["a", "b"];
var elements = [0, 1, 2];
array.push.apply(array, elements);
console.info(array); // ["a", "b", 0, 1, 2]
1
2
3
4

# 使用 apply 和内置函数

function minOfArray(arr) {
  var min = Infinity;
  var QUANTUM = 32768; //防止数组过大,导致参数个数溢出,JS Core中为65536

  for (var i = 0, len = arr.length; i < len; i += QUANTUM) {
    var submin = Math.min.apply(null, arr.slice(i, Math.min(i + QUANTUM, len)));
    min = Math.min(submin, min);
  }

  return min;
}

var min = minOfArray([5, 6, 2, 3, 7]);
1
2
3
4
5
6
7
8
9
10
11
12
13

# 使用 call 方法调用父构造函数

在一个子构造函数中,你可以通过调用父构造函数的 call 方法来实现继承

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

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

function Toy(name, price) {
  Product.call(this, name, price);
  this.category = "toy";
}

var cheese = new Food("feta", 5);
var fun = new Toy("robot", 40);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

#

最后更新时间: 1/18/2021, 8:54:04 PM