如何在 JS 中映射嵌套数组答案

【问题标题】：How can I map a nested array in JS如何在 JS 中映射嵌套数组
【发布时间】：2021-11-29 12:23:39
【问题描述】：

这是我的数组：

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 不是函数

【问题讨论】：

预期输出是什么
这能回答你的问题吗？ Map an array of arrays
@KrzysztofKrzeszewski 预期的输出应该是转换为秒的时间戳。例如：02:50:20,656 变成：312020,656
@moemous 得到答案132021,369，请检查我的代码？
.map() 回调必须返回新值。您的回调不返回任何内容。

标签： javascript

【解决方案1】：

你犯了一些错误：

表达式(x) => { /* a few lines of code */ } 需要使用return 关键字来返回结果，而(x) => /* single line of code */ 不需要。
您的数组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);

【讨论】：

"while (x) => /* 单行代码 */ 没有" - 这不是单行与否的问题。 { } 创建一个块。这就是触发显式return 需求的原因。这也是为什么您必须在没有明确的return 的情况下将对象包装在( ) 中的原因： (foo) => ({ bar: foo })

【解决方案2】：

问题

注意有3级嵌套数组，所以应该有3个maps()
如果在箭头函数中使用{}，则需要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)));

【讨论】：

【解决方案3】：

另一种方法是递归遍历数组。这样您就不会局限于特定的深度级别。

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));

【讨论】：

【解决方案4】：

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);

【讨论】：