如何在JS中映射嵌套陣列

這是我的陣列：

const main = [
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369']],
];

這是我的功能：

const convertor = (x) => {
  const splitted = x.split(':');
  console.log(splitted);
  const converted = splitted[0] * 60   splitted[1] * 60   splitted[2];
  return converted;
};

我想在每個嵌套陣列上映射這個函式

我試過了，但出現錯誤：

const resu = main.map((x) => {
  x.map((y) => {
    convertor(y);
  });
});

x.split 不是函式

uj5u.com熱心網友回復：

你犯了一些錯誤：

1. 運算式(x) => { /* a few lines of code */ }需要使用return 關鍵字來回傳結果，(x) => /* single line of code */而不需要。

2. 您的陣列main是三維陣列，而不是二維陣列。

嘗試這個：

const resu = main.map((x) => {
  return x.map((y) => {
    return y.map(convertor);
  });
});

或者更簡單：

const resu = main.map(
    (x) => x.map(
        (y) => y.map(convertor)
    )
);

const main = [
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369']],
];

const convertor = (x) => {
  const splitted = x.split(':');
  const converted = splitted[0] * 60   splitted[1] * 60   splitted[2];
  return converted;
};

const resu = main.map(
    (x) => x.map(
        (y) => y.map(convertor)
    )
);

console.log(resu);

uj5u.com熱心網友回復：

問題

1. 請注意，有 3 個級別的嵌套陣列，因此應該有 3 個 maps()
2. return如果{}在箭頭函式中使用，則需要

const main = [
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369']],
];

const convertor = (x) => {
  const splitted = x.split(':');
  const converted = splitted[0] * 60   splitted[1] * 60   splitted[2];
  return converted;
};

const resu = main.map((x) => {
  return x.map((y) => {
    return y.map((z) => {
      return convertor(z);
    });
  });
});

console.log(resu);

較短的版本

main.map(x => x.map(y => y.map(convertor)));

uj5u.com熱心網友回復：

另一種方法可能是遞回遍歷陣列。這樣您就不受特定深度級別的限制。

const main = [
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369'], ['02:20:21,369'], ['02:20:21,369']],
  [['02:20:21,369']],
];

const convertor = (x) => {
  const splitted = x.split(':');
  // console.log(splitted);
  const converted = splitted[0] * 60   splitted[1] * 60   splitted[2];
  return converted;
};

const convertTimeToSec = (arr) => {
  for(let i = 0, length = arr.length; i < length; i  ) {
    if(Array.isArray(arr[i])) {
      arr[i] = convertTimeToSec(arr[i]);
    }else{
      arr[i] = convertor(arr[i]);
    }
  }
  
  return arr;
}

console.log(convertTimeToSec(main));

uj5u.com熱心網友回復：

const main = [
  [
    ['02:20:21,369'],
    ['02:20:21,369'],
    ['02:20:21,369'],
    ['02:20:21,369']
  ],
  [
    ['02:20:21,369'],
    ['02:20:21,369']
  ],
  [
    ['02:20:21,369'],
    ['02:20:21,369'],
    ['02:20:21,369']
  ],
  [
    ['02:20:21,369']
  ],
];


const convertor = (x) => {
  const splitted = x.split(':');
  //console.log(splitted);
  const converted = splitted[0] * 60   splitted[1] * 60   splitted[2];
  return converted;
};

const mappedMain = main.map(i => {
 return i.map(j => {
  return convertor(...j)
 })
})

//Or
//const mappedMain = main.map(i => i.map(j => convertor(...j)))



console.log(mappedMain);

標籤：javascript

上一篇：內置用于檢查原型鏈中是否定義了javascriptsetter？

下一篇：React-匯入的物件陣列不反轉