題目描述
對嵌套的數(shù)組進行
扁平化處理。你必須考慮到不同層級的嵌套。如果你被卡住了，? 記得開大招
Read-Search-Ask。嘗試與他人結伴編程、編寫你自己的代碼。
提供的資源:
往下繼續(xù)之前, 希望你花兩分鐘看看這個Fcc 須知
題目解析
理解題意
何為扁平化處理.
- 如
steamroller([[["a"]], [["b"]]])應該返回["a", "b"]就是把數(shù)組中空的值, 嵌套的值等等最終返回一個只有一層的數(shù)組. 既完成了Fcc的挑戰(zhàn).
前期思考
-
數(shù)組遍歷, 需要使用什么方法. 不止一個哦. 除了for循環(huán)- 檢查這個元素, 做判斷嘛.
-
數(shù)組判斷,- 是數(shù)組, 要繼續(xù)扁平化, 可以跳到
思考 1需要用到遞歸或者另一種多維度數(shù)組的處理方法. - 不是數(shù)組, 添加到結果數(shù)組中. *這里的結果數(shù)組需要在函數(shù)內定義還是全局定義呢? 見下面同學示例.
- 是數(shù)組, 要繼續(xù)扁平化, 可以跳到
-
編寫代碼, 想好了, 那就實踐吧, 即使出現(xiàn)了bug.- ?
代碼示范
一個同學的代碼示例
let newArr = []; //定義全局結果數(shù)組
function steamroller(arr){
for(let i=0; i<arr.length; i++){ // 循環(huán)遍歷`當前傳入數(shù)組`元素 注意是當前傳入數(shù)組襖
if(Array.isArray(arr[i])) // 如果是元素是數(shù)組而不是值, 那就條件為真
steamroller(arr[i]); // 這里用了遞歸的方法 循環(huán)調用
else
newArr.push(arr[i]); //不是數(shù)組, 就push到結果數(shù)組里
}
return newArr;
}
steamroller([1, [2], [3, [[[4]]]]]);
返回結果是
[1,2,3,4]
但并沒有通過這道題. 為什么呢?
在題中調用兩次steamroller后,
steamroller([1, [2], [3, [[[4]]]]]);
steamroller([[["a"]], [["b"]]]);
結果卻不是我們想要的 ["a", "b"] 而是[1,2,3,4,"a", "b"] 為什么會把上一次調用的結果也push到了 結果數(shù)組中了?
代碼分析
原因就是, 在上面那個同學的代碼中, 他的結果數(shù)組: newArr是在全局定義的! 這也就導致, 他的結果數(shù)組保存著所有的調用steamroller函數(shù)的值. 所以這樣當然不會通過測試啦~
那機智如你會想到把結果數(shù)組定義到函數(shù)內, 但是當我們要扁平化的是多維數(shù)組時, 它就出現(xiàn)了只有第一個元素的尷尬現(xiàn)象.
What the hall???
so, 這個時候, 你可以了解 javascript的閉包函數(shù)了, 同學們點擊左側鏈接, 跳轉, 查看什么是閉包及其原理和應用.
一定去看襖.
以及, 這一題我也用了閉包, 在看完阮一峰老師的閉包講解后, 可以先嘗試著修改代碼. 也可以查看我的, 分析示例. 我有寫注釋. 據(jù)說代碼寫注釋是一個好習慣, 請問這個據(jù)說對不對 >.< ~~~
我的代碼示例
function steamroller(arr) {
// I'm a steamroller, baby
var result = []; //定義結果數(shù)組
function steam(ifArr) { // 定義內部函數(shù).
if(Array.isArray(ifArr)){
return ifArr.forEach(function(val){ //我這里用了forEach 循環(huán)數(shù)組, 想知道它的詳情, 下面有鏈接.
return steam(val); // 遞歸調用 steam函數(shù).
});
}
else
result.push(ifArr);
}
steam(arr); //調用函數(shù),
return result; // 返回結果數(shù)組
}
steamroller([1, [2], [3, [[[4]]]]]);
steamroller([[["a"]], [["b"]]]);
這樣, 就算我在代碼中調用了兩次steamroller函數(shù). 還是只有最后一次調用的結果.
這就是閉包的魅力
資源匯總
題目提供的判斷是否為數(shù)組的 Array.isArray()
代碼中涉及到的 遞歸 遞歸 PS: 這里還對遞歸的缺點進行了講解, 優(yōu)化.
代碼中涉及到的 閉包 閉包函數(shù) o_o
原題中文版鏈接 https://www.freecodecamp.cn/challenges/steamroller
原題英文版鏈接 https://www.freecodecamp.com/challenges/steamroller
最后
