1. 程式人生 > 實用技巧 >JS陣列相關(二)

JS陣列相關(二)

陣列的扁平化

陣列扁平化就是將多維陣列變成一維陣列的過程。

這裡的討論我們分成兩種情況吧:一種是陣列元素是數字,另一種是陣列包含多種資料型別。

數字陣列

1、toString + split

  let arr = [1, 2, 3, [4, 5, [6]]];
  let str = arr.toString().split(',').map(item => parseInt(item));
  console.log(str); // [1, 2, 3, 4, 5, 6]

陣列執行toString()方法會為每個元素執行toString,使其轉化為字串。

2、join + split

  let arr = [1, 2, 3, [4, 5, [6]]];
  let str = arr.join(',').split(',').map(item => parseInt(item))
  console.log(str); // [1, 2, 3, 4, 5, 6]
通用方法

1、flat()方法(ES6方法)
flat()方法可以指定深度,預設深度為1,傳Infinity表示徹底扁平化。無視資料型別。

  let arr = [1, 2, 3, [4, {name: 'aa'}, [6]]];
  let str = arr.flat(Infinity);
  console.log(str); // [1, 2, 3, 4, {name: 'aa'}, 6]

2、借用正則方法
可以先借用JSON.stringify將陣列轉換為字串,然後通過正則匹配去掉‘[’和‘]’。

  let arr = [1, 2, 3, [4, {name: 'aa'}, [6]]];
  let str = JSON.stringify(arr);
  str = str.replace(/(\[|\])/g, '')
  str = `[${str}]`
  str = JSON.parse(str)
  console.log(str)

此處需要注意,正則匹配去掉'[',']'之後,即第三步,不可以直接用使用split()方法將字串轉成陣列,那樣做會導致陣列中的數字變成字元,改變了資料型別。

3、使用for迴圈遞迴
迴圈遞迴的思路就是,判斷陣列的每一項是不是陣列,如果不是陣列,就把該項加到新數組裡,如果是陣列就遞迴執行。

  function arrayFlat(arr) {
        let result = [];
        let f = function(arr){
              for(let i = 0; i < arr.length; i++) {
                    if(Array.isArray(arr[i])) {
                          f(arr[i]);
                    } else {
                          result.push(arr[i])
                    }
              }
        }
        f(arr)
        return result;
  }

4、藉助reduce方法

  function arrayFlat(arr) {
        let f = function(arr) {
              return arr.reduce((prev, cur) =>{
                    if(Array.isArray(cur)) {
                          return [...pre, f(cur)]
                    } else {
                          return [...pre, cur]
                   }
              }, [])
        }
        return f(arr)
  }