摘要:前兩天做了一份筆試題按照執(zhí)行順序列出下面代碼的打印內(nèi)容可能有些小朋友會被里面那個立即執(zhí)行函數(shù)嚇傻。和將指向改變至,也就是了。
前兩天做了一份筆試題:按照執(zhí)行順序列出下面代碼的打印內(nèi)容
var name = "The Window"; var object = { name : "The Object", getNameFunc : function(){ (() => { console.log(this.name) })() return function(){ console.log(this.name) }; } }; var func = object.getNameFunc(); func(); func.call(object); func.apply(object);
可能有些小朋友會被里面那個立即執(zhí)行函數(shù)嚇傻。沒關(guān)系,先看答案,整段代碼輸入瀏覽器,輸出如下:
The Object
The Window
The Object
The Object
OK, 一個一個來分析。
執(zhí)行順序從上往下,這句var func = object.getNameFunc();會產(chǎn)生第一個輸出:The Object
想搞明白為什么輸出這個,必須先知道,this指向誰?
首先,想知道this指向誰,不能看它在哪里被定義,而要看它在哪里被調(diào)用,運行object.getNameFunc()時,顯而易見地,調(diào)用這個函數(shù)的是object,立即執(zhí)行函數(shù)里面的this指向object,this.name自然就是object.name。
因此輸出The Object
那么,接下來,func被賦了什么值?整個getNameFunc()函數(shù)嗎?
并不是的,object.getNameFunc()函數(shù)運行的時候,閉包那段代碼沒有被執(zhí)行,只是作為返回結(jié)果賦給了func,因此事實上var func = object.getNameFunc()這句等價于:
var func = function() { console.log(this.name) }
現(xiàn)在func跟object就已經(jīng)沒什么關(guān)系了,func里面的this自然指向window。
因此第二句執(zhí)行語句func()相似于(注意用詞,我這里用的是相似,不是相等):
object.getNameFunc()() //是的,我沒打錯,兩個括號
嘻嘻,是不是有點蒙圈?
上面說了,由于object.getNameFunc()執(zhí)行后,會對外暴露出一個匿名函數(shù),即return返回的那個匿名函數(shù)
function () { console.log(this.name) }
所以object.getNameFunc()()會調(diào)起立即執(zhí)行函數(shù)
(function () { console.log(this.name) })()
注意 —— object.getNameFunc()()這個寫法只是為了能調(diào)用閉包函數(shù),如果在真的在瀏覽器跑object.getNameFunc()(),事實上會順序執(zhí)行輸出兩個結(jié)果:一個是立即執(zhí)行函數(shù)的結(jié)果,一個是閉包函數(shù)的結(jié)果。
由于object.getNameFunc()賦值給了func,因而使用func()就可以只調(diào)用閉包,而不觸碰那個立即執(zhí)行函數(shù)。這幾句話要小心理解!
通常一個變量未被聲明就使用,會指向window.undefined,然而this是不會指向undefined的,像我們平時定義一個普通函數(shù)
function app() {} // 調(diào)用 app() // 實際上是這樣調(diào)用的 window.app()
所以this會指向window,func()自然也等于window.func(),調(diào)用方是window,this.name即是window.name。
理解了上面那些,接下來的兩句反倒是簡單了。
func.call(object); func.apply(object);
call和apply將this指向改變至object,this.name也就是object.name了。
本來寫這篇博客之前還是有點繞的,寫完之后腦子就清晰了,相信以后這類題能輕松答上。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/84454.html
摘要:如果你要問他和誰當(dāng)進(jìn)去的快,要從下面兩個方面考慮結(jié)束時。至于什么,查了很多的資料,了解到一個瀏覽器環(huán)境只能有一個事件循環(huán),而一個事件循環(huán)可以有多個任務(wù)隊列。 ====據(jù)說這是今日頭條去年的一道筆試題,主要考察的是setTimeout async promise執(zhí)行順序 ~先雙手奉上這道題目~ async function async1() { consol...
摘要:注意點這個代碼是嚴(yán)格依賴環(huán)境的,例如中和是連續(xù)的,在編譯器中,和之間有一個空間。注意點當(dāng)把與交換之后,程序?qū)⒉粫霈F(xiàn)死循環(huán),但是程序的越界訪問報錯是少不了的。注意點這種優(yōu)化是無差別的,即無論你的代碼是否越界,都會進(jìn)行這樣的優(yōu)化。 目錄 聲明 原題 題目詳細(xì)解析 運行結(jié)果: 題目...
摘要:對象是一個返回值的代理,這個返回值在對象創(chuàng)建時未必已知。這使得異步方法可以像同步方法那樣返回值異步方法會返回一個包含了原返回值的對象來替代原返回值。 前言 近來參加校招筆試,發(fā)現(xiàn)有好幾道關(guān)于Promise的題目。然而我都沒有了解過。所以,這篇文章以網(wǎng)易筆試的一道題開始,記錄關(guān)于Promise的那些事。文章地址:http://lsxj615.com/2016/08/04... 筆試題 c...
摘要:因為加法的優(yōu)先級比條件運算符高,所以先運算加號,是字符串拼接,結(jié)果是非空字符串,在中字符串的布爾類型為。知識點三目運算為真執(zhí)行為假執(zhí)行運算優(yōu)先級在中布爾類型只有以下種情況為假,其他都為真。 一、測試題 原題:以下代碼的輸出是? var val = false; alert(val is + val ? true : false); 解析: 1. 此題考察的知識點: 三目運算、**運...
摘要:也給當(dāng)初出入迷宮的我不小考驗,一道題目可以引發(fā)許多思考,今天寫下的只是今時今日的想法,到未來也許還有別樣的看法。對于回調(diào)函數(shù),可以對其傳入三個參數(shù)分別是當(dāng)前元素,元素索引,調(diào)用的數(shù)組。 [1,2,3].map(parseInt) 這道JS題目,相信大家并不會陌生。也給當(dāng)初出入JS迷宮的我不小考驗,一道題目可以引發(fā)許多思考,今天寫下的只是今時今日的想法,到未來也許還有別樣的看法。...
閱讀 3571·2023-04-26 02:05
閱讀 2011·2021-11-19 11:30
閱讀 4218·2021-09-30 09:59
閱讀 3178·2021-09-10 10:51
閱讀 2610·2021-09-01 10:30
閱讀 1484·2021-08-11 11:20
閱讀 2619·2019-08-30 15:54
閱讀 568·2019-08-30 10:49