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.bind(this); useBind()。如果你关心性能，你会在循环之外进行绑定。除非你想测量创建绑定函数的影响。

Arrow函数是否比绑定方法更快以传递此参数

1 个答案: