Arrow関数はこのメソッドをバインドするよりも高速です

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)()）。あなたがパフォーマンスを気にするならば、あなたはループの外側でバインディングを行います。バインドされた関数を作成することによる影響も測定しない限り。