過夏的北京，天氣似乎突然有點涼，春天的溫暖剛過，但求職的浪潮卻已悄然來襲。就在大家摩拳擦掌、積極備戰的當下，沽泡前端講師們為大家準備了一份小小禮物：
特別說明：
假如你在面試時被這些題型卡住了，就必須正視自己的知識短板，並且要心悅城服的刻苦鑽研、直至學會為止！畢竟想要成為一個合格的 “WEB前端工程師”，掌握以下這些 JavaScript 核心的基礎知識，才擔得上“合格”這兩個字，否則就是“冒牌”的哦~
一、JavaScript 的 typeof 返回哪些資料型別？
分析：
這道題檢驗的是 JS 基本功，在妙味課堂 JS 基礎課程裡就有講，只要對 typeof 運算子是瞭解的，就沒有太大難度。具體在回答的時候，再結合理論知識和編碼過程中實際情況進行回答即可。另外，考慮到面試時的嚴謹性，妙味講師把 ES2015 中新增的型別也併入回覆中，供大家參考。
建議回覆：
首先，JavaScript 中一共有兩大資料型別：
基礎型別引用型別
基礎型別包括：Number、String、Boolean、Null、Undefined、Symbol（該型別位 ES2015 中新增型別）引用型別包括：Object typeof 運算子把型別資訊以字串形式返回，需要注意的是 typeof 返回的型別和 JavaScript 定義的型別有細微的差異。 typeof 返回七種可能的值：“number”、“string”、“boolean”、“object”、"symbol"、“function”和“undefined”。 二、請寫出以下運算結果：
alert(typeof null); alert(typeof undefined); alert(typeof NaN); alert(NaN == undefined); alert(NaN == NaN); var str = "123abc"; alert(typeof str++); alert(str); 分析：
這道題與“題目一”是連環扣，當“題目一”回答完後，通過此題再一次強化運算子和資料型別的基本功。
建議回覆：
本題主要是考察 typeof 判斷值的型別，它們輸出的結果依次是：
alert(typeof null); // object alert(typeof undefined); // undefined alert(typeof NaN); // number alert(NaN == undefined); // false alert(NaN == NaN); // false var str = "123abc"; alert(typeof str++); // number alert(str); // NaN 三、例舉至少 3 種強制型別轉換和 2 種隱式型別轉換?
分析：
型別轉換聽起來可能有點寬泛，但這道題明確給出了回答的範圍，對於聽過 JS 實體課的同學來說，這幾乎是送分題，因為課上講師們就明確講解了型別轉換的幾種不同形式，假如大家有做好筆記的話~
建議回覆：
-
強制型別轉換： 明確呼叫內建函式，強制把一種型別的值轉換為另一種型別。強制型別轉換主要有：Boolean、Number、String、parseInt、parseFloat
-
隱式型別轉換： 在使用算術運算子時，運算子兩邊的資料型別可以是任意的，比如，一個字串可以和數字相加。之所以不同的資料型別之間可以做運算，是因為 JavaScript 引擎在運算之前會悄悄的把他們進行了隱式型別轉換。隱式型別轉換主要有：+、–、==、!
四、JavaScript 的事件流模型都有什麼？
分析：
事件流模型這個知識點在妙味中級階段 event 事件章節就有詳細講解，如果已經忘記的朋友，再去看看這個階段的視訊吧。 題外話：一般純理論的知識點學起來枯燥（妙味實體班的學員也是如此），但理論的好處在於當遇到問題時，能迅速判斷出錯的原理所在，從而可以準確迅速的查詢問題並精準修復，可以讓冗餘程式碼簡化到最低、可以不再出了錯以後像撞大運般的採用 “試來試去大法” 來修復~
建議回覆：
事件流描述的是從頁面中接收事件的順序。 DOM 結構是樹形結構，當頁面中的某一個元素觸發了某個一個事件，事件會從最頂層的 window 物件開始，向下傳播到目標元素，途徑的祖先節點都會觸發對應的事件，如果當前節點的該事件繫結了事件處理函式的話，則會執行該函式當事件達到目標元素並執行繫結函式（如果有繫結的話）後，事件又會向上傳播到 window 元素，途徑的祖先節點都會觸發對應的事件（如果繫結事件處理函式的話）
——文字好繞口有沒有？誰讓當初聽課畫圖講解的時候，你不認真聽課卻在那兒打瞌睡呢？ ^_^ 繼續~
事件流包含三個階段：事件捕捉階段處於目標階段事件冒泡階段 事件捕捉階段：事件開始由頂層物件觸發，然後逐級向下傳播，直到目標的元素；處於目標階段：處在繫結事件的元素上；事件冒泡階段：事件由具體的元素先接收，然後逐級向上傳播，直到不具體的元素；
五、BOM 物件有哪些，列舉 window 物件？
分析：
再次提醒：這題是妙味JS班 BOM 課程的筆記。背下來吧，背不出來的去面壁……
建議回覆：
window 物件，是 JS 的最頂層物件，其他的 BOM 物件都是 window 物件的屬性；location 物件，瀏覽器當前URL資訊；navigator 物件，瀏覽器本身資訊；screen 物件，客戶端螢幕資訊；history 物件，瀏覽器訪問歷史資訊；
六、請簡述 AJAX 及基本步驟？
分析：
如果說僅僅只會用 AJAX 是基礎要求的話，那麼聽明白講師課上的細節分析，則是面試加分項之一。對於這種純概念題，建議面試前再寫一遍原生 AJAX 函式的封裝過程，一定要在理解的基礎上去背，才會在面試時有良好發揮。
建議回覆：
簡述 AJAX：AJAX即“Asynchronous Javascript And XML”（非同步 JavaScript 和 XML），是指一種建立互動式網頁應用的網頁開發技術。通過在後臺與伺服器進行少量資料交換，AJAX 可以使網頁實現非同步更新。這意味著可以在不重新載入整個網頁的情況下，對網頁的某部分進行更新。 AJAX 基本步驟：
初始化ajax物件連線地址，準備資料傳送請求接收資料（正在接收，尚未完成）接收資料完成
//初始化ajax物件 var xhr = new XMLHttpRequest(); //連線地址，準備資料 xhr.open(“方式”,”地址”,是否為非同步); //接收資料完成觸發的事件 xhr.onload =function(){} //傳送資料 xhr.send(); 七、HTTP 狀態訊息 200 302 304 403 404 500 分別表示什麼？
分析：
在聽講師講解 AJAX 課程的時候，請仔細留意講師所描述每一個數字背後的含義、以及有可能出現的場景。萬一在面試時考官不僅僅只是讓你背誦、而是給你一個場景讓你做問答題呢？——所以，“帶著理解去記憶” 是對付概念題最好的法寶，此外多看看延展的知識點，也是有益無害。
建議回覆：
200：請求已成功，請求所希望的響應頭或資料體將隨此響應返回。302：請求的資源臨時從不同的 URI 響應請求。由於這樣的重定向是臨時的，客戶端應當繼續向原有地址傳送以後的請求。只有在 Cache-Control 或 Expires 中進行了指定的情況下，這個響應才是可快取的。304：如果客戶端傳送了一個帶條件的 GET 請求且該請求已被允許，而文件的內容（自上次訪問以來或者根據請求的條件）並沒有改變，則伺服器應當返回這個狀態碼。304 響應禁止包含訊息體，因此始終以訊息頭後的第一個空行結尾。403：伺服器已經理解請求，但是拒絕執行它。404：請求失敗，請求所希望得到的資源未被在伺服器上發現。500：伺服器遇到了一個未曾預料的狀況，導致了它無法完成對請求的處理。一般來說，這個問題都會在伺服器端的原始碼出現錯誤時出現。
八、同步和非同步的區別?
分析：
又是概念題，又是課上容易打瞌睡的題對不對？看看下面的“建議回覆”吧，或許和你們上課的內容有些區別，因為講師們又重新換了個比喻，把容易讓人弄暈的、深入的知識，以舉例的形式描述了一遍。溫故而知新的體驗總是愉悅的，至於能把大家對該知識點的回憶勾起來多少？這就要看大家在妙味學習期間有沒有往心裡去了。
建議回覆：
首先同步非同步於阻塞非阻塞並沒有關係。同步非同步主要是事情做完以後，如何進行處理、或者說關注的是一種訊息通訊機制。同步的情況下，是由處理訊息者自己去等待訊息是否被觸發；而非同步的情況下是由觸發機制來通知處理訊息者； 舉例： 比如在妙味上課時，你問老師一個問題，這個問題可能需要花費一點時間去思考，這個時候老師可能：
思考，思考……，好了，有答案了；這個問題需要一點時間，你先做點別的，等我想好了，去找你。
第一種就是同步，第二種就是非同步。所以同步非同步可以說是對被請求方來說的，被請求者使用什麼方式來告知處理結果。
阻塞非阻塞，主要是對於請求者而言的。阻塞：發出請求等待結果返回，然後再處理後續的事情；非阻塞：發出請求不等待結果返回，可以接著做後續的事情； 舉例，還是上一個例子：
老師在使用同步思考的時候，你可以靜靜的等待老師給出答案，也可以邊做自己的事情邊等待老師的回答，當然這時候你需要時刻去關注老師是否已經想好了，在程式中需要進行輪詢了。乀(ˉεˉ乀)老師使用非同步的方式，這個時候老師告訴你可以先去做別的，好了就通知你，那麼你可以去做點別的，然後監聽事件就行，當然你也可以很軸，我就不做別的！我要一直等著老師“想好了”的事件發生。
所以同步可以是阻塞的也可以是非阻塞的，非同步也是如此。
九、GET和POST的區別，何時使用POST？
分析：
像是資料互動類的概念題在面試時被問到的機率之多，也反應出它在工作中的實用價值。所以沒別的，好好學吧，好好背！
建議回覆：
GET和POST的區別：
GET：一般用於查詢資料，使用URL傳遞引數，由於瀏覽器對位址列長度有限制，所以對使用get方式所傳送資訊的數量有限制，同時瀏覽器會記錄（歷史記錄，快取）中會保留請求地址的資訊，包括地址後面的資料。get 只能傳送普通格式（URL 編碼格式）的資料。
POST：一般用於向伺服器傳送資料，對所傳送的資料的大小理論上是沒有限制，瀏覽器會快取記錄地址，但是不會記錄 post 提交的資料。post 可以傳送純文字、URL編碼格式、二進位制格式的字串，形式多樣。
在以下情況中，請使用 POST 請求：
以提交為目的的請求（類似語義化，get 表示請求，post 表示提交）；傳送私密類資料（使用者名稱、密碼）（因為瀏覽器快取記錄特性）；向伺服器傳送大量資料（資料大小限制區別）；上傳檔案圖片時（資料型別區別）；
十、 AJAX 的侷限性?
分析：
剛剛上面有道題還分析了 AJAX 的原理步驟啥的，現在又冒出來個侷限性？如果你僅僅只是知道怎麼用它，那在看到這個題應該是一臉懵逼了……
建議回覆：
AJAX 不支援瀏覽器 back 按鈕。安全問題 AJAX 暴露了與伺服器互動的細節。對搜尋引擎的支援比較弱。不會執行你的 JS 指令碼，只會操作你的網頁原始碼；跨域請求有一定限制。解決方式：jsonp；
十一、new 操作符具體幹了什麼呢?
分析：
原理概念題，上課好好聽、做好筆記、好好理解……啦啦啦~
建議回覆：
當使用 new 操作符呼叫建構函式，函式實際會經歷如下步驟：
建立一個新物件；把函式中上下文（作用域）物件this指向該物件；執行程式碼，通過this給新物件新增屬性或方法；返回物件；
十二、null 和 undefined 的區別？
分析：
經典的概念題，要回答好的確需要功底紮實。
建議回覆：
null： null表示空值，轉為數值時為0； undefined：undefined表示"缺少值"，就是此處應該有一個值，但是還沒有定義。 變數被宣告瞭，但沒有賦值時，就等於undefined。物件沒有賦值的屬性，該屬性的值為undefined。函式沒有返回值時，預設返回undefined。
十三、JavaScript 原型，原型鏈 ? 有什麼特點？
分析：
不分析了，全是妙味實體班上課講的東西。。。ㄟ(▔,▔)ㄏ
建議回覆：
JavaScript 原型： 每建立一個函式，函式上都有一個屬性為 prototype，它的值是一個物件。 這個物件的作用在於當使用函式建立例項的時候，那麼這些例項都會共享原型上的屬性和方法。
原型鏈： 在 JavaScript 中，每個物件都有一個指向它的原型（prototype）物件的內部連結（proto）。這個原型物件又有自己的原型，直到某個物件的原型為 null 為止（也就是不再有原型指向）。這種一級一級的鏈結構就稱為原型鏈（prototype chain）。 當查詢一個物件的屬性時，JavaScript 會向上遍歷原型鏈，直到找到給定名稱的屬性為止;到查詢到達原型鏈的頂部（Object.prototype），仍然沒有找到指定的屬性，就會返回 undefined。
十四、實現對陣列進行亂序
分析：
這道題檢驗了陣列的 sort() 方法，因為是亂序，所以還需要用到 Math.random() 產生隨機數，打亂排序規律！——別怪我囉嗦，你們就說實體班課上有沒有講吧？！
建議回覆：
在寫程式碼前，先把實現原理介紹一下，然後再開始寫程式碼：
var a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; var sign = 1; a.sort(function(a, b) { return Math.random() - 0.5 }); 十五、實現一個函式 clone()，可以對 JavaScript 中的5種主要的資料型別（包括 Number、String、Object、Array、Boolean）進行值複製。
分析：
這道題考察了以下知識點：
使用 typeof 判斷值得型別；使用 toString 區分陣列和物件；遞迴函式的使用；
建議回覆：
function clone(obj) { //判斷是物件，就進行迴圈複製 if (typeof obj === 'object' && typeof obj !== 'null') { // 區分是陣列還是物件，建立空的陣列或物件 var o = Object.prototype.toString.call(obj).slice(8, -1) === "Array" ? [] : {}; for (var k in obj) { // 如果屬性對應的值為物件，則遞迴複製 if(typeof obj[k] === 'object' && typeof obj[k] !== 'null'){ o[k] = clone(obj[k]) }else{ o[k] = obj[k]; } } }else{ //不為物件，直接把值返回 return obj; } return o; } 假如以上面試題由你來做的話，能達到及格的小夥伴們舉個爪看看？ 大家還碰到哪些原生的 JS 面試題表示困惑了？不如拿出來和大家一起分享討論吧~
有疑惑的同學，就在這帖子下留言吧~~
有任何疑惑加群QQ786276452
對前端的技術，架構技術感興趣的同學關注我的頭條號，並在後臺私信傳送關鍵字：“前端”即可獲取免費的架構師學習資料
知識體系已整理好（原始碼，筆記，PPT，學習視訊），歡迎免費領取。還有面試視訊分享可以免費獲取。關注我，可以獲得沒有的架構經驗哦！！