站長資訊網你到底懂不懂JavaScript？下面本篇文章給大家整理分享12道JavaScript面試題，來做做這12道面試題試試，看看能不能全部答對！
前端（vue）入門到精通課程：進入學習
JavaScript 是每一個前端開發者都應該掌握的基礎技術，但是很多時候，你可能并不完全懂 JavaScript。
檢測一個人的技術水平有兩個非常簡單的辦法，看他寫的代碼，或者讓他看別人寫的代碼。
我總結了一些可以考察對 JavaScript 理解能力的代碼題，你可以試著做一下，看看能不能全部答對。全答對了，才算是懂一些 JavaScript。
第一題
嘗試推測它的輸出：
const person = { name: '代碼與野獸' } Object.defineProperty(person, 'age', { value: 18 }) console.log(person.age) console.log(Object.keys(person))
輸出：
18 ['name']
解析：
很多人容易搞錯第二個輸出，因為使用 defineProperty 定義的屬性默認是不可枚舉的。
第二題
嘗試推測它的輸出：
const name = '代碼與野獸' age = 18 console.log(delete name) console.log(delete age) console.log(typeof age)
輸出：
false true "undefined"
解析：
第一個 false 是因為 delete 只能刪除對象上的屬性，name 不是屬性，所以刪除失敗。
第二個 true 是因為我們不使用任何聲明創建變量，它會被視作全局變量，掛載到 window 對象上面，等價于 delete window.age，所以刪除成功。
第三個 undefined 是因為 age 被刪除了。
第三題
嘗試推測它的輸出：
let person = { name: '代碼與野獸' } const members = [person] person = null console.log(members)
輸出：
[{ name: "代碼與野獸" }]
解析：
很多人會認為輸出結果應該是 [ null ]，但是，我們只是設置了 person 這個變量的新引用，之前的引用還在 members 中。
簡單來說，{ name: '代碼與野獸' } 這個對象存在某個內存空間中，假設它的地址是 X201。它的邏輯大概像下面這樣：
let person = X201 const members = [X201] persion = null
第四題
嘗試推測它的輸出：
function SuperHero() { this.make = '代碼與野獸' return { make: '野獸與代碼'} } const mySuperhero = new SuperHero() console.log(mySuperhero)
輸出：
{ make: "野獸與代碼" }
解析：
如果構造函數最終返回了一個對象，那么之前設置的屬性都將失效。
第五題
嘗試推測它的輸出：
const name = '代碼與野獸' console.log(name.padStart(14)) console.log(name.padStart(2))
輸出：
" 代碼與野獸" "代碼與野獸"
解析：
padStart 方法可以在字符串的開頭填充空格。
參數是新字符串的總長度，如果這個長度比原來的字符串長度短，那么不會填充。
第六題
嘗試推測它的輸出：
console.log(parseInt("7")) console.log(parseInt("7*6")) console.log(parseInt("7Din"))
輸出：
7 7 7
解析：
如果 parseInt 的參數是字符串和數字的組合，那么它會從頭開始檢查，直到碰到數據類型錯誤的位置，如果在數據類型錯誤的位置之前是一個有效的數字，它就會返回數字。
第七題
嘗試推測它的輸出：
[1, 2, 3, 4].reduce((x, y) => console.log(x, y))
輸出：
1 2 undefined 3 undefined 4
解析：
如果我們不給 reduce 傳遞初始值，那么 x 會是數組的第一個值，y 是數組的第二個值。
第八題
嘗試推測它的輸出：
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
解析：
我們使用模板字符串語法去調用函數時，第一個參數始終都是分割好的字符串數組。其余的參數是模板表達式的值。
第九題
嘗試推測它的輸出：
(() => { 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，訪問的是參數，而不是外面的變量 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。
【
