apply,call,bind区别
js中有三個(gè)改變this指針的方法,分別是 apply,call,bind。很多人只知道能改變的this,但是具體的適用場(chǎng)景不是太清楚。我也是遇到坑后不斷的實(shí)踐發(fā)現(xiàn)了區(qū)別。
call ,apply方法:
1 function Product(name, price) { 2 this.name = name; 3 this.price = price; 4 } 5 6 function Food(name, price) { 7 Product.call(this, name, price);8 this.category = 'food'; 9 } 10 11 console.log(new Food('cheese', 5).name); 12 // expected output: "cheese"
在Food類中,因?yàn)槭褂昧薱all改變類Product的類的this執(zhí)向。所以這個(gè)時(shí)候在Product 中this定義的兩個(gè)私有屬性卻成了Food類new出來(lái)對(duì)象的。這種方式實(shí)現(xiàn)了類似繼承的概念,這種方式叫做call繼承。
其中call第一個(gè)參數(shù)表示的是修改的類的this指向值,后面兩個(gè)name,price都是做為參數(shù)傳遞到Product中。最后在執(zhí)行這條語(yǔ)句的時(shí)候,會(huì)執(zhí)行一下Product這個(gè)類(函數(shù))。也就是call就會(huì)執(zhí)行一下 ‘’.‘’ 符號(hào)之前的類或者函數(shù)。
apply相對(duì)call來(lái)說(shuō)也是執(zhí)行了一下函數(shù)或者類,只是參數(shù)傳遞進(jìn)行了組裝。如果要進(jìn)行apply修改,第7句話就可以表達(dá)為 Prpduct.apply(this,[name,price]); 可以把要傳遞的參數(shù)進(jìn)行數(shù)組化。
bind:
bind是es6中新推出的修改this的方法。但是他和傳統(tǒng)的call,apply區(qū)別就是函數(shù)或者類的this修改后沒有執(zhí)行,而是在程序代碼檢測(cè)時(shí)已經(jīng)對(duì)代碼的this指向進(jìn)行了修改。那么有什么用呢?
比如我這個(gè)時(shí)候需要用DOM2級(jí)別的事件綁定 :
document.addEventListener('click',fn); fn(){ this.name='yangkun' } //這里我們給document元素對(duì)象添加了一個(gè)點(diǎn)擊事件方法fn; var obj={name:'zhansan'}; fn.call(obj); 我們需要的是修改fn中的this,指向是obj中的name.是如果這樣做,會(huì)有一個(gè)問(wèn)題就是,函數(shù)fn已經(jīng)被執(zhí)行了!實(shí)際上我們綁定的click事件對(duì)應(yīng)的是一個(gè)函數(shù)返回值(這里沒有返回值,實(shí)際上點(diǎn)擊事件綁定了null),而不是我們希望綁定的方法!這個(gè)時(shí)候如果我們使用fn.bind(obj)就沒問(wèn)題了。方法沒有執(zhí)行。
?
后記:JavaScript早期版本沒有類,但是大家發(fā)現(xiàn)通過(guò)new可以實(shí)現(xiàn)類似后臺(tái)語(yǔ)言的語(yǔ)法方式。自然把進(jìn)行new 的函數(shù)說(shuō)成類。? js 函數(shù)有三態(tài),普通函數(shù),類,對(duì)象。這個(gè)是ES6之前函數(shù)的三態(tài)。
轉(zhuǎn)載于:https://www.cnblogs.com/yangkun90/p/10464572.html
總結(jié)
以上是生活随笔為你收集整理的apply,call,bind区别的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: java/javaee基础面试问题
- 下一篇: 蓝桥杯 错误票据 (stringstre