es 6 javascript関数バインディング

1112 ワード

矢印関数は、thisオブジェクトをバインドし、明示的なバインディングthisオブジェクトの書き方を大幅に低減します.しかし、矢印関数はすべての場合には適用されないので、ES 7は、コール、appy、bind呼び出しの代わりに「関数バインディング」演算子を提案している.この文法はES 7の提案ですが、Babelトランスコーダはすでにサポートされています.
関数バインディング演算子は、並べられた二重コード(:)で、二重コロンの左側はオブジェクトで、右側は関数です.演算子は自動的に左のオブジェクトをコンテキスト環境(thisオブジェクト)として、右の関数の上に結合します.
foo::bar;
//     
bar.bind(foo);
foo::bar(...arguments);
//     
bar.apply(foo, arguments);
const hasOwnProperty = Object.prototype.hasOwnProperty;
function hasOwn(obj, key) {
return obj::hasOwnProperty(key);
}
は、ダブルコロンの左側が空であり、右側がオブジェクトである場合、この方法をオブジェクトに結び付けることに等しい.
var method = obj::obj.foo;
//     
var method = ::obj.foo;
let log = ::console.log;
//     
var log = console.log.bind(console);
は、ダブルコロン演算子が元のオブジェクトに戻りますので、チェーン式で書くことができます.
//    
import { map, takeWhile, forEach } from "iterlib";
getPlayers()
::map(x => x.character())
::takeWhile(x => x.strength > 100)
::forEach(x => console.log(x));
//    
let { find, html } = jake;
document.querySelectorAll("div.myClass")
::find("p")
::html("hahaha");