在IT界溯香,需要大量的 JavaScript 開發(fā)者济舆。如果你的能力能夠勝任這一角色喷众,那么你將獲得許多更換工作和提高薪水的機會各谚。但是在你被公司錄取之前,你需要展現(xiàn)你的技術(shù)實力到千,以便通過面試環(huán)節(jié)昌渤。在這篇文章中,我會為你展示前端面試會被問到的 5 個典型問題及相關(guān)解決方法憔四,這 5 個問題常被用來測試面試者的 JavaScript 技能膀息。它們很有意思!
問題1: 范圍(Scope)
思考以下代碼:
控制臺(console)會打印出什么了赵?
答案
上述代碼會打印出5潜支。
這個問題的陷阱就是,在立即執(zhí)行函數(shù)表達式(IIFE)中柿汛,有兩個命名冗酿,但是其中變量是通過關(guān)鍵詞var來聲明的。這就意味著a是這個函數(shù)的局部變量。與此相反裁替,b是在全局作用域下的鸠窗。
這個問題另一個陷阱就是,在函數(shù)中他沒有使用“嚴格模式”('use strict';)胯究。如果嚴格模式開啟稍计,那么代碼就會報出未捕獲引用錯誤(Uncaught ReferenceError):b沒有定義。記住裕循,嚴格模式要求你在需要使用全局變量時臣嚣,明確地引用該變量。因此剥哑,你需要像下面這么寫:
問題2: 創(chuàng)建 “原生(native)” 方法
在String對象上定義一個repeatify函數(shù)硅则。這個函數(shù)接受一個整數(shù)參數(shù),來明確字符串需要重復幾次株婴。這個函數(shù)要求字符串重復指定的次數(shù)怎虫。舉個例子:
應(yīng)該打印出hellohellohello.
答案
一種可能的實現(xiàn)如下所示:
這個問題測試了開發(fā)人員對于JavaScript中繼承的掌握肴熏,以及prototype這個屬性柿隙。這也驗證了開發(fā)人員是否有能力擴展原生數(shù)據(jù)類型的功能(雖然不應(yīng)該這么做)。
這個問題的另一個重點是驗證你是否意識到并知道如何避免覆蓋已經(jīng)存在的函數(shù)祭陷。這可以通過在自定義函數(shù)之前判斷該函數(shù)是否存在來做到座哩。
當你需要為舊瀏覽器實現(xiàn)向后兼容的函數(shù)時徒扶,這一技巧十分有用。
問題3: 變量提升(Hoisting)
執(zhí)行以下代碼會有什么結(jié)果根穷?為什么姜骡?
答案
這段代碼的執(zhí)行結(jié)果是undefined和2。
這個結(jié)果的原因是屿良,變量和函數(shù)都被提升了(hoisted)圈澈。因此,在a被打印的時候尘惧,它已經(jīng)在函數(shù)作用域中存在(即它已經(jīng)被聲明了)康栈,但是它的值依然是undefined。換言之褥伴,上述代碼和以下代碼是等價的谅将。
問題4:this在 JavaScript 中是如何工作的
以下代碼的結(jié)果是什么?請解釋你的答案重慢。
答案
上面的代碼打印出Aurelio De Rosa和John Doe饥臂。原因是在 JavaScript 中,一個函數(shù)的上下文環(huán)境似踱,也就是this關(guān)鍵詞所引用對象隅熙,是依賴于函數(shù)是如何被調(diào)用的稽煤,而不是依賴于函數(shù)如何被定義的。
在第一個console.log()調(diào)用中囚戚,getFullname()是作為obj.prop的函數(shù)被調(diào)用的酵熙。因此,這里的上下文環(huán)境指向后者并且函數(shù)返回this對象的fullname屬性驰坊。相反匾二,當getFullname()被賦為test變量的值時,那個語境指向全局對象(window)拳芙。這是因為察藐,test被隱式設(shè)置為全局對象的屬性。因此舟扎,函數(shù)調(diào)用返回window的fullname屬性值分飞,在此段代碼中,這個值是通過第一行賦值語句設(shè)置的睹限。
問題5:call()和apply()
修復上一個問題譬猫,讓最后一個console.log()打印出Aurelio De Rosa。
答案
要解決這個問題羡疗,可以通過為函數(shù)call()或者apply()強制函數(shù)調(diào)用的上下文環(huán)境染服。如果你不知道call()和apply()之間的區(qū)別,我推薦閱讀文章“function.call 和 function.apply 之間有和區(qū)別?”顺囊。在以下代碼中肌索,我會用call()蕉拢,但是在這里特碳,用apply()也可以獲得相同的結(jié)果:
結(jié)論
在這篇文章中,我們討論了 JavaScript 面試者在面試中常被問到的 5 個典型問題晕换。在實際面試中午乓,真實的問題可能會有所不同,但涉及的概念和涵蓋的話題通常是非常類似的闸准。我希望你覺得前面那些測試很有趣益愈。如果你不知道其中一些答案,也別擔心:隨著不斷學習和經(jīng)驗 積累 夷家,你就能解決那些問題蒸其。
如果你在面試中被問到了其他有趣的問題,不要猶豫库快,馬上來和我們分享吧摸袁。這會幫助到很多的開發(fā)者。
話題到這里就結(jié)束了义屏,web前端學習的可以來我的群靠汁,群里每天都有對應(yīng)資料學習:250777811蜂大,歡迎初學和進階中的小伙伴。
如果想看到更加系統(tǒng)的文章和學習方法經(jīng)驗可以關(guān)注的微信號:‘web前端EDU’或者‘webxh5’關(guān)注后回復‘2017’可以領(lǐng)取一套完整的學習視頻