面試官:你能停止 JavaScript 中的 forEach 循環(huán)嗎?
面試官:你能停止 JavaScript 中的 forEach 循環(huán)嗎?
在回答這個問題時,我的回答導(dǎo)致面試官突然結(jié)束了面試。
我對結(jié)果感到沮喪,問面試官:“為什么?實際上可以停止 JavaScript 中的 forEach 循環(huán)嗎?”
在面試官回答之前,我花了一些時間解釋我對為什么我們不能直接停止 JavaScript 中的 forEach 循環(huán)的理解。
我的答案正確嗎?
小伙伴們,下面的代碼會輸出什么數(shù)字呢?
它會只輸出一個數(shù)字還是多個數(shù)字?
是的,它會輸出‘0’、‘1’、‘2’、‘3’。
const array = [ -3, -2, -1, 0, 1, 2, 3 ]
array.forEach((it) => {
if (it >= 0) {
console.log(it)
return // or break
}
})
這是正確的!我向面試官展示了這段代碼,但他仍然相信我們可以停止 JavaScript 中的 forEach 循環(huán)。
天哪,你一定是在開玩笑。
為什么?
為了說服他,我不得不再次實現(xiàn)forEach模擬。
Array.prototype.forEach2 = function (callback, thisCtx) {
if (typeof callback !== 'function') {
throw `${callback} is not a function`
}
const length = this.length
let i = 0
while (i < length) {
if (this.hasOwnProperty(i)) {
// Note here:Each callback function will be executed once
callback.call(thisCtx, this[ i ], i, this)
}
i++
}
}
是的,當(dāng)我們使用“forEach”迭代數(shù)組時,回調(diào)將為數(shù)組的每個元素執(zhí)行一次,并且我們無法過早地擺脫它。
例如,在下面的代碼中,即使“func1”遇到break語句,“2”仍然會輸出到控制臺。
const func1 = () => {
console.log(1)
return
}
const func2 = () => {
func1()
console.log(2)
}
func2()
停止 forEach 的 3 種方法
你太棒了,但我想告訴你,我們至少有 3 種方法可以在 JavaScript 中停止 forEach。
1.拋出錯誤
當(dāng)我們找到第一個大于或等于0的數(shù)字后,這段代碼將無法繼續(xù)。所以控制臺只會打印出0。
const array = [ -3, -2, -1, 0, 1, 2, 3 ]
try {
array.forEach((it) => {
if (it >= 0) {
console.log(it)
throw Error(`We've found the target element.`)
}
})
} catch (err) {
}
哦!我的天啊!我簡直不敢相信,這讓我無法說話。
2.設(shè)置數(shù)組長度為0
請不要那么驚訝,面試官對我說。
我們還可以通過將數(shù)組的長度設(shè)置為0來中斷forEach。如您所知,如果數(shù)組的長度為0,forEach將不會執(zhí)行任何回調(diào)。
const array = [ -3, -2, -1, 0, 1, 2, 3 ]
array.forEach((it) => {
if (it >= 0) {
console.log(it)
array.length = 0
}
})
我的心已經(jīng)亂了。
3.使用splice刪除數(shù)組的元素
思路和方法2一樣,如果能刪除目標(biāo)元素后面的所有值,那么forEach就會自動停止。
const array = [ -3, -2, -1, 0, 1, 2, 3 ]
array.forEach((it, i) => {
if (it >= 0) {
console.log(it)
// Notice the sinful line of code
array.splice(i + 1, array.length - i)
}
})
我睜大了眼睛,我不想讀這段代碼。這不好。
請用for或some
我對面試官說:“哦,也許你是對的,你設(shè)法在 JavaScript 中停止了 forEach,但我認(rèn)為你的老板會解雇你,因為這是一個非常糟糕的代碼片段。
我不喜歡做那樣的事;這會讓我的同事討厭我。”
也許我們應(yīng)該使用“for”或“some”方法來解決這個問題。
1.for
const array = [ -3, -2, -1, 0, 1, 2, 3 ]
for (let i = 0, len = array.length; i < len; i++) {
if (array[ i ] >= 0) {
console.log(array[ i ])
break
}
}
2. some
const array = [ -3, -2, -1, 0, 1, 2, 3 ]
array.some((it, i) => {
if (it >= 0) {
console.log(it)
return true
}
})
總結(jié)
雖然面試官以這個問題結(jié)束了面試,但我很慶幸自己沒有加入公司,不想為了某種目的而寫出一段臭代碼。 這樣的面試官也不是面試者所喜歡的,為了面試而面試的面試官和面試題,讓面試者覺得有點無辜與無奈。
不管怎么樣,還是努力提升自己的技能吧。
最后,感謝您的閱讀。