js bind 函數 使用閉包保存執(zhí)行上下文
更新時間：2011年12月26日 23:17:33 作者：
在javascript中，函數總是在一個特殊的上下文執(zhí)行（稱為執(zhí)行上下文），如果你將一個對象的函數賦值給另外一個變量的話，這個函數的執(zhí)行上下文就變?yōu)檫@個變量的上下文了。下面的一個例子能很好的說明這個問題
復制代碼 代碼如下:
window.name = "the window object"
function scopeTest() {
return this.name;
}
// calling the function in global scope:
scopeTest()
// -> "the window object"
var foo = {
name: "the foo object!",
otherScopeTest: function() { return this.name }
};
foo.otherScopeTest();// -> "the foo object!"
var foo_otherScopeTest = foo.otherScopeTest;
foo_otherScopeTest();
// –> "the window object"
如果你希望將一個對象的函數賦值給另外一個變量后，這個函數的執(zhí)行上下文仍然為這個對象，那么就需要用到bind方法。
bind的實現(xiàn)如下：
復制代碼 代碼如下:
// The .bind method from Prototype.js
Function.prototype.bind = function(){
var fn = this, args = Array.prototype.slice.call(arguments), object = args.shift();
return function(){
return fn.apply(object,
args.concat(Array.prototype.slice.call(arguments)));
};
};
使用示例：
復制代碼 代碼如下:
var obj = {
name: 'A nice demo',
fx: function() {
alert(this.name);
}
};
window.name = 'I am such a beautiful window!';
function runFx(f) {
f();
}
var fx2 = obj.fx.bind(obj);
runFx(obj.fx);
runFx(fx2);
參考：
http://www.prototypejs.org/api/function/bind
PS：
才發(fā)現(xiàn)prototypejs的API文檔解釋的這么詳細，一定要花點時間多看看了。
我的簡單的實現(xiàn)：
復制代碼 代碼如下:
Function.prototype.bind = function(obj) {
var _this = this;
return function() {
return _this.apply(obj,
Array.prototype.slice.call(arguments));
}
}
var name = 'window',
foo = {
name:'foo object',
show:function() {
return this.name;
}
};
console.assert(foo.show()=='foo object',
'expected foo object,actual is '+foo.show());
var foo_show = foo.show;
console.assert(foo_show()=='window',
'expected is window,actual is '+foo_show());
var foo_show_bind = foo.show.bind(foo);
console.assert(foo_show_bind()=='foo object',
'expected is foo object,actual is '+foo_show_bind());
相關文章
前端無感知刷新token以及超時自動退出實現(xiàn)方案
前端需要做到無感刷新token,即刷token時要做到用戶無感知,避免頻繁登錄,下面這篇文章主要給大家介紹了關于前端無感知刷新token以及超時自動退出的實現(xiàn)方案,需要的朋友可以參考下2024-01-01
echarts-for-weixin是ECharts官方維護的一個開源項目，提供了一個微信小程序組件，可以通過這個組件在微信小程序中使用?ECharts?繪制圖表。本文將通過示例詳解微信小程序使用ECharts的方法，感興趣的可以了解一下2022-06-06
在微信小程序開發(fā)時,經常要用到一個控件會根據不同的情況和環(huán)境動態(tài)顯示與隱藏這種情況,下面這篇文章主要給大家介紹了關于微信小程序控制view隱藏顯示的5種方法,需要的朋友可以參考下2022-04-04
每次在javascript中用加號合成字符串，真的沒法忍受了，今天終于找到一高手寫的方法，與大家分享。2009-11-11
js去空格想必大家多少都會點吧，在接下來的文章中為大家詳細介紹下如何分別去字符串前后，左邊，右邊空格，感興趣的朋友可以參考下2013-10-10
這篇文章主要為大家介紹了String對象的方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2021-12-12
在JavaScript中,可以使用Date.parse()或new Date()來獲取指定時間的時間戳,本文給大家分享JS獲取指定時間的時間戳的方法,感興趣的朋友一起看看吧2024-01-01
這篇文章主要介紹了js制作精美的幻燈片畫集特效，視覺上特別有沖擊感，推薦給大家，有需要的小伙伴可以參考下。2015-08-08
本文主要介紹js中call與apply關鍵字的作用以及它們的用法,具體實例如下,希望對大家有所幫助2016-11-11
jsonp跨域及實現(xiàn)百度首頁聯(lián)想功能的方法
這篇文章主要介紹了jsonp跨域及實現(xiàn)百度首頁聯(lián)想功能的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08