箭头函数是否比绑定方法更快地传递此参数

Question

我已经尝试使用 ES6 一段时间了，我对 .bind(this) 方法与新箭头函数相比的性能有疑问。

我想知道对传统函数使用 .bind(this) 是否有任何性能改进，或者对用户箭头函数是否更好以及为什么。

我进行了以下测试，但我不确定为什么每次执行测试时都会得到不同的值。

function useBind() {
    if(this && this.i) {
        console.log(this.i);
    }
}

const noBind = () => {
    if(this && this.i) {
        console.log(this.i);
    }
}

function goFat() {
    this.i = 10;
    for (var i = 0; i < 100; i++) {
        noBind();
    }
}

function goTraditional() {
    this.i = 20;
    for (var i = 0; i < 100; i++) {
        useBind.bind(this)();
    }

}

function race() {
  var start = performance.now();
  goTraditional();
  console.log('Traditional elapsed: ' + (performance.now() - start));
  start = performance.now();
  goFat()
  console.log('Fat elapsed: ' + (performance.now() - start));

  start = performance.now();
  goTraditional();
  console.log('Traditional elapsed: ' + (performance.now() - start));
  start = performance.now();
  goFat()
  console.log('Fat elapsed: ' + (performance.now() - start));

  start = performance.now();
  goTraditional();
  console.log('Traditional elapsed: ' + (performance.now() - start));
  start = performance.now();
  goFat()
  console.log('Fat elapsed: ' + (performance.now() - start));
  console.log('------');
}

很抱歉，如果这个问题重复或有其他类似的主题，但我现在找不到具体的答案。

Answer 1

您会得到不同的结果，因为您的运行时间主要是对 console.log() 的调用。如果你在内部循环中做一些像 console.log() 这样密集的事情，你调用它们的方式不会影响你的运行-时间。

一般来说，您不应该关心微优化，直到您知道自己需要它。使用适合情况的风格。如果你可以使用箭头函数，就使用它们。他们避免创建一个新的函数对象，而不是 bind.

如果您想实际调用绑定函数（而不是 useBind.bind(this); useBind()），则必须重写您的测试 useBind.bind(this)()。如果你关心性能，你会在循环之外进行绑定。除非你也想衡量创建绑定函数的影响。

箭头函数是否比绑定方法更快地传递此参数

Are Arrow Functions faster than bind method to pass this param

javascript

performance

ecmascript-6

arrow-functions