資訊專欄INFORMATION COLUMN
摘要：首先介紹一下和的定義和的作用是改變函數(shù)運行時的上下文環(huán)境改變的指向?qū)⒔壎ǖ交蛘哒f調(diào)用了里面的方法。方法返回的是修改過后的函數(shù)追夢子追夢子執(zhí)行成功
這是一道今天遇到的面試題
因為setTimeout屬于匿名函數(shù),this指向window,所以this.id = 1
但還是先總結(jié)一下call和apply的用法。
首先介紹一下call和apply的定義
obj.call(thisObj, arg1, arg2,...)
obj.apply(thisObj, [arg1, arg2,...])
call和apply的作用是改變函數(shù)運行時的上下文環(huán)境(改變this的指向),將obj綁定到thisObj,或者說this.Obj調(diào)用了obj里面的方法。
call和apply的作用當一個對象需要調(diào)用另外一個對象里面的方法的時候,可以用到call和apply,call和apply可以理解成是繼承另外一個對象的方法。
首先我們建立兩個對象obj1和obj2
如果obj2對象要調(diào)用obj1中的func1方法(可以理解為在obj2的環(huán)境中執(zhí)行obj1.func1方法)，則
obj1.func1.call(obj2); //輸出：obj2Name obj1.func1.apply(obj2);//輸出：obj2Name
call和apply第一個參數(shù)都是表示obj1綁定的對象，如果obj1要綁定到this，此時obj1就是綁定到全局，如：
obj1.func1.call(this);//輸出：windowName obj1.func1.apply(this);//輸出：windowName
如果obj2對象要調(diào)用obj1中的func2方法，則
obj1.func2.call(obj2,1,2);//輸出：3 obj1.func2.apply(obj2,[1,2]);//輸出：3call和apply實現(xiàn)繼承
使用call方法調(diào)用父構(gòu)造函數(shù)
function Product(name, price) {
this.name = name;
this.price = price;
if (price < 0) {
throw RangeError(
"Cannot create product " + this.name + " with a negative price"
);
}
}
function Food(name, price) {
Product.call(this, name, price);
this.category = "food";
}
//等同于
function Food(name, price) {
this.name = name;
this.price = price;
if (price < 0) {
throw RangeError(
"Cannot create product " + this.name + " with a negative price"
);
}
this.category = "food";
}
//function Toy 同上
function Toy(name, price) {
Product.call(this, name, price);
this.category = "toy";
}
var cheese = new Food("feta", 5);
var fun = new Toy("robot", 40);
bind方法和call、apply的區(qū)別
bind方法也是用來改變this的指向
var a = {
user:"追夢子",
fn:function(){
console.log(this.user);
}
}
var b = a.fn;
b.bind(a);
沒有被打印,這就是bind方法與apply、call方法的不同。bind方法返回的是修改過后的函數(shù)
var a = {
user:"追夢子",
fn:function(){
console.log(this.user); //追夢子
}
}
var b = a.fn;
var c = b.bind(a);
c();
執(zhí)行成功
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://specialneedsforspecialkids.com/yun/94198.html
摘要：返回的綁定函數(shù)也能使用操作符創(chuàng)建對象這種行為就像把原函數(shù)當成構(gòu)造器。同時，將第一個參數(shù)以外的其他參數(shù)，作為提供給原函數(shù)的預設(shè)參數(shù)，這也是基本的顆粒化基礎(chǔ)。 今天想談?wù)勔坏狼岸嗣嬖囶}，我做面試官的時候經(jīng)常喜歡用它來考察面試者的基礎(chǔ)是否扎實，以及邏輯、思維能力和臨場表現(xiàn)，題目是：模擬實現(xiàn)ES5中原生bind函數(shù)。也許這道題目已經(jīng)不再新鮮，部分讀者也會有思路來解答。社區(qū)上關(guān)于原生bind的研...
摘要：返回的綁定函數(shù)也能使用操作符創(chuàng)建對象這種行為就像把原函數(shù)當成構(gòu)造器。同時，將第一個參數(shù)以外的其他參數(shù)，作為提供給原函數(shù)的預設(shè)參數(shù)，這也是基本的顆粒化基礎(chǔ)。 今天想談?wù)勔坏狼岸嗣嬖囶}，我做面試官的時候經(jīng)常喜歡用它來考察面試者的基礎(chǔ)是否扎實，以及邏輯、思維能力和臨場表現(xiàn)，題目是：模擬實現(xiàn)ES5中原生bind函數(shù)。也許這道題目已經(jīng)不再新鮮，部分讀者也會有思路來解答。社區(qū)上關(guān)于原生bind的研...
摘要：返回的綁定函數(shù)也能使用操作符創(chuàng)建對象這種行為就像把原函數(shù)當成構(gòu)造器。同時，將第一個參數(shù)以外的其他參數(shù)，作為提供給原函數(shù)的預設(shè)參數(shù)，這也是基本的顆粒化基礎(chǔ)。 今天想談?wù)勔坏狼岸嗣嬖囶}，我做面試官的時候經(jīng)常喜歡用它來考察面試者的基礎(chǔ)是否扎實，以及邏輯、思維能力和臨場表現(xiàn)，題目是：模擬實現(xiàn)ES5中原生bind函數(shù)。也許這道題目已經(jīng)不再新鮮，部分讀者也會有思路來解答。社區(qū)上關(guān)于原生bind的研...
摘要：函數(shù)是這樣子聲明的使用了系統(tǒng)自己的構(gòu)造函數(shù)來聲明，第一個參數(shù)是，函數(shù)體內(nèi)又。構(gòu)造函數(shù)調(diào)用情況正常方式調(diào)用無窮無盡當然，里還歸納了幾項比較簡單，我就不再翻譯了。 上一篇從一道面試題，到我可能看了假源碼中，由淺入深介紹了關(guān)于一篇經(jīng)典面試題的解法。最后在皆大歡喜的結(jié)尾中，突生變化，懸念又起。這一篇，就是為了解開這個懸念。 如果你還沒有看過前傳，可以參看前情回顧： 回顧1. 題目是模擬實現(xiàn)ES...
摘要：來自朋友去某信用卡管家的做的一道面試題，用原生模擬的方法，不準用和方法。他們的用途相同，都是在特定的作用域中調(diào)用函數(shù)。不同之處在于，方法傳遞給調(diào)用函數(shù)的參數(shù)是逐個列出的，而則是要寫在數(shù)組中。 本文首發(fā)我的個人博客：前端小密圈，評論交流送1024邀請碼，嘿嘿嘿?。 來自朋友去某信用卡管家的做的一道面試題，用原生JavaScript模擬ES5的bind方法，不準用call和bind方法。 ...
閱讀 1120·2021-11-25 09:43
閱讀 1569·2021-10-25 09:47
閱讀 2466·2019-08-30 13:46
閱讀 753·2019-08-29 13:45
閱讀 1280·2019-08-26 13:29
閱讀 2990·2019-08-23 15:30
閱讀 1103·2019-08-23 14:17
閱讀 1326·2019-08-23 13:43
