深入JavaScript 模擬實現bind

2021-09-05 01:38:49 字數 2306 閱讀 1645

bind

bind() 方法會建立乙個新函式。當這個新函式被呼叫時,bind() 的第乙個引數將作為它執行時的 this,之後的一串行引數將會在傳遞的實參前傳入作為它的引數。

由此我們可以首先得出 bind 函式的兩個特點:

例1

var foo = ;

function bar()

var bindfoo = bar.bind(foo);

bindfoo(); // 1

讓我們看看發生了什麼?

(1) bind返回了乙個函式

(2) 傳入的第乙個引數改變了bar的指標

模擬bind第一版:

function.prototype.mybind = function (context) 

}

例2
var foo = ;

function bar(name, age)

var bindfoo = bar.bind(foo, 'bty', '18');

bindfoo(); // 1 bty 18

var bindfoo = bar.bind(foo, 'bty');

bindfoo('18'); // 1 bty 18

var bindfoo = bar.bind(foo);

bindfoo('bty', '18'); // 1 bty 18

讓我們看看發生了什麼?

name和age兩個引數,

(1)可以都在bind的時候傳入

(2)也可以在 bind 的時候,只傳乙個 name,在執行返回的函式的時候,再傳另乙個引數 age

(3)還可以在返回函式的時候都傳入

這裡我們用 arguments 進行處理,

模擬bind第二版:

function.prototype.mybind = function (context) 

}

例3

bind 另乙個特點:

乙個繫結函式也能使用new操作符建立物件:這種行為就像把原函式當成構造器。提供的 this 值被忽略,同時呼叫時的引數被提供給模擬函式。

var value = 2;

var foo = ;

function bar(name, age)

bar.prototype.friend = 'bty';

var bindfoo = bar.bind(foo, 'dadd');

var obj = new bindfoo('18'); // undefined dadd 18

console.log(obj.habit); // shopping

console.log(obj.friend); //bty

讓我們看看發生了什麼?

全域性和 foo 中都宣告了 value 值,但最後返回了 undefind,說明繫結的 this 失效了。

如果大家了解 new 的模擬實現,就會知道這個時候的 this 已經指向了 obj。

模擬bind第三版:

function.prototype.mybind = function (context) 

fbound.prototype = this.prototype;

return fbound;

}

上面**的問題:

(1)fbound.prototype = this.prototype:我們直接修改 fbound.prototype 時,也會直接修改函式的 prototype。這個時候,我們可以通過乙個空函式來進行中轉

(2)如果呼叫bind不是函式怎麼辦?

模擬bind第四版:

function.prototype.mybind = function (context) 

var self = this;

var args = array.prototype.slice.call(arguments, 1);

var fnop = function () {};

var fbound = function ()

fnop.prototype = this.prototype;

fbound.prototype = new fnop(); //(1)

return fbound;

}

JavaScript深入之new的模擬實現

function otaku name,age 因為缺乏鍛鍊的緣故,身體強度讓人擔憂 otaku.prototype.strength 60 otaku.prototype.sayyourname function var person newotaku kevin 18 console.log p...

JavaScript專題之模擬實現bind

本文共 1100 字,讀完只需 4 分鐘概述 首先觀察 bind 函式有什麼特點 var person function say age,var foo say.bind person,男 39 foo jaychou 男 39返回乙個函式 函式引數以逗號的形式傳入 改變了 this 的指向 一 c...

模擬實現Spring IOC

通過在類上標註 registration 註冊進容器,injection從容器注入物件 容器類 public class springcontainer else bean.setbeanclass c mappropsmap new hashmap 處理注入屬性 field props c.get...