資訊專欄INFORMATION COLUMN
摘要：操作符的兩種形態(tài)其實(shí)在的操作符描述中，語(yǔ)法是你會(huì)發(fā)現(xiàn)被中括號(hào)所包圍也就意味著可缺省，因此，如果對(duì)于不含參數(shù)的構(gòu)造函數(shù)而言與二者并無(wú)區(qū)別，那我們接著思考一個(gè)問(wèn)題，對(duì)于前面返回函數(shù)的而言，當(dāng)?shù)臅r(shí)候?yàn)槭裁磮?zhí)行的是而不是呢。
首先歡迎大家關(guān)注我的Github博客，也算是對(duì)我的一點(diǎn)鼓勵(lì)，畢竟寫(xiě)東西沒(méi)法變現(xiàn)，堅(jiān)持下去也是靠的是自己的熱情和大家的鼓勵(lì)。各位讀者的Star是激勵(lì)我前進(jìn)的動(dòng)力，請(qǐng)不要吝惜。
寫(xiě)了兩年的JavaScript的我，原以為是不會(huì)在語(yǔ)法上陰溝里翻船的，可是事實(shí)上被打臉，最近在產(chǎn)品開(kāi)發(fā)中組里的一個(gè)帥小伙找我討論一個(gè)問(wèn)題，為了方便大家閱讀，我將這個(gè)問(wèn)題的模型抽象出來(lái):
var provider = {
test: {
$get: function(){
return function anonymous(config){
};
}
}
};
var type = "test";
var config = {};
new provider[type].$get()(config);
上面的語(yǔ)句運(yùn)行時(shí)候?yàn)槭裁春瘮?shù)anonymous中的this指向的是window而不是new創(chuàng)建的新對(duì)象。我當(dāng)時(shí)聽(tīng)到這個(gè)問(wèn)題的第一時(shí)刻想的是: 納尼 !怎么可能new操作符對(duì)應(yīng)的構(gòu)造函數(shù)中的this指向的不是新創(chuàng)建的對(duì)象實(shí)例呢？當(dāng)時(shí)由于并沒(méi)有仔細(xì)地將問(wèn)題從業(yè)務(wù)中抽象出來(lái)，其實(shí)我也有點(diǎn)迷糊，但仔細(xì)一想，這個(gè)語(yǔ)句到底要表達(dá)什么呢？
思考在說(shuō)這個(gè)表達(dá)式所要表達(dá)的含義之前，先說(shuō)一個(gè)關(guān)于new操作符的幾個(gè)小知識(shí):
構(gòu)造函數(shù)的返回JavaScript構(gòu)造函數(shù)中可以返回值，也可以不返回值，比如:
function Person(){
}
var person = new Person()
我們知道這個(gè)時(shí)候構(gòu)造函數(shù)返回的是創(chuàng)建的實(shí)例對(duì)象，也就是構(gòu)造函數(shù)中this所指向的對(duì)象。但是當(dāng)你構(gòu)造函數(shù)有返回值時(shí)，就要分情況區(qū)分。如果返回的是一個(gè)非引用類型的值時(shí)，實(shí)際上返回的是仍然是新創(chuàng)建的實(shí)例對(duì)象。但是當(dāng)返回的是一個(gè)引用類型的值時(shí)，返回的是引用對(duì)象本身。比如:
function Person(){
return function(){}
}
var person = new Person()
typeof person // "function"
在JavaScript中函數(shù)作為一等公民，實(shí)質(zhì)上就是引用類型，因此person就是返回的匿名函數(shù)。
new操作符的兩種形態(tài)其實(shí)在MDN的new操作符描述中，語(yǔ)法是
new constructor[([arguments])]
你會(huì)發(fā)現(xiàn)([arguments])被中括號(hào)所包圍也就意味著可缺省，因此，如果對(duì)于不含參數(shù)的構(gòu)造函數(shù)而言:
new Person()與new Person
二者并無(wú)區(qū)別，那我們接著思考一個(gè)問(wèn)題，對(duì)于前面返回函數(shù)的Person而言，當(dāng)
new Person()的時(shí)候?yàn)槭裁磮?zhí)行的是new Person()而不是(new Person)()呢。之前如果閱讀過(guò)我之前的一篇文章的同學(xué)知道，帶有參數(shù)的new操作符的優(yōu)先級(jí)大于無(wú)參數(shù)列表的new操作符。因此總是會(huì)執(zhí)行第一種而不是第二種。
了解上面的步驟之后，我們已經(jīng)接近了問(wèn)題的本質(zhì)，對(duì)于表達(dá)式
new provider[type].$get()(config);
JavaScript引擎到底是解析成:
(new provider[type].$get())(config);
還是
new (provider[type].$get())(config);
對(duì)于第一種形式而言，(new provider[type].$get())返回的是anonymous函數(shù)，因此在anonymous(config)中內(nèi)部this指向是window。而第二種模式中provider[type].$get()返回的是anonymous函數(shù)，因此運(yùn)行new anonymous(config)時(shí)內(nèi)部的this指針指向的是新創(chuàng)建的實(shí)例this。
當(dāng)然我們從問(wèn)題: this為什么指向的是window而不是new創(chuàng)建的新對(duì)象中可以看出來(lái)，其實(shí)作者當(dāng)時(shí)想要表達(dá)的是第二種含義，但實(shí)際上卻以第一種方式在運(yùn)行。為什么？原因非常簡(jiǎn)單，第一種執(zhí)行方式JavaScript引擎首先解析的是帶參數(shù)列表的的new操作符，而第二種方式則是先執(zhí)行了函數(shù)調(diào)用，再執(zhí)行的是new操作符，我們對(duì)照上面的優(yōu)先級(jí)圖可以看到，帶參數(shù)列表的new優(yōu)先級(jí)高于函數(shù)調(diào)用，因此肯定是以第一種方式去運(yùn)行。
其實(shí)這篇文章并沒(méi)有多少干貨，但是從中還是有兩點(diǎn)感悟吧，第一，從上一篇同類文章中我就強(qiáng)調(diào)避免使用這種模糊不清的表達(dá)式，多用幾個(gè)括號(hào)一切問(wèn)題都迎刃而解，比如有的同學(xué)會(huì)寫(xiě)出類似于:
var str = "Hello" + true ? "World" : "JavaScript";
那請(qǐng)問(wèn)str內(nèi)容是什么呢，有的人可能認(rèn)為是Hello World,有的人會(huì)認(rèn)為是World，實(shí)質(zhì)上運(yùn)算的結(jié)果是World，
因?yàn)?b>+運(yùn)算符優(yōu)先級(jí)是高于條件運(yùn)算符的，這時(shí)候添加括號(hào)會(huì)讓你的代碼變得更加易于閱讀。第二，保持對(duì)技術(shù)的敬畏吧，最怕的就是你覺(jué)得你都會(huì)了，其實(shí)你一無(wú)所知。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/99371.html
摘要：面試官說(shuō)那我問(wèn)你一個(gè)哲學(xué)的問(wèn)題，為什么有數(shù)據(jù)結(jié)構(gòu)這種東西哇，這是啥，巴拉巴拉扯了一通，大致就是物以類聚，人以群分，先人積累下來(lái)的經(jīng)驗(yàn)，這些讓我們更方便處理數(shù)據(jù)啥的。 前因，沒(méi)有比摸魚(yú)有趣的事了 距離自己被外派(俗稱外包)出去，已經(jīng)過(guò)了快五個(gè)月，工作的話，很閑。人啊，一定保持好的習(xí)慣，懶惰是會(huì)上癮，日常摸魚(yú)，懷疑人生，我是誰(shuí)，我在哪，我要干什么。 中午吃飯的時(shí)候，收到了boss直聘的一條...
摘要：將他們放在堆中是為了不影響棧的效率。所以簡(jiǎn)單數(shù)據(jù)類型的值直接存放在棧中。可以對(duì)比上面那張圖默認(rèn)是調(diào)用方法的依，于是等于空字符串?？兆址袊?guó)標(biāo)準(zhǔn)時(shí)間方法返回對(duì)象的原始值，可能是字符串?dāng)?shù)值或值等，看具體的對(duì)象。，需要兩個(gè)操作數(shù)同時(shí)轉(zhuǎn)為。 你是否在面試中遇到過(guò)各種奇葩和比較細(xì)節(jié)的問(wèn)題? []==[] //false []==![] //true {}==!{} //false {}==
閱讀 2844·2021-11-22 13:54
閱讀 2768·2021-10-14 09:42
閱讀 4176·2021-09-28 09:47
閱讀 2247·2021-09-03 10:28
閱讀 1275·2021-07-26 23:38
閱讀 2625·2019-08-30 15:54
閱讀 2708·2019-08-29 16:35
閱讀 1505·2019-08-29 15:42
