JavaScript?進(jìn)階問(wèn)題列表(各種js代碼段1-65)
我在我的 Instagram 上每天都會(huì)發(fā)布 JavaScript 的多選問(wèn)題,并且同時(shí)也會(huì)在這個(gè)倉(cāng)庫(kù)中發(fā)布。
從基礎(chǔ)到進(jìn)階,測(cè)試你有多了解 JavaScript,刷新你的知識(shí),或者幫助你的 coding 面試! :muscle: :rocket: 我每周都會(huì)在這個(gè)倉(cāng)庫(kù)下更新新的問(wèn)題。
答案在問(wèn)題下方的折疊部分,點(diǎn)擊即可展開(kāi)問(wèn)題。祝你好運(yùn)
因?yàn)槠邢捱@里提供的是1-65條,剩下的在文章結(jié)尾
1. 輸出是什么?
function sayHi() {
console.log(name)
console.log(age)
var name = 'Lydia'
let age = 21
}
sayHi()- A:
Lydia和undefined - B:
Lydia和ReferenceError - C:
ReferenceError和21 - D:
undefined和ReferenceError
答案
答案:D
在函數(shù)內(nèi)部,我們首先通過(guò) var 關(guān)鍵字聲明了 name 變量。這意味著變量被提升了(內(nèi)存空間在創(chuàng)建階段就被設(shè)置好了),直到程序運(yùn)行到定義變量位置之前默認(rèn)值都是 undefined。因?yàn)楫?dāng)我們打印 name 變量時(shí)還沒(méi)有執(zhí)行到定義變量的位置,因此變量的值保持為 undefined。
通過(guò) let 和 const 關(guān)鍵字聲明的變量也會(huì)提升,但是和 var 不同,它們不會(huì)被初始化。在我們聲明(初始化)之前是不能訪(fǎng)問(wèn)它們的。這個(gè)行為被稱(chēng)之為暫時(shí)性死區(qū)。當(dāng)我們?cè)噲D在聲明之前訪(fǎng)問(wèn)它們時(shí),JavaScript 將會(huì)拋出一個(gè) ReferenceError 錯(cuò)誤。
2. 輸出是什么?
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1)
}
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 1)
}- A:
0 1 2和0 1 2 - B:
0 1 2和3 3 3 - C:
3 3 3和0 1 2
答案
答案:C
由于 JavaScript 的事件循環(huán),setTimeout 回調(diào)會(huì)在遍歷結(jié)束后才執(zhí)行。因?yàn)樵诘谝粋€(gè)遍歷中遍歷 i 是通過(guò) var 關(guān)鍵字聲明的,所以這個(gè)值是全局作用域下的。在遍歷過(guò)程中,我們通過(guò)一元操作符 ++ 來(lái)每次遞增 i 的值。當(dāng) setTimeout 回調(diào)執(zhí)行的時(shí)候,i 的值等于 3。
在第二個(gè)遍歷中,遍歷 i 是通過(guò) let 關(guān)鍵字聲明的:通過(guò) let 和 const 關(guān)鍵字聲明的變量是擁有塊級(jí)作用域(指的是任何在 {} 中的內(nèi)容)。在每次的遍歷過(guò)程中,i 都有一個(gè)新值,并且每個(gè)值都在循環(huán)內(nèi)的作用域中。
3. 輸出是什么?
const shape = {
radius: 10,
diameter() {
return this.radius * 2
},
perimeter: () => 2 * Math.PI * this.radius
}
shape.diameter()
shape.perimeter()- A:
20and62.83185307179586 - B:
20andNaN - C:
20and63 - D:
NaNand63
答案
答案:B
注意 diameter 的值是一個(gè)常規(guī)函數(shù),但是 perimeter 的值是一個(gè)箭頭函數(shù)。
對(duì)于箭頭函數(shù),this 關(guān)鍵字指向的是它當(dāng)前周?chē)饔糜颍ê?jiǎn)單來(lái)說(shuō)是包含箭頭函數(shù)的常規(guī)函數(shù),如果沒(méi)有常規(guī)函數(shù)的話(huà)就是全局對(duì)象),這個(gè)行為和常規(guī)函數(shù)不同。這意味著當(dāng)我們調(diào)用 perimeter 時(shí),this 不是指向 shape 對(duì)象,而是它的周?chē)饔糜颍ㄔ诶又惺?window)。
在 window 中沒(méi)有 radius 這個(gè)屬性,因此返回 undefined。
4. 輸出是什么?
+true; !"Lydia";
- A:
1andfalse - B:
falseandNaN - C:
falseandfalse
答案
答案:A
一元操作符加號(hào)嘗試將 bool 轉(zhuǎn)為 number。true 轉(zhuǎn)換為 number 的話(huà)為 1,false 為 0。
字符串 'Lydia' 是一個(gè)真值,真值取反那么就返回 false。
5. 哪一個(gè)是正確的?
const bird = {
size: 'small'
}
const mouse = {
name: 'Mickey',
small: true
}- A:
mouse.bird.size是無(wú)效的 - B:
mouse[bird.size]是無(wú)效的 - C:
mouse[bird["size"]]是無(wú)效的 - D: 以上三個(gè)選項(xiàng)都是有效的
答案
答案:A
在 JavaScript 中,所有對(duì)象的 keys 都是字符串(除非對(duì)象是 Symbol)。盡管我們可能不會(huì)定義它們?yōu)樽址?,但它們?cè)诘讓涌倳?huì)被轉(zhuǎn)換為字符串。
當(dāng)我們使用括號(hào)語(yǔ)法時(shí)([]),JavaScript 會(huì)解釋?zhuān)ɑ蛘?unboxes)語(yǔ)句。它首先看到第一個(gè)開(kāi)始括號(hào) [ 并繼續(xù)前進(jìn)直到找到結(jié)束括號(hào) ]。只有這樣,它才會(huì)計(jì)算語(yǔ)句的值。
mouse[bird.size]:首先計(jì)算 bird.size,這會(huì)得到 small。mouse["small"] 返回 true。
然后使用點(diǎn)語(yǔ)法的話(huà),上面這一切都不會(huì)發(fā)生。mouse 沒(méi)有 bird 這個(gè) key,這也就意味著 mouse.bird 是 undefined。然后當(dāng)我們使用點(diǎn)語(yǔ)法 mouse.bird.size 時(shí),因?yàn)?mouse.bird 是 undefined,這也就變成了 undefined.size。這個(gè)行為是無(wú)效的,并且會(huì)拋出一個(gè)錯(cuò)誤類(lèi)似 Cannot read property "size" of undefined。
6. 輸出是什么?
let c = { greeting: 'Hey!' }
let d
d = c
c.greeting = 'Hello'
console.log(d.greeting)- A:
Hello - B:
undefined - C:
ReferenceError - D:
TypeError
答案
答案:A
在 JavaScript 中,當(dāng)設(shè)置兩個(gè)對(duì)象彼此相等時(shí),它們會(huì)通過(guò)引用進(jìn)行交互。
首先,變量 c 的值是一個(gè)對(duì)象。接下來(lái),我們給 d 分配了一個(gè)和 c 對(duì)象相同的引用。

因此當(dāng)我們改變其中一個(gè)對(duì)象時(shí),其實(shí)是改變了所有的對(duì)象。
7. 輸出是什么?
let a = 3 let b = new Number(3) let c = 3 console.log(a == b) console.log(a === b) console.log(b === c)
- A:
truefalsetrue - B:
falsefalsetrue - C:
truefalsefalse - D:
falsetruetrue
答案
答案:C
new Number() 是一個(gè)內(nèi)建的函數(shù)構(gòu)造器。雖然它看著像是一個(gè) number,但它實(shí)際上并不是一個(gè)真實(shí)的 number:它有一堆額外的功能并且它是一個(gè)對(duì)象。
當(dāng)我們使用 == 操作符時(shí),它只會(huì)檢查兩者是否擁有相同的值。因?yàn)樗鼈兊闹刀际?3,因此返回 true。
然后,當(dāng)我們使用 === 操作符時(shí),兩者的值以及類(lèi)型都應(yīng)該是相同的。new Number() 是一個(gè)對(duì)象而不是 number,因此返回 false。
8. 輸出是什么?
class Chameleon {
static colorChange(newColor) {
this.newColor = newColor
return this.newColor
}
constructor({ newColor = 'green' } = {}) {
this.newColor = newColor
}
}
const freddie = new Chameleon({ newColor: 'purple' })
freddie.colorChange('orange')- A:
orange - B:
purple - C:
green - D:
TypeError
答案
答案:D
colorChange 是一個(gè)靜態(tài)方法。靜態(tài)方法被設(shè)計(jì)為只能被創(chuàng)建它們的構(gòu)造器使用(也就是 Chameleon),并且不能傳遞給實(shí)例。因?yàn)?freddie 是一個(gè)實(shí)例,靜態(tài)方法不能被實(shí)例使用,因此拋出了 TypeError 錯(cuò)誤。
9. 輸出是什么?
let greeting
greetign = {} // Typo!
console.log(greetign)- A:
{} - B:
ReferenceError: greetign is not defined - C:
undefined
答案
答案:A
代碼打印出了一個(gè)對(duì)象,這是因?yàn)槲覀冊(cè)谌謱?duì)象上創(chuàng)建了一個(gè)空對(duì)象!當(dāng)我們將 greeting 寫(xiě)錯(cuò)成 greetign 時(shí),JS 解釋器實(shí)際在上瀏覽器中將它視為 global.greetign = {}(或者 window.greetign = {})。
為了避免這個(gè)為題,我們可以使用 `"use strict"。這能確保當(dāng)你聲明變量時(shí)必須賦值。
10. 當(dāng)我們這么做時(shí),會(huì)發(fā)生什么?
function bark() {
console.log('Woof!')
}
bark.animal = 'dog'- A: 正常運(yùn)行!
- B:
SyntaxError. 你不能通過(guò)這種方式給函數(shù)增加屬性。 - C:
undefined - D:
ReferenceError
答案
答案:A
這在 JavaScript 中是可以的,因?yàn)楹瘮?shù)是對(duì)象?。ǔ嘶绢?lèi)型之外其他都是對(duì)象)
函數(shù)是一個(gè)特殊的對(duì)象。你寫(xiě)的這個(gè)代碼其實(shí)不是一個(gè)實(shí)際的函數(shù)。函數(shù)是一個(gè)擁有屬性的對(duì)象,并且屬性也可被調(diào)用。
11. 輸出是什么?
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
const member = new Person("Lydia", "Hallie");
Person.getFullName = function () {
return `${this.firstName} ${this.lastName}`;
}
console.log(member.getFullName());- A:
TypeError - B:
SyntaxError - C:
Lydia Hallie - D:
undefinedundefined
答案
答案:A
你不能像常規(guī)對(duì)象那樣,給構(gòu)造函數(shù)添加屬性。如果你想一次性給所有實(shí)例添加特性,你應(yīng)該使用原型。因此本例中,使用如下方式:
Person.prototype.getFullName = function () {
return ${this.firstName} ${this.lastName};
}
這才會(huì)使 member.getFullName() 起作用。為什么這么做有益的?假設(shè)我們將這個(gè)方法添加到構(gòu)造函數(shù)本身里。也許不是每個(gè) Person 實(shí)例都需要這個(gè)方法。這將浪費(fèi)大量?jī)?nèi)存空間,因?yàn)樗鼈內(nèi)匀痪哂性搶傩?,這將占用每個(gè)實(shí)例的內(nèi)存空間。相反,如果我們只將它添加到原型中,那么它只存在于內(nèi)存中的一個(gè)位置,但是所有實(shí)例都可以訪(fǎng)問(wèn)它!
12. 輸出是什么?
function Person(firstName, lastName) {
this.firstName = firstName
this.lastName = lastName
}
const lydia = new Person('Lydia', 'Hallie')
const sarah = Person('Sarah', 'Smith')
console.log(lydia)
console.log(sarah)- A:
Person {firstName: "Lydia", lastName: "Hallie"}andundefined - B:
Person {firstName: "Lydia", lastName: "Hallie"}andPerson {firstName: "Sarah", lastName: "Smith"} - C:
Person {firstName: "Lydia", lastName: "Hallie"}and{} - D:
Person {firstName: "Lydia", lastName: "Hallie"}andReferenceError
答案
答案:A
對(duì)于 sarah,我們沒(méi)有使用 new 關(guān)鍵字。當(dāng)使用 new 時(shí),this 引用我們創(chuàng)建的空對(duì)象。當(dāng)未使用 new 時(shí),this 引用的是全局對(duì)象(global object)。
我們說(shuō) this.firstName 等于 "Sarah",并且 this.lastName 等于 "Smith"。實(shí)際上我們做的是,定義了 global.firstName = 'Sarah' 和 global.lastName = 'Smith'。而 sarah 本身是 undefined。
13. 事件傳播的三個(gè)階段是什么?
- A: Target > Capturing > Bubbling
- B: Bubbling > Target > Capturing
- C: Target > Bubbling > Capturing
- D: Capturing > Target > Bubbling
答案
答案:D
在捕獲(capturing)階段中,事件從祖先元素向下傳播到目標(biāo)元素。當(dāng)事件達(dá)到目標(biāo)(target)元素后,冒泡(bubbling)才開(kāi)始。

14. 所有對(duì)象都有原型。
- A: 對(duì)
- B: 錯(cuò)
答案
答案:B
除了基本對(duì)象(base object),所有對(duì)象都有原型?;緦?duì)象可以訪(fǎng)問(wèn)一些方法和屬性,比如 .toString。這就是為什么你可以使用內(nèi)置的 JavaScript 方法!所有這些方法在原型上都是可用的。雖然 JavaScript 不能直接在對(duì)象上找到這些方法,但 JavaScript 會(huì)沿著原型鏈找到它們,以便于你使用。
15. 輸出是什么?
function sum(a, b) {
return a + b
}
sum(1, '2')- A:
NaN - B:
TypeError - C:
"12" - D:
3
答案
答案:C
JavaScript 是一種動(dòng)態(tài)類(lèi)型語(yǔ)言:我們不指定某些變量的類(lèi)型。值可以在你不知道的情況下自動(dòng)轉(zhuǎn)換成另一種類(lèi)型,這種類(lèi)型稱(chēng)為隱式類(lèi)型轉(zhuǎn)換(implicit type coercion)。Coercion 是指將一種類(lèi)型轉(zhuǎn)換為另一種類(lèi)型。
在本例中,JavaScript 將數(shù)字 1 轉(zhuǎn)換為字符串,以便函數(shù)有意義并返回一個(gè)值。在數(shù)字類(lèi)型(1)和字符串類(lèi)型('2')相加時(shí),該數(shù)字被視為字符串。我們可以連接字符串,比如 "Hello" + "World",這里發(fā)生的是 "1" + "2",它返回 "12"。
16. 輸出是什么?
let number = 0 console.log(number++) console.log(++number) console.log(number)
- A:
112 - B:
122 - C:
022 - D:
012
答案
答案:C
一元后自增運(yùn)算符 ++:
- 返回值(返回
0) - 值自增(number 現(xiàn)在是
1)
一元前自增運(yùn)算符 ++:
- 值自增(number 現(xiàn)在是
2) - 返回值(返回
2)
結(jié)果是 0 2 2.
17. 輸出是什么?
function getPersonInfo(one, two, three) {
console.log(one)
console.log(two)
console.log(three)
}
const person = 'Lydia'
const age = 21
getPersonInfo`${person} is ${age} years old`- A:
"Lydia"21["", " is ", " years old"] - B:
["", " is ", " years old"]"Lydia"21 - C:
"Lydia"["", " is ", " years old"]21
答案
答案:B
如果使用標(biāo)記模板字面量,第一個(gè)參數(shù)的值總是包含字符串的數(shù)組。其余的參數(shù)獲取的是傳遞的表達(dá)式的值!
18. 輸出是什么?
function checkAge(data) {
if (data === { age: 18 }) {
console.log('You are an adult!')
} else if (data == { age: 18 }) {
console.log('You are still an adult.')
} else {
console.log(`Hmm.. You don't have an age I guess`)
}
}
checkAge({ age: 18 })- A:
You are an adult! - B:
You are still an adult. - C:
Hmm.. You don't have an age I guess
答案
答案:C
在測(cè)試相等性時(shí),基本類(lèi)型通過(guò)它們的值(value)進(jìn)行比較,而對(duì)象通過(guò)它們的引用(reference)進(jìn)行比較。JavaScript 檢查對(duì)象是否具有對(duì)內(nèi)存中相同位置的引用。
題目中我們正在比較的兩個(gè)對(duì)象不是同一個(gè)引用:作為參數(shù)傳遞的對(duì)象引用的內(nèi)存位置,與用于判斷相等的對(duì)象所引用的內(nèi)存位置并不同。
這也是 { age: 18 } === { age: 18 } 和 { age: 18 } == { age: 18 } 都返回 false 的原因。
19. 輸出是什么?
function getAge(...args) {
console.log(typeof args)
}
getAge(21)- A:
"number" - B:
"array" - C:
"object" - D:
"NaN"
答案
答案:C
擴(kuò)展運(yùn)算符(...args)會(huì)返回實(shí)參組成的數(shù)組。而數(shù)組是對(duì)象,因此 typeof args 返回 "object"。
20. 輸出是什么?
function getAge() {
'use strict'
age = 21
console.log(age)
}
getAge()- A:
21 - B:
undefined - C:
ReferenceError - D:
TypeError
答案
答案:C
使用 "use strict",你可以確保不會(huì)意外地聲明全局變量。我們從來(lái)沒(méi)有聲明變量 age,因?yàn)槲覀兪褂?"use strict",它將拋出一個(gè)引用錯(cuò)誤。如果我們不使用 "use strict",它就會(huì)工作,因?yàn)閷傩?age 會(huì)被添加到全局對(duì)象中了。
21. 輸出是什么?
const sum = eval('10*10+5')- A:
105 - B:
"105" - C:
TypeError - D:
"10*10+5"
答案
答案:A
代碼以字符串形式傳遞進(jìn)來(lái),eval 對(duì)其求值。如果它是一個(gè)表達(dá)式,就像本例中那樣,它對(duì)表達(dá)式求值。表達(dá)式是 10 * 10 + 5。這將返回?cái)?shù)字 105。
22. cool_secret 可訪(fǎng)問(wèn)多長(zhǎng)時(shí)間?
sessionStorage.setItem('cool_secret', 123)- A: 永遠(yuǎn),數(shù)據(jù)不會(huì)丟失。
- B: 當(dāng)用戶(hù)關(guān)掉標(biāo)簽頁(yè)時(shí)。
- C: 當(dāng)用戶(hù)關(guān)掉整個(gè)瀏覽器,而不只是關(guān)掉標(biāo)簽頁(yè)。
- D: 當(dāng)用戶(hù)關(guān)閉電腦時(shí)。
答案
答案:B
關(guān)閉 tab 標(biāo)簽頁(yè) 后,sessionStorage 存儲(chǔ)的數(shù)據(jù)才會(huì)刪除。
如果使用 localStorage,那么數(shù)據(jù)將永遠(yuǎn)在那里,除非調(diào)用了 localStorage.clear()。
23. 輸出是什么?
var num = 8 var num = 10 console.log(num)
- A:
8 - B:
10 - C:
SyntaxError - D:
ReferenceError
答案
答案:B
使用 var 關(guān)鍵字,你可以用相同的名稱(chēng)聲明多個(gè)變量。然后變量將保存最新的值。
你不能使用 let 或 const 來(lái)實(shí)現(xiàn)這一點(diǎn),因?yàn)樗鼈兪菈K作用域的。
24. 輸出是什么?
const obj = { 1: 'a', 2: 'b', 3: 'c' }
const set = new Set([1, 2, 3, 4, 5])
obj.hasOwnProperty('1')
obj.hasOwnProperty(1)
set.has('1')
set.has(1)- A:
falsetruefalsetrue - B:
falsetruetruetrue - C:
truetruefalsetrue - D:
truetruetruetrue
答案
答案:C
所有對(duì)象的鍵(不包括 Symbol)在底層都是字符串,即使你自己沒(méi)有將其作為字符串輸入。這就是為什么 obj.hasOwnProperty('1') 也返回 true。
對(duì)于集合,它不是這樣工作的。在我們的集合中沒(méi)有 '1':set.has('1') 返回 false。它有數(shù)字類(lèi)型為 1,set.has(1) 返回 true。
25. 輸出是什么?
const obj = { a: 'one', b: 'two', a: 'three' }
console.log(obj)- A:
{ a: "one", b: "two" } - B:
{ b: "two", a: "three" } - C:
{ a: "three", b: "two" } - D:
SyntaxError
答案
答案:C
如果你有兩個(gè)名稱(chēng)相同的鍵,則鍵會(huì)被替換掉。它仍然位于第一個(gè)鍵出現(xiàn)的位置,但是值是最后出現(xiàn)那個(gè)鍵的值。
26. JavaScript 全局執(zhí)行上下文為你做了兩件事:全局對(duì)象和 this 關(guān)鍵字。
- A: 對(duì)
- B: 錯(cuò)
- C: 看情況
答案
答案:A
基本執(zhí)行上下文是全局執(zhí)行上下文:它是代碼中隨處可訪(fǎng)問(wèn)的內(nèi)容。
27. 輸出是什么?
for (let i = 1; i < 5; i++) {
if (i === 3) continue
console.log(i)
}- A:
12 - B:
123 - C:
124 - D:
134
答案
答案:C
如果某個(gè)條件返回 true,則 continue 語(yǔ)句跳過(guò)本次迭代。
28. 輸出是什么?
String.prototype.giveLydiaPizza = () => {
return 'Just give Lydia pizza already!'
}
const name = 'Lydia'
name.giveLydiaPizza()- A:
"Just give Lydia pizza already!" - B:
TypeError: not a function - C:
SyntaxError - D:
undefined
答案
答案:A
String 是內(nèi)置的構(gòu)造函數(shù),我們可以向它添加屬性。我只是在它的原型中添加了一個(gè)方法?;绢?lèi)型字符串被自動(dòng)轉(zhuǎn)換為字符串對(duì)象,由字符串原型函數(shù)生成。因此,所有 string(string 對(duì)象) 都可以訪(fǎng)問(wèn)該方法!
29. 輸出是什么?
const a = {}
const b = { key: 'b' }
const c = { key: 'c' }
a[b] = 123
a[c] = 456
console.log(a[b])- A:
123 - B:
456 - C:
undefined - D:
ReferenceError
答案
答案:B
對(duì)象的鍵被自動(dòng)轉(zhuǎn)換為字符串。我們?cè)噲D將一個(gè)對(duì)象 b 設(shè)置為對(duì)象 a 的鍵,且相應(yīng)的值為 123。
然而,當(dāng)字符串化一個(gè)對(duì)象時(shí),它會(huì)變成 "[object Object]"。因此這里說(shuō)的是,a["[object Object]"] = 123。然后,我們?cè)僖淮巫隽送瑯拥氖虑椋?code>c 是另外一個(gè)對(duì)象,這里也有隱式字符串化,于是,a["[object Object]"] = 456。
然后,我們打印 a[b],也就是 a["[object Object]"]。之前剛設(shè)置為 456,因此返回的是 456。
30. 輸出是什么?
const foo = () => console.log('First')
const bar = () => setTimeout(() => console.log('Second'))
const baz = () => console.log('Third')
bar()
foo()
baz()- A:
FirstSecondThird - B:
FirstThirdSecond - C:
SecondFirstThird - D:
SecondThirdFirst
答案
答案:B
我們有一個(gè) setTimeout 函數(shù),并首先調(diào)用它。然而,它是最后打印日志的。
這是因?yàn)樵跒g覽器中,我們不僅有運(yùn)行時(shí)引擎,還有一個(gè)叫做 WebAPI 的東西。WebAPI 提供了 setTimeout 函數(shù),也包含其他的,例如 DOM。
將 callback 推送到 WebAPI 后,setTimeout 函數(shù)本身 (但不是回調(diào)!) 將從棧中彈出。

現(xiàn)在,foo 被調(diào)用,打印 "First"。

foo 從棧中彈出,baz 被調(diào)用。打印 "Third"。

WebAPI 不能隨時(shí)向棧內(nèi)添加內(nèi)容。相反,它將回調(diào)函數(shù)推到名為 queue 的地方。

這就是事件循環(huán)開(kāi)始工作的地方。一個(gè)事件循環(huán)查看棧和任務(wù)隊(duì)列。如果棧是空的,它接受隊(duì)列上的第一個(gè)元素并將其推入棧。

bar 被調(diào)用,打印 "Second",然后它被棧彈出。
31. 當(dāng)點(diǎn)擊按鈕時(shí),event.target 是什么?
<div onclick="console.log('first div')">
<div onclick="console.log('second div')">
<button onclick="console.log('button')">
Click!
</button>
</div>
</div>- A: Outer
div - B: Inner
div - C:
button - D: 一個(gè)包含所有嵌套元素的數(shù)組。
答案
答案:C
導(dǎo)致事件的最深嵌套的元素是事件的 target。你可以通過(guò) event.stopPropagation 來(lái)停止冒泡。
32. 當(dāng)您單擊該段落時(shí),日志輸出是什么?
<div onclick="console.log('div')">
<p onclick="console.log('p')">
Click here!
</p>
</div>- A:
pdiv - B:
divp - C:
p - D:
div
答案
答案:A
如果我們點(diǎn)擊 p,我們會(huì)看到兩個(gè)日志:p 和 div。在事件傳播期間,有三個(gè)階段:捕獲、目標(biāo)和冒泡。默認(rèn)情況下,事件處理程序在冒泡階段執(zhí)行(除非將 useCapture 設(shè)置為 true)。它從嵌套最深的元素向外傳播。
33. 輸出是什么?
const person = { name: 'Lydia' }
function sayHi(age) {
console.log(`${this.name} is ${age}`)
}
sayHi.call(person, 21)
sayHi.bind(person, 21)- A:
undefined is 21Lydia is 21 - B:
functionfunction - C:
Lydia is 21Lydia is 21 - D:
Lydia is 21function
答案
答案:D
使用這兩種方法,我們都可以傳遞我們希望 this 關(guān)鍵字引用的對(duì)象。但是,.call 是立即執(zhí)行的。
.bind 返回函數(shù)的副本,但帶有綁定上下文!它不是立即執(zhí)行的。
34. 輸出是什么?
function sayHi() {
return (() => 0)()
}
typeof sayHi()- A:
"object" - B:
"number" - C:
"function" - D:
"undefined"
答案
答案:B
sayHi 方法返回的是立即執(zhí)行函數(shù) (IIFE) 的返回值。此立即執(zhí)行函數(shù)的返回值是 0,類(lèi)型是 number
參考:只有 7 種內(nèi)置類(lèi)型:null,undefined,boolean,number,string,object, symbol 和 bigint。function 不是一種類(lèi)型,函數(shù)是對(duì)象,它的類(lèi)型是object。
35. 下面哪些值是 falsy?
0
new Number(0)
('')
(' ')
new Boolean(false)
undefined- A:
0,'',undefined - B:
0,new Number(0),'',new Boolean(false),undefined - C:
0,'',new Boolean(false),undefined - D: All of them are falsy
答案
答案:A
只有 8 種 falsy 值:
undefinednullNaNfalse''(empty string)0-00n(BigInt(0))
Function 構(gòu)造函數(shù),比如 new Number 和 new Boolean,是 truthy。
36. 輸出是什么?
console.log(typeof typeof 1)
- A:
"number" - B:
"string" - C:
"object" - D:
"undefined"
答案
答案:B
typeof 1 返回 "number"。 typeof "number" 返回 "string"。
37. 輸出是什么?
const numbers = [1, 2, 3] numbers[10] = 11 console.log(numbers)
- A:
[1, 2, 3, 7 x null, 11] - B:
[1, 2, 3, 11] - C:
[1, 2, 3, 7 x empty, 11] - D:
SyntaxError
答案
答案:C
當(dāng)你為數(shù)組設(shè)置超過(guò)數(shù)組長(zhǎng)度的值的時(shí)候,JavaScript 會(huì)創(chuàng)建名為 "empty slots" 的東西。它們的值實(shí)際上是 undefined。你會(huì)看到以下場(chǎng)景:
[1, 2, 3, 7 x empty, 11]
這取決于你的運(yùn)行環(huán)境(每個(gè)瀏覽器,以及 node 環(huán)境,都有可能不同)
38. 輸出是什么?
(() => {
let x, y
try {
throw new Error()
} catch (x) {
(x = 1), (y = 2)
console.log(x)
}
console.log(x)
console.log(y)
})()- A:
1undefined2 - B:
undefinedundefinedundefined - C:
112 - D:
1undefinedundefined
答案
答案:A
catch 代碼塊接收參數(shù) x。當(dāng)我們傳遞參數(shù)時(shí),這與之前定義的變量 x 不同。這個(gè) x 是屬于 catch 塊級(jí)作用域的。
然后,我們將塊級(jí)作用域中的變量賦值為 1,同時(shí)也設(shè)置了變量 y 的值?,F(xiàn)在,我們打印塊級(jí)作用域中的變量 x,值為 1。
catch 塊之外的變量 x 的值仍為 undefined,y 的值為 2。當(dāng)我們?cè)?catch 塊之外執(zhí)行 console.log(x) 時(shí),返回 undefined,y 返回 2。
39. JavaScript 中的一切都是?
- A: 基本類(lèi)型與對(duì)象
- B: 函數(shù)與對(duì)象
- C: 只有對(duì)象
- D: 數(shù)字與對(duì)象
答案
答案:A
JavaScript 只有基本類(lèi)型和對(duì)象。
基本類(lèi)型包括 boolean, null, undefined, bigint, number, string, symbol。
40. 輸出是什么?
[[0, 1], [2, 3]].reduce(
(acc, cur) => {
return acc.concat(cur)
},
[1, 2]
)- A:
[0, 1, 2, 3, 1, 2] - B:
[6, 1, 2] - C:
[1, 2, 0, 1, 2, 3] - D:
[1, 2, 6]
答案
答案:C
[1, 2]是初始值。初始值將會(huì)作為首次調(diào)用時(shí)第一個(gè)參數(shù) acc 的值。在第一次執(zhí)行時(shí),acc 的值是 [1, 2],cur 的值是 [0, 1]。合并它們,結(jié)果為 [1, 2, 0, 1]。 第二次執(zhí)行,acc 的值是 [1, 2, 0, 1],cur 的值是 [2, 3]。合并它們,最終結(jié)果為 [1, 2, 0, 1, 2, 3]
41. 輸出是什么?
!!null !!'' !!1
- A:
falsetruefalse - B:
falsefalsetrue - C:
falsetruetrue - D:
truetruefalse
答案
答案:B
null 是 falsy。!null 的值是 true。!true 的值是 false。
"" 是 falsy。!"" 的值是 true。!true 的值是 false。
1 是 truthy。!1 的值是 false。!false 的值是 true。
42. setInterval 方法的返回值是什么?
setInterval(() => console.log('Hi'), 1000)- A: 一個(gè)唯一的 id
- B: 該方法指定的毫秒數(shù)
- C: 傳遞的函數(shù)
- D:
undefined
答案
答案:A
setInterval 返回一個(gè)唯一的 id。此 id 可被用于 clearInterval 函數(shù)來(lái)取消定時(shí)。
43. 輸出是什么?
[...'Lydia']
- A:
["L", "y", "d", "i", "a"] - B:
["Lydia"] - C:
[[], "Lydia"] - D:
[["L", "y", "d", "i", "a"]]
答案
答案:A
string 類(lèi)型是可迭代的。擴(kuò)展運(yùn)算符將迭代的每個(gè)字符映射成一個(gè)元素。
44. 輸出是什么?
function* generator(i) {
yield i;
yield i * 2;
}
const gen = generator(10);
console.log(gen.next().value);
console.log(gen.next().value);- A:
[0, 10], [10, 20] - B:
20, 20 - C:
10, 20 - D:
0, 10 and 10, 20
答案
答案:C
一般的函數(shù)在執(zhí)行之后是不能中途停下的。但是,生成器函數(shù)卻可以中途“停下”,之后可以再?gòu)耐O碌牡胤嚼^續(xù)。當(dāng)生成器遇到yield關(guān)鍵字的時(shí)候,會(huì)生成yield后面的值。注意,生成器在這種情況下不 返回 (return ) 值,而是 生成 (yield) 值。
首先,我們用10作為參數(shù)i來(lái)初始化生成器函數(shù)。然后使用next()方法一步步執(zhí)行生成器。第一次執(zhí)行生成器的時(shí)候,i的值為10,遇到第一個(gè)yield關(guān)鍵字,它要生成i的值。此時(shí),生成器“暫停”,生成了10。
然后,我們?cè)賵?zhí)行next()方法。生成器會(huì)從剛才暫停的地方繼續(xù),這個(gè)時(shí)候i還是10。于是我們走到了第二個(gè)yield關(guān)鍵字處,這時(shí)候需要生成的值是i*2,i為10,那么此時(shí)生成的值便是20。所以這道題的最終結(jié)果是10,20。
45. 返回值是什么?
const firstPromise = new Promise((res, rej) => {
setTimeout(res, 500, "one");
});
const secondPromise = new Promise((res, rej) => {
setTimeout(res, 100, "two");
});
Promise.race([firstPromise, secondPromise]).then(res => console.log(res));- A:
"one" - B:
"two" - C:
"two" "one" - D:
"one" "two"
答案
答案:B
當(dāng)我們向Promise.race方法中傳入多個(gè)Promise時(shí),會(huì)進(jìn)行 優(yōu)先 解析。在這個(gè)例子中,我們用setTimeout給firstPromise和secondPromise分別設(shè)定了 500ms 和 100ms 的定時(shí)器。這意味著secondPromise會(huì)首先解析出字符串two。那么此時(shí)res參數(shù)即為two,是為輸出結(jié)果。
46. 輸出是什么?
let person = { name: "Lydia" };
const members = [person];
person = null;
console.log(members);- A:
null - B:
[null] - C:
[{}] - D:
[{ name: "Lydia" }]
答案
答案:D
首先我們聲明了一個(gè)擁有name屬性的對(duì)象 person。

然后我們又聲明了一個(gè)變量members. 將首個(gè)元素賦值為變量person。當(dāng)設(shè)置兩個(gè)對(duì)象彼此相等時(shí),它們會(huì)通過(guò) 引用 進(jìn)行交互。但是當(dāng)你將引用從一個(gè)變量分配至另一個(gè)變量時(shí),其實(shí)只是執(zhí)行了一個(gè) 復(fù)制 操作。(注意一點(diǎn),他們的引用 并不相同!)

接下來(lái)我們讓person等于null。

我們沒(méi)有修改數(shù)組第一個(gè)元素的值,而只是修改了變量person的值,因?yàn)樵兀◤?fù)制而來(lái))的引用與person不同。members的第一個(gè)元素仍然保持著對(duì)原始對(duì)象的引用。當(dāng)我們輸出members數(shù)組時(shí),第一個(gè)元素會(huì)將引用的對(duì)象打印出來(lái)。
47. 輸出是什么?
const person = {
name: "Lydia",
age: 21
};
for (const item in person) {
console.log(item);
}- A:
{ name: "Lydia" }, { age: 21 } - B:
"name", "age" - C:
"Lydia", 21 - D:
["name", "Lydia"], ["age", 21]
答案
答案:B
在for-in循環(huán)中,我們可以通過(guò)對(duì)象的 key 來(lái)進(jìn)行迭代,也就是這里的name和age。在底層,對(duì)象的 key 都是字符串(如果他們不是 Symbol 的話(huà))。在每次循環(huán)中,我們將item設(shè)定為當(dāng)前遍歷到的 key.所以一開(kāi)始,item是name,之后 item輸出的則是age。
48. 輸出是什么?
console.log(3 + 4 + "5");
- A:
"345" - B:
"75" - C:
12 - D:
"12"
答案
答案:B
當(dāng)所有運(yùn)算符的 優(yōu)先級(jí) 相同時(shí),計(jì)算表達(dá)式需要確定運(yùn)算符的結(jié)合順序,即從右到左還是從左往右。在這個(gè)例子中,我們只有一類(lèi)運(yùn)算符+,對(duì)于加法來(lái)說(shuō),結(jié)合順序就是從左到右。
3 + 4首先計(jì)算,得到數(shù)字7.
由于類(lèi)型的強(qiáng)制轉(zhuǎn)換,7 + '5'的結(jié)果是"75". JavaScript 將7轉(zhuǎn)換成了字符串,可以參考問(wèn)題 15.我們可以用+號(hào)把兩個(gè)字符串連接起來(lái)。"7" + "5" 就得到了"75".
49. num的值是什么?
const num = parseInt("7*6", 10);- A:
42 - B:
"42" - C:
7 - D:
NaN
答案
答案:C
只返回了字符串中第一個(gè)字母。設(shè)定了 進(jìn)制 后 (也就是第二個(gè)參數(shù),指定需要解析的數(shù)字是什么進(jìn)制:十進(jìn)制、十六機(jī)制、八進(jìn)制、二進(jìn)制等等……),parseInt 檢查字符串中的字符是否合法。一旦遇到一個(gè)在指定進(jìn)制中不合法的字符后,立即停止解析并且忽略后面所有的字符。
*就是不合法的數(shù)字字符。所以只解析到"7",并將其解析為十進(jìn)制的7. num的值即為7.
50. 輸出是什么?
[1, 2, 3].map(num => {
if (typeof num === "number") return;
return num * 2;
});- A:
[] - B:
[null, null, null] - C:
[undefined, undefined, undefined] - D:
[ 3 x empty ]
答案
答案:C
對(duì)數(shù)組進(jìn)行映射的時(shí)候,num就是當(dāng)前循環(huán)到的元素。在這個(gè)例子中,所有的映射都是 number 類(lèi)型,所以 if 中的判斷typeof num === "number"結(jié)果都是true.map 函數(shù)創(chuàng)建了新數(shù)組并且將函數(shù)的返回值插入數(shù)組。
但是,沒(méi)有任何值返回。當(dāng)函數(shù)沒(méi)有返回任何值時(shí),即默認(rèn)返回undefined.對(duì)數(shù)組中的每一個(gè)元素來(lái)說(shuō),函數(shù)塊都得到了這個(gè)返回值,所以結(jié)果中每一個(gè)元素都是undefined.
51. 輸出的是什么?
function getInfo(member, year) {
member.name = "Lydia";
year = "1998";
}
const person = { name: "Sarah" };
const birthYear = "1997";
getInfo(person, birthYear);
console.log(person, birthYear);- A:
{ name: "Lydia" }, "1997" - B:
{ name: "Sarah" }, "1998" - C:
{ name: "Lydia" }, "1998" - D:
{ name: "Sarah" }, "1997"
答案
答案:A
普通參數(shù)都是 值 傳遞的,而對(duì)象則不同,是 引用 傳遞。所以說(shuō),birthYear是值傳遞,因?yàn)樗莻€(gè)字符串而不是對(duì)象。當(dāng)我們對(duì)參數(shù)進(jìn)行值傳遞時(shí),會(huì)創(chuàng)建一份該值的 復(fù)制。(可以參考問(wèn)題 46)
變量birthYear有一個(gè)對(duì)"1997"的引用,而傳入的參數(shù)也有一個(gè)對(duì)"1997"的引用,但二者的引用并不相同。當(dāng)我們通過(guò)給 year賦值"1998"來(lái)更新year的值的時(shí)候我們只是更新了year(的引用)。此時(shí)birthYear仍然是"1997".
而person是個(gè)對(duì)象。參數(shù)member引用與之 相同的 對(duì)象。當(dāng)我們修改member所引用對(duì)象的屬性時(shí),person的相應(yīng)屬性也被修改了,因?yàn)樗麄円昧讼嗤膶?duì)象。person的 name屬性也變成了 "Lydia".
52. 輸出是什么?
function greeting() {
throw "Hello world!";
}
function sayHi() {
try {
const data = greeting();
console.log("It worked!", data);
} catch (e) {
console.log("Oh no an error:", e);
}
}
sayHi();- A:
"It worked! Hello world!" - B:
"Oh no an error: undefined - C:
SyntaxError: can only throw Error objects - D:
"Oh no an error: Hello world!
答案
答案:D
通過(guò)throw語(yǔ)句,我么可以創(chuàng)建自定義錯(cuò)誤。而通過(guò)它,我們可以?huà)伋霎惓?。異常可以是一個(gè)字符串,一個(gè) 數(shù)字,一個(gè) 布爾類(lèi)型 或者是一個(gè) 對(duì)象。在本例中,我們的異常是字符串'Hello world'.
通過(guò) catch語(yǔ)句,我們可以設(shè)定當(dāng)try語(yǔ)句塊中拋出異常后應(yīng)該做什么處理。在本例中拋出的異常是字符串'Hello world'. e就是這個(gè)字符串,因此被輸出。最終結(jié)果就是'Oh an error: Hello world'.
53. 輸出是什么?
function Car() {
this.make = "Lamborghini";
return { make: "Maserati" };
}
const myCar = new Car();
console.log(myCar.make);- A:
"Lamborghini" - B:
"Maserati" - C:
ReferenceError - D:
TypeError
答案
答案:B
返回屬性的時(shí)候,屬性的值等于 返回的 值,而不是構(gòu)造函數(shù)中設(shè)定的值。我們返回了字符串 "Maserati",所以 myCar.make等于"Maserati".
54. 輸出是什么?
(() => {
let x = (y = 10);
})();
console.log(typeof x);
console.log(typeof y);- A:
"undefined", "number" - B:
"number", "number" - C:
"object", "number" - D:
"number", "undefined"
答案
答案:A
let x = y = 10; 是下面這個(gè)表達(dá)式的縮寫(xiě):
y = 10; let x = y;
我們?cè)O(shè)定y等于10時(shí),我們實(shí)際上增加了一個(gè)屬性y給全局對(duì)象 (瀏覽器里的window, Nodejs 里的global)。在瀏覽器中,window.y等于10.
然后我們聲明了變量x等于y,也是10.但變量是使用 let聲明的,它只作用于 塊級(jí)作用域,僅在聲明它的塊中有效;就是案例中的立即調(diào)用表達(dá)式 (IIFE)。使用typeof操作符時(shí),操作值 x沒(méi)有被定義:因?yàn)槲覀冊(cè)?code>x聲明塊的外部,無(wú)法調(diào)用它。這就意味著x未定義。未分配或是未聲明的變量類(lèi)型為"undefined". console.log(typeof x)返回"undefined".
而我們創(chuàng)建了全局變量y,并且設(shè)定y等于10.這個(gè)值在我們的代碼各處都訪(fǎng)問(wèn)的到。y已經(jīng)被定義了,而且有一個(gè)"number"類(lèi)型的值。console.log(typeof y)返回"number".
55. 輸出是什么?
class Dog {
constructor(name) {
this.name = name;
}
}
Dog.prototype.bark = function() {
console.log(`Woof I am ${this.name}`);
};
const pet = new Dog("Mara");
pet.bark();
delete Dog.prototype.bark;
pet.bark();- A:
"Woof I am Mara",TypeError - B:
"Woof I am Mara","Woof I am Mara" - C:
"Woof I am Mara",undefined - D:
TypeError,TypeError
答案
答案:A
我們可以用delete關(guān)鍵字刪除對(duì)象的屬性,對(duì)原型也是適用的。刪除了原型的屬性后,該屬性在原型鏈上就不可用了。在本例中,函數(shù)bark在執(zhí)行了delete Dog.prototype.bark后不可用,然而后面的代碼還在調(diào)用它。
當(dāng)我們嘗試調(diào)用一個(gè)不存在的函數(shù)時(shí)TypeError異常會(huì)被拋出。在本例中就是 TypeError: pet.bark is not a function,因?yàn)?code>pet.bark是undefined.
56. 輸出是什么?
const set = new Set([1, 1, 2, 3, 4]); console.log(set);
- A:
[1, 1, 2, 3, 4] - B:
[1, 2, 3, 4] - C:
{1, 1, 2, 3, 4} - D:
{1, 2, 3, 4}
答案
答案:D
Set對(duì)象是獨(dú)一無(wú)二的值的集合:也就是說(shuō)同一個(gè)值在其中僅出現(xiàn)一次。
我們傳入了數(shù)組[1, 1, 2, 3, 4],他有一個(gè)重復(fù)值1.以為一個(gè)集合里不能有兩個(gè)重復(fù)的值,其中一個(gè)就被移除了。所以結(jié)果是 {1, 2, 3, 4}.
57. 輸出是什么?
// counter.js let counter = 10; export default counter;
// index.js import myCounter from "./counter"; myCounter += 1; console.log(myCounter);
- A:
10 - B:
11 - C:
Error - D:
NaN
答案
答案:C
引入的模塊是 只讀 的:你不能修改引入的模塊。只有導(dǎo)出他們的模塊才能修改其值。
當(dāng)我們給myCounter增加一個(gè)值的時(shí)候會(huì)拋出一個(gè)異常:myCounter是只讀的,不能被修改。
58. 輸出是什么?
const name = "Lydia"; age = 21; console.log(delete name); console.log(delete age);
- A:
false,true - B:
"Lydia",21 - C:
true,true - D:
undefined,undefined
答案
答案:A
delete操作符返回一個(gè)布爾值:true指刪除成功,否則返回false. 但是通過(guò) var, const 或 let 關(guān)鍵字聲明的變量無(wú)法用 delete 操作符來(lái)刪除。
name變量由const關(guān)鍵字聲明,所以刪除不成功:返回 false. 而我們?cè)O(shè)定age等于21時(shí),我們實(shí)際上添加了一個(gè)名為age的屬性給全局對(duì)象。對(duì)象中的屬性是可以刪除的,全局對(duì)象也是如此,所以delete age返回true.
59. 輸出是什么?
const numbers = [1, 2, 3, 4, 5]; const [y] = numbers; console.log(y);
- A:
[[1, 2, 3, 4, 5]] - B:
[1, 2, 3, 4, 5] - C:
1 - D:
[1]
答案
答案:C
我們可以通過(guò)解構(gòu)賦值來(lái)解析來(lái)自對(duì)象的數(shù)組或?qū)傩缘闹?,比如說(shuō):
[a, b] = [1, 2];

a的值現(xiàn)在是1,b的值現(xiàn)在是2.而在題目中,我們是這么做的:
[y] = [1, 2, 3, 4, 5];

也就是說(shuō),y等于數(shù)組的第一個(gè)值就是數(shù)字1.我們輸出y,返回1.
60. 輸出是什么?
const user = { name: "Lydia", age: 21 };
const admin = { admin: true, ...user };
console.log(admin);- A:
{ admin: true, user: { name: "Lydia", age: 21 } } - B:
{ admin: true, name: "Lydia", age: 21 } - C:
{ admin: true, user: ["Lydia", 21] } - D:
{ admin: true }
答案
答案:B
擴(kuò)展運(yùn)算符...為對(duì)象的組合提供了可能。你可以復(fù)制對(duì)象中的鍵值對(duì),然后把它們加到另一個(gè)對(duì)象里去。在本例中,我們復(fù)制了user對(duì)象鍵值對(duì),然后把它們加入到admin對(duì)象中。admin對(duì)象就擁有了這些鍵值對(duì),所以結(jié)果為{ admin: true, name: "Lydia", age: 21 }.
61. 輸出是什么?
const person = { name: "Lydia" };
Object.defineProperty(person, "age", { value: 21 });
console.log(person);
console.log(Object.keys(person));- A:
{ name: "Lydia", age: 21 },["name", "age"] - B:
{ name: "Lydia", age: 21 },["name"] - C:
{ name: "Lydia"},["name", "age"] - D:
{ name: "Lydia"},["age"]
答案
答案:B
通過(guò)defineProperty方法,我們可以給對(duì)象添加一個(gè)新屬性,或者修改已經(jīng)存在的屬性。而我們使用defineProperty方法給對(duì)象添加了一個(gè)屬性之后,屬性默認(rèn)為 不可枚舉 (not enumerable). Object.keys方法僅返回對(duì)象中 可枚舉 (enumerable) 的屬性,因此只剩下了"name".
用defineProperty方法添加的屬性默認(rèn)不可變。你可以通過(guò)writable, configurable 和 enumerable屬性來(lái)改變這一行為。這樣,defineProperty方法可以讓您更好地控制要添加到對(duì)象的屬性。
62. 輸出是什么?
const settings = {
username: "lydiahallie",
level: 19,
health: 90
};
const data = JSON.stringify(settings, ["level", "health"]);
console.log(data);- A:
"{"level":19, "health":90}" - B:
"{"username": "lydiahallie"}" - C:
"["level", "health"]" - D:
"{"username": "lydiahallie", "level":19, "health":90}"
答案
答案:A
JSON.stringify的第二個(gè)參數(shù)是 替代者 (replacer). 替代者 (replacer) 可以是個(gè)函數(shù)或數(shù)組,用以控制哪些值如何被轉(zhuǎn)換為字符串。
如果替代者 (replacer) 是個(gè) 數(shù)組,那么就只有包含在數(shù)組中的屬性將會(huì)被轉(zhuǎn)化為字符串。在本例中,只有名為"level" 和 "health" 的屬性被包括進(jìn)來(lái),"username"則被排除在外。data 就等于 "{"level":19, "health":90}".
而如果替代者 (replacer) 是個(gè) 函數(shù),這個(gè)函數(shù)將被對(duì)象的每個(gè)屬性都調(diào)用一遍。 函數(shù)返回的值會(huì)成為這個(gè)屬性的值,最終體現(xiàn)在轉(zhuǎn)化后的 JSON 字符串中(譯者注:Chrome 下,經(jīng)過(guò)實(shí)驗(yàn),如果所有屬性均返回同一個(gè)值的時(shí)候有異常,會(huì)直接將返回值作為結(jié)果輸出而不會(huì)輸出 JSON 字符串),而如果返回值為undefined,則該屬性會(huì)被排除在外。
63. 輸出是什么?
let num = 10; const increaseNumber = () => num++; const increasePassedNumber = number => number++; const num1 = increaseNumber(); const num2 = increasePassedNumber(num1); console.log(num1); console.log(num2);
- A:
10,10 - B:
10,11 - C:
11,11 - D:
11,12
答案
答案:A
一元操作符 ++ 先返回 操作值,再累加 操作值。num1的值是10,因?yàn)?code>increaseNumber函數(shù)首先返回num的值,也就是10,隨后再進(jìn)行 num的累加。
num2是10因?yàn)槲覀儗?num1傳入increasePassedNumber. number等于10(num1的值。同樣道理,++ 先返回 操作值,再累加 操作值。)number是10,所以num2也是10.
64. 輸出什么?
const value = { number: 10 };
const multiply = (x = { ...value }) => {
console.log(x.number *= 2);
};
multiply();
multiply();
multiply(value);
multiply(value);- A:
20,40,80,160 - B:
20,40,20,40 - C:
20,20,20,40 - D:
NaN,NaN,20,40
答案
答案:C
在 ES6 中,我們可以使用默認(rèn)值初始化參數(shù)。如果沒(méi)有給函數(shù)傳參,或者傳的參值為 "undefined",那么參數(shù)的值將是默認(rèn)值。上述例子中,我們將 value 對(duì)象進(jìn)行了解構(gòu)并傳到一個(gè)新對(duì)象中,因此 x 的默認(rèn)值為 {number:10}。
默認(rèn)參數(shù)在調(diào)用時(shí)才會(huì)進(jìn)行計(jì)算,每次調(diào)用函數(shù)時(shí),都會(huì)創(chuàng)建一個(gè)新的對(duì)象。我們前兩次調(diào)用 multiply 函數(shù)且不傳遞值,那么每一次 x 的默認(rèn)值都為 {number:10},因此打印出該數(shù)字的乘積值為20。
第三次調(diào)用 multiply 時(shí),我們傳遞了一個(gè)參數(shù),即對(duì)象value。*=運(yùn)算符實(shí)際上是x.number = x.number * 2的簡(jiǎn)寫(xiě),我們修改了x.number的值,并打印出值20。
第四次,我們?cè)俅蝹鬟fvalue對(duì)象。x.number之前被修改為20,所以x.number * = 2打印為40。
相關(guān)文章
JS判斷鼠標(biāo)從什么方向進(jìn)入一個(gè)容器實(shí)例說(shuō)明
偶然將想到的一個(gè)如何判斷鼠標(biāo)從哪個(gè)方向進(jìn)入一個(gè)容器的問(wèn)題,并且做了一系列的設(shè)想,代碼部分不是很多,我直接寫(xiě)了個(gè)示例, 感興趣的朋友可以了解下,或許本文對(duì)你有所幫助2013-02-02
JS實(shí)現(xiàn)移動(dòng)端觸屏拖拽功能
這篇文章主要介紹了JS實(shí)現(xiàn)移動(dòng)端觸屏拖拽功能,代碼簡(jiǎn)單易懂,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-07-07
Kibo 用于處理鍵盤(pán)事件的Javascript工具庫(kù)
Kibo是一個(gè)簡(jiǎn)單的用于處理鍵盤(pán)事件的Javascript工具庫(kù)。2011-10-10
js中class的點(diǎn)擊事件沒(méi)有效果的解決方法
下面小編就為大家?guī)?lái)一篇js中class的點(diǎn)擊事件沒(méi)有效果的解決方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10
JavaScript設(shè)計(jì)模型Iterator實(shí)例解析
這篇文章主要介紹了JavaScript設(shè)計(jì)模型Iterator實(shí)例解析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-01-01
使用JSX實(shí)現(xiàn)Carousel輪播組件的方法(前端組件化)
做這個(gè)輪播圖的組件,我們先從一個(gè)最簡(jiǎn)單的 DOM 操作入手。使用 DOM 操作把整個(gè)輪播圖的功能先實(shí)現(xiàn)出來(lái),然后在一步一步去考慮怎么把它設(shè)計(jì)成一個(gè)組件系統(tǒng)2021-04-04

