none

0%

call 和 apply 性能对比

发表于 更新于

总结

call 确实比 aplly 快一个数量级

起因

lodash 对 apply的封装源码。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/**
  * A faster alternative to `Function#apply`, this function invokes `func`
  * with the `this` binding of `thisArg` and the arguments of `args`.
  *
  * @private
  * @param {Function} func The function to invoke.
  * @param {*} thisArg The `this` binding of `func`.
  * @param {Array} args The arguments to invoke `func` with.
  * @returns {*} Returns the result of `func`.
  */
 function apply(func, thisArg, args) {
   switch (args.length) {
     case 0: return func.call(thisArg);
     case 1: return func.call(thisArg, args[0]);
     case 2: return func.call(thisArg, args[0], args[1]);
     case 3: return func.call(thisArg, args[0], args[1], args[2]);
   }
   return func.apply(thisArg, args);
 }

今天在回看 lodash 源码中的 apply 方法时产生一个疑惑，call 是不是比 apply 快一些，可以看到，对于参数个数小于等于 3 个时内部其实就是调用的原来的 call 方法。

验证

这里通过进行一百次的百万次调用取平均值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
const foo = {
  count: 1,
}
function func(name, a, b, c, d) {
  return name + this.count
}

function call(args) {
  const t = Date.now()
  for (let i = 0; i < 1000000; i++) {
    switch (args.length) {
      case 0:
        func.call(foo)
        break
      case 1:
        func.call(foo, args[0])
        break
      case 2:
        func.call(foo, args[0], args[1])
        break
      case 3:
        func.call(foo, args[0], args[1], args[2])
        break

      case 4:
        func.call(foo, args[0], args[1], args[2], args[3])
        break
      case 5:
        func.call(foo, args[0], args[1], args[2], args[3], args[4])
        break
    }
  }
  const r = Date.now() - t
  // console.log(`${args.length}个参数 call 耗时${r}ms`)
  return r
}
function apply(args) {
  const t = Date.now()
  for (let i = 0; i < 1000000; i++) {
    switch (args.length) {
      case 0:
        func.apply(foo)
        break
      case 1:
        func.apply(foo, args)
        break
      case 2:
        func.apply(foo, args)
        break
      case 3:
        func.apply(foo, args)
        break
      case 4:
        func.apply(foo, args)
        break
      case 5:
        func.apply(foo, args)
        break
    }
  }
  const r = Date.now() - t
  // console.log(`${args.length}个参数 apply 耗时${r}ms`)
  return r
}
const arr1 = [0, 0, 0, 0, 0, 0]
const arr2 = [0, 0, 0, 0, 0, 0]
for (let i = 0; i < 100; i++) {
  arr1[0] += call([1])
  arr1[1] += call([1, 2])
  arr1[2] += call([1, 2, 3])
  arr1[3] += call([1, 2, 3, 4])
  arr1[4] += call([1, 2, 3, 4, 5])

  arr2[0] += apply([1])
  arr2[1] += apply([1, 2])
  arr2[2] += apply([1, 2, 3])
  arr2[3] += apply([1, 2, 3, 4])
  arr2[4] += apply([1, 2, 3, 4, 5])
}
arr1[0] /= 100
arr1[1] /= 100
arr1[2] /= 100
arr1[3] /= 100
arr1[4] /= 100

arr2[0] /= 100
arr2[1] /= 100
arr2[2] /= 100
arr2[3] /= 100
arr2[4] /= 100

for (let i = 0; i < 5; i++) {
  console.log(`${i + 1}个参数调用call 循环一百万 * 100 次平均消耗${arr1[i]}ms`)
  console.log(`${i + 1}个参数调用apply 循环一百万 * 100 次平均消耗${arr2[i]}ms`)
}

结果

浏览器

image-20210425233316409

Node V14

image-20210425233410036

结论

call 确实比 aplly 快一个数量级