在JavaScript中正確引用bind方法的應(yīng)用
在JavaScript中,方法往往涉及到上下文,也就是this,因此往往不能直接引用,就拿最常見(jiàn)的console.log("info…")來(lái)說(shuō),避免書(shū)寫(xiě)冗長(zhǎng)的console,直接用log("info…")代替,不假思索的會(huì)想到如下語(yǔ)法:
var log = console.log; log("info…");
很遺憾,運(yùn)行報(bào)錯(cuò):TypeError: Illegal invocation。
為啥呢?對(duì)于console.log("info…")而言,log方法在console對(duì)象上調(diào)用,因此log方法中的this指向console對(duì)象;而我們用log變量指向console.log方法,然后直接調(diào)用log方法,此時(shí)log方法的this指向的是window對(duì)象,上下文不一致,當(dāng)然會(huì)報(bào)錯(cuò)了。
此時(shí)我們可以用bind方法解決這個(gè)問(wèn)題。bind方法允許手動(dòng)傳入一個(gè)this,作為當(dāng)前方法的上下文,然后返回持有上下文的方法,例如:
var log = console.log.bind(console); log("info...");
這樣就不會(huì)報(bào)錯(cuò)了。
但是,bind方法并不支持ie 8以及更低版本的瀏覽器,我們完全可以自己實(shí)現(xiàn)一個(gè),很簡(jiǎn)單。
Function.prototype.bind = Function.prototype.bind || function(context){ var _this = this; return function(){ _this.apply(context, arguments); }; };
核心通過(guò)apply方法實(shí)現(xiàn),閉包的經(jīng)典應(yīng)用。_this指向當(dāng)前方法,context指向當(dāng)前方法的上下文,二者均通過(guò)閉包訪(fǎng)問(wèn)。
以上所述就是本文的全部?jī)?nèi)容了,希望大家能夠喜歡。
相關(guān)文章
JavaScript 判斷iPhone X Series機(jī)型的方法
這篇文章主要介紹了JavaScript 判斷iPhone X Series機(jī)型的方法,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-01-01jQuery $.data()方法使用注意細(xì)節(jié)
前段時(shí)間同事在群里對(duì)jQuery里的.data()方法大發(fā)牢騷,接下來(lái)介紹jQuery $.data()方法使用注意細(xì)節(jié),需要了解的朋友可以參考下2012-12-12javascript實(shí)現(xiàn)框架高度隨內(nèi)容改變的方法
這篇文章主要介紹了javascript實(shí)現(xiàn)框架高度隨內(nèi)容改變的方法,實(shí)例分析了通過(guò)父頁(yè)面及內(nèi)容改變框架高度兩種實(shí)現(xiàn)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07實(shí)現(xiàn)圖片首尾平滑輪播(JS原生方法—節(jié)流)
下面小編就為大家?guī)?lái)一篇實(shí)現(xiàn)圖片首尾平滑輪播(JS原生方法—節(jié)流)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10從零開(kāi)始用electron手?jǐn)]一個(gè)截屏工具的示例代碼
這篇文章主要介紹了從零開(kāi)始用electron手?jǐn)]一個(gè)截屏工具的示例代碼,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-10-10詳解基于webpack&gettext的前端多語(yǔ)言方案
這篇文章主要介紹了詳解基于webpack&gettext的前端多語(yǔ)言方案,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-01-01