IE は function.bind() メソッドの実装コードをサポートします_JavaScript スキル

フロントエンド開発者は、よりスケーラブルな機能開発を実現するために、JavaScript スクリプトの関数オブジェクトが call または apply メソッドを使用して内部スコープ (this) が指すオブジェクトを変更できることを十分に認識する必要があります。 IE は関数オブジェクトの call メソッドと apply メソッドをネイティブにサポートしており、Firefox や他のブラウザでもサポートされています。ただし、call メソッドと apply メソッドはすぐに実行されます (例:

コードをコピーします コードは次のとおりです。

var func = function () {
alert(this); .apply(window);


スクリプト解析エンジンがこのコードを実行すると、ダイアログ ボックスがすぐにポップアップ表示され、オブジェクト文字列が表示されます。当初の目的は、ウィンドウ オブジェクト フィールドに作用する func メソッドを定義し、後で呼び出されたときに実行することでしたが、call メソッドと apply メソッドは当初の目的を達成できず、すぐに実行されます。

いくつかの技術情報をグーグルで調べたところ、Firefox はバインド メソッドをネイティブでサポートしていることがわかりました。このメソッドは、定義が完了した後であることを除けば、呼び出しメソッドは call および apply と同じです。 、このメソッドは後で呼び出されます。ただし、このバインド メソッドは、IE10 バージョンのブラウザでのみネイティブにサポートされています。このバージョンより前のブラウザで実行すると、未定義のエラー メッセージが表示されます。そこで、もう一度オンラインで Google で解決策を探す必要がありました。その苦労が報われ、すべてのブラウザがバインド メソッドをサポートできるようにプロパティ プロトタイプを追加するという解決策が見つかりました。

コードをコピー コードは次のとおりです。

if (!Function.prototype. bind) {

Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// ECMAScript 5 の内部 IsCallable 関数に最も近いもの
throw new TypeError("Function.prototype.bind - バインドしようとしているものは呼び出し可能ではありません");
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function () {} ,
fBound = function () {
return fToBind.apply(this instanceof fNOP && oThis
? this
: oThis,
aArgs.concat(Array.prototype.slice.call(arguments )));
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP(); ;
};
}


このコードを理解するには、その使用方法を知っている必要があります。このソース コードの原理を紹介したいと思います。感謝してください、ありがとう！

シンプルさは態度ではなく、一種の満足感です。