你到底懂不懂JavaScript？下面本篇文章給大家整理分享12道JavaScript面試題，來做做這12道面試題試試，看看能不能全部答對！

前端（vue）入門到精通課程：進入學(xué)習(xí)

JavaScript 是每一個前端開發(fā)者都應(yīng)該掌握的基礎(chǔ)技術(shù)，但是很多時候，你可能并不完全懂 JavaScript。

檢測一個人的技術(shù)水平有兩個非常簡單的辦法，看他寫的代碼，或者讓他看別人寫的代碼。

我總結(jié)了一些可以考察對 JavaScript 理解能力的代碼題，你可以試著做一下，看看能不能全部答對。全答對了，才算是懂一些 JavaScript。

第一題

嘗試推測它的輸出：

const person = { name: '代碼與野獸' } Object.defineProperty(person, 'age', { value: 18 })  console.log(person.age) console.log(Object.keys(person))

輸出：

18 ['name']

解析：
很多人容易搞錯第二個輸出，因為使用 defineProperty 定義的屬性默認(rèn)是不可枚舉的。

第二題

嘗試推測它的輸出：

const name = '代碼與野獸' age = 18  console.log(delete name) console.log(delete age) console.log(typeof age)

輸出：

false true "undefined"

解析：
第一個 false 是因為 delete 只能刪除對象上的屬性，name 不是屬性，所以刪除失敗。
第二個 true 是因為我們不使用任何聲明創(chuàng)建變量，它會被視作全局變量，掛載到 window 對象上面，等價于 delete window.age，所以刪除成功。
第三個 undefined 是因為 age 被刪除了。

第三題

嘗試推測它的輸出：

let person = { name: '代碼與野獸' } const members = [person] person = null console.log(members)

輸出：

[{   name: "代碼與野獸" }]

解析：
很多人會認(rèn)為輸出結(jié)果應(yīng)該是 [ null ]，但是，我們只是設(shè)置了 person 這個變量的新引用，之前的引用還在 members 中。
簡單來說，{ name: '代碼與野獸' } 這個對象存在某個內(nèi)存空間中，假設(shè)它的地址是 X201。它的邏輯大概像下面這樣：

let person = X201 const members = [X201] persion = null

第四題

嘗試推測它的輸出：

function SuperHero() {   this.make = '代碼與野獸'   return { make: '野獸與代碼'} }  const mySuperhero = new SuperHero() console.log(mySuperhero)

輸出：

{   make: "野獸與代碼" }

解析：
如果構(gòu)造函數(shù)最終返回了一個對象，那么之前設(shè)置的屬性都將失效。

第五題

嘗試推測它的輸出：

const name = '代碼與野獸' console.log(name.padStart(14)) console.log(name.padStart(2))

輸出：

"         代碼與野獸" "代碼與野獸"

解析：
padStart 方法可以在字符串的開頭填充空格。
參數(shù)是新字符串的總長度，如果這個長度比原來的字符串長度短，那么不會填充。

第六題

嘗試推測它的輸出：

console.log(parseInt("7")) console.log(parseInt("7*6")) console.log(parseInt("7Din"))

輸出：

7 7 7

解析：
如果 parseInt 的參數(shù)是字符串和數(shù)字的組合，那么它會從頭開始檢查，直到碰到數(shù)據(jù)類型錯誤的位置，如果在數(shù)據(jù)類型錯誤的位置之前是一個有效的數(shù)字，它就會返回數(shù)字。

第七題

嘗試推測它的輸出：

[1, 2, 3, 4].reduce((x, y) => console.log(x, y))

輸出：

1 2 undefined 3 undefined 4

解析：
如果我們不給 reduce 傳遞初始值，那么 x 會是數(shù)組的第一個值，y 是數(shù)組的第二個值。

第八題

嘗試推測它的輸出：

function getUserInfo(one, two, three) {   console.log(one)   console.log(two)   console.log(three) }  const superHero = '代碼與野獸' const age = 1000  getUserInfo`${superHero} 是 ${age} 歲` getUserInfo`hello`

輸出：

["", " 是 ", " 歲"] "代碼與野獸" 1000 ["hello"] undefined undefined

解析：
我們使用模板字符串語法去調(diào)用函數(shù)時，第一個參數(shù)始終都是分割好的字符串?dāng)?shù)組。其余的參數(shù)是模板表達式的值。

第九題

嘗試推測它的輸出：

(() => {   let x, y;   try {     throw new Error()   } catch (x) {     (x = 1), (y = 2);     console.log(x)   }   console.log(x)   console.log(y) })()

輸出：

1 undefined 2

解析：
在 catch 中訪問 x，訪問的是參數(shù)，而不是外面的變量 x。

第十題

嘗試推測它的輸出：

class Clazz {}  console.log(typeof Clazz)

輸出：

"function"

解析：
在 JavaScript 中，Class 也是 function。

第十一題

嘗試推測它的輸出：

const arr = [7, 1, 4, 3, 2]; for (const elem of arr) {   setTimeout(() => console.log(elem), elem); }

輸出：

1 2 3 4 7

解析：
沒什么好解釋的……

第十二題

嘗試推測它的輸出：

const foo = { bar: 1 }; with(foo) {   var bar = 2 }; console.log(foo.bar);

輸出：

2

解析：

with 的對象會作為 global 對象。在 with 使用 var 等價于 window.[xxx]。而這時 foo 就是那個 window。

【