每日20道面試題帶解析03
來源 | https://www.cnblogs.com/echoyya/p/14569829.html
以下題目,本人驗證無誤,查閱了相關(guān)資料,得出解析部分并做了相關(guān)總結(jié),希望對正準(zhǔn)備跳槽或找工作的你有幫助!
1、 事件傳播的三個階段是什么?
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)才開始。
2、 寫出執(zhí)行結(jié)果,并解釋原因
+true;!"Lydia";
A: 1 and false
B: false and NaN
C: false and false
答案及解析
答案 : A解析 : 一元操作符加號嘗試將 boolean 轉(zhuǎn)為 number。true 轉(zhuǎn)換為 number 為 1,false 為 0。字符串 'Lydia' 是一個真值,真值取反那么就返回 false。
3、寫出執(zhí)行結(jié)果,并解釋原因
const bird = {size: 'small'}const mouse = {name: 'Mickey',small: true}
A: mouse.bird.size是無效的
B: mouse[bird.size]是無效的
C: mouse[bird["size"]]是無效的
D: 以上三個選項都是有效的
答案 : A解析 :1. 所有對象的 keys 都是字符串(在底層總會被轉(zhuǎn)換為字符串)2. 使用括號語法時[],首先看到第一個開始括號 [ 并繼續(xù)前進(jìn)直到找到結(jié)束括號 ]。3. mouse[bird.size]:首先計算 bird.size,得到 small, mouse["small"] 返回 true。//使用點語法4. mouse 沒有 bird 屬性,返回 undefined,也就變成了 undefined.size。是無效的,并且會拋出一個錯誤類似 Cannot read property "size" of undefined。
4、 當(dāng)我們這么做時,會發(fā)生什么?
function bark() {console.log('Woof!')}bark.animal = 'dog'
A: 正常運行!
B: SyntaxError. 你不能通過這種方式給函數(shù)增加屬性。
C: undefined
D: ReferenceError
答案及解析
答案 : A解析 : 在JS中是可以的,因為函數(shù)是一個特殊的對象(除了基本類型之外其他都是對象)函數(shù)是一個擁有屬性的對象,并且屬性也可被調(diào)用。bark.animal = function(){ console.log(1)}bark.animal () // 1
5、 寫出執(zhí)行結(jié)果,并解釋原因
class Chameleon {static colorChange(newColor) {this.newColor = newColorreturn 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 是一個靜態(tài)方法。靜態(tài)方法只能被創(chuàng)建它們的構(gòu)造器使用(也就是 Chameleon),并且不能傳遞給實例。因為 freddie 是一個實例,靜態(tài)方法不能被實例使用,因此拋出了 TypeError 錯誤。
6、寫出執(zhí)行結(jié)果,并解釋原因
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: undefined undefined
答案及解析
答案 : A解析 : 不能像常規(guī)對象那樣,給構(gòu)造函數(shù)添加屬性。應(yīng)該使用原型。Person.prototype.getFullName = function () {return `${this.firstName} ${this.lastName}`;}這樣 member.getFullName() 才起作用。將公共屬性和方法添加到原型中,它只存在于內(nèi)存中的一個位置,所有實例都可以訪問它,節(jié)省內(nèi)存空間
7、 寫出執(zhí)行結(jié)果,并解釋原因
function Person(firstName, lastName) {this.firstName = firstNamethis.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"} and undefined
B: Person {firstName: "Lydia", lastName: "Hallie"} and Person {firstName: "Sarah", lastName: "Smith"}
C: Person {firstName: "Lydia", lastName: "Hallie"} and {}
D:Person {firstName: "Lydia", lastName: "Hallie"} and ReferenceError
答案及解析
答案 : A解析 : sarah沒有使用 new 關(guān)鍵字。當(dāng)使用 new 時,this 指向我們創(chuàng)建的空對象。未使用 new 時,this 指向的是全局對象。上述操作相當(dāng)于 window.firstName = 'Sarah' 和 window.lastName = 'Smith'。而 sarah 本身是 undefined。
8、寫出執(zhí)行結(jié)果,并解釋原因
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解析 : 如果一個對象有兩個同名的鍵,則鍵會被替換掉。但仍位于該鍵第一次出現(xiàn)的位置,但是值是最后出現(xiàn)那個值。
9、 寫出執(zhí)行結(jié)果,并解釋原因
const a = {}const b = { key: 'b' }const c = { key: 'c' }a[b] = 123a[c] = 456console.log(a[b])
A: 123
B: 456
C: undefined
D: ReferenceError
答案及解析
答案 : B解析 : 對象的鍵被自動轉(zhuǎn)換為字符串。1. 將對象 b 設(shè)置為對象 a 的鍵,會變成 "[object Object]",相當(dāng)于a["[object Object]"] = 123。2. 再次將對象 c 設(shè)置為對象 a 的鍵,相當(dāng)于 a["[object Object]"] = 456。3. 此時打印 a[b],也就是 a["[object Object]"]。剛設(shè)置為 456,因此返回 456。
10、寫出執(zhí)行結(jié)果,并解釋原因
function sayHi() {return (() => 0)()}typeof sayHi()
A: "object"
B: "number"
C: "function"
D: "undefined"
答案及解析
答案 : B解析 : sayHi 方法返回的是立即執(zhí)行函數(shù)(IIFE)的返回值.此立即執(zhí)行函數(shù)的返回值是 0, 類型是 number
11、寫出執(zhí)行結(jié)果,并解釋原因
[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解析 : num表示當(dāng)前元素. 都是number類型,因此typeof num === "number"結(jié)果都是true.map函數(shù)創(chuàng)建了新數(shù)組,并且將函數(shù)的返回值插入數(shù)組。但并沒有任何值返回。當(dāng)函數(shù)沒有返回任何值時,即默認(rèn)返回undefined.對數(shù)組中的每一個元素來說,函數(shù)塊都得到了這個返回值,所以結(jié)果中每一個元素都是undefined.擴展:1. [1, 2, 3].map(num => typeof num === "number" ); // [true, true, true]2. [1, 2, 3].map(num => typeof (num === "number")); // ["boolean", "boolean", "boolean"]
12、 輸出什么?
function getFine(speed, amount) {const formattedSpeed = new Intl.NumberFormat({'en-US',{ style: 'unit', unit: 'mile-per-hour' }}).format(speed)const formattedAmount = new Intl.NumberFormat({'en-US',{ style: 'currency', currency: 'USD' }}).format(amount)return `The driver drove ${formattedSpeed} and has to pay ${formattedAmount}`}console.log(getFine(130, 300))
A: The driver drove 130 and has to pay 300
B: The driver drove 130 mph and has to pay $300.00
C: The driver drove undefined and has to pay undefined
D: The driver drove 130.00 and has to pay 300.00
答案及解析
答案 : B解析 : Intl.NumberFormat 方法,可以格式化任意區(qū)域的數(shù)字值。mile-per-hour 通過格式化結(jié)果為 mph; USD通過格式化結(jié)果為 $.
13、寫出執(zhí)行結(jié)果,并解釋原因
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)鍵字刪除對象的屬性,對原型也適用。刪除原型的屬性后,該屬性在原型鏈上就不可用。執(zhí)行 delete Dog.prototype.bark 后不可用,嘗試調(diào)用一個不存在的函數(shù)時會拋出異常。TypeError: pet.bark is not a function,因為pet.bark是undefined.
14、寫出執(zhí)行結(jié)果,并解釋原因
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對象是唯一值的集合:也就是說同一個值在其中僅出現(xiàn)一次。。所以結(jié)果是 {1, 2, 3, 4}.易錯 : B, 常見的set用法可用于數(shù)組去重,因此大家可能會誤以為返回的是唯一值的數(shù)組,其實不然,var set1 = [...new Set([1, 1, 2, 3, 4])];console.log(set1); // 此時返回的才是數(shù)組 [1, 2, 3, 4]
15、 寫出執(zhí)行結(jié)果,并解釋原因
const name = "Lydia Hallie"console.log(name.padStart(13))console.log(name.padStart(2))
A: "Lydia Hallie", "Lydia Hallie"
B: " Lydia Hallie", " Lydia Hallie" ("[13x whitespace]Lydia Hallie", "[2x whitespace]Lydia Hallie")
C: " Lydia Hallie", "Lydia Hallie" ("[1x whitespace]Lydia Hallie", "Lydia Hallie")
D: "Lydia Hallie", "Lyd"
答案及解析
答案 : C解析 : padStart方法可以在字符串的起始位置填充。參數(shù)是字符串的總長度(包含填充)。字符串Lydia Hallie的長度為12, 因此name.padStart(13)在字符串的開頭只會插入1個空格。如果傳遞給 padStart 方法的參數(shù)小于字符串的長度,則不會添加填充。
16、寫出執(zhí)行結(jié)果,并解釋原因
const { name: myName } = { name: "Lydia" };console.log(name);
A: "Lydia"
B: "myName"
C: undefined
D: ReferenceError
答案及解析
答案 : D解析 : 對象解構(gòu):{name:myName}該語法為獲取右側(cè)對象中name屬性值,并重命名為myName。而name是一個未定義的變量,直接打印會引發(fā)ReferenceError: name is not defined。
17、寫出執(zhí)行結(jié)果,并解釋原因
function checkAge(age) {if (age < 18) {const message = "Sorry, you're too young."} else {const message = "Yay! You're old enough!"}return message}console.log(checkAge(21))
A: "Sorry, you're too young."
B: "Yay! You're old enough!"
C: ReferenceError
D: undefined
答案及解析
答案 : C解析 : 本題考查const和let聲明的變量具有塊級作用域,無法在聲明的塊之外引用變量,拋出 ReferenceError。
18、 寫出執(zhí)行結(jié)果,并解釋原因
let name = 'Lydia'function getName() {console.log(name)let name = 'Sarah'}getName()
A: Lydia
B: Sarah
C: undefined
D: ReferenceError
答案 : D解析 : let和const聲明的變量,與var不同,它不會被初始化。在初始化之前無法訪問。稱為“暫時性死區(qū)”。JavaScript會拋出ReferenceError: Cannot access 'name' before initialization。
19、 寫出執(zhí)行結(jié)果,并解釋原因
console.log(`${(x => x)('I love')} to program`)A: I love to program
B: undefined to program
C: ${(x => x)('I love') to program
D: TypeError
答案 : A解析 : 帶有模板字面量的表達(dá)式首先被執(zhí)行。相當(dāng)于字符串包含表達(dá)式,(x => x)('I love')是一個立即執(zhí)行函數(shù)向箭頭函數(shù) x => x 傳遞 'I love' 作為參數(shù)。x 等價于返回的 'I love'。結(jié)果就是 I love to program。
20、 寫出執(zhí)行結(jié)果,并解釋原因
const spookyItems = ["??", "??", "??"];({ item: spookyItems[3] } = { item: "??" });console.log(spookyItems);
A: ["??", "??", "??"] B: ["??", "??", "??", "??"] C: ["??", "??", "??", { item: "??" }] D: ["??", "??", "??", "[object Object]"]
答案及解析
答案 : B解析 : 解構(gòu)對象,可以從右邊對象中拆出值,并將拆出的值分配給左邊對象同名的屬性。此時將值 "??" 分配給 spookyItems[3]。相當(dāng)于正在篡改數(shù)組 spookyItems,給它添加了值 "??"。當(dāng)輸出 spookyItems 時,結(jié)果為 ["??", "??", "??", "??"]。
學(xué)習(xí)更多技能
請點擊下方公眾號
![]()

