How can I map a nested array in JS

Question

Here is my array:

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']],
];

and here is my function:

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

I want to map this function on each nested array

I tried this but I got an error:

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

x.split is not a function

@KrzysztofKrzeszewski expected output should be timestamps converted to seconds. for example : 02:50:20,656 turns into : 312020,656 — moemous
– moemous, Commented Nov 29, 2021 at 12:28
The .map() callback has to return the new value. Your callbacks don't return anything. — Andreas
– Andreas, Commented Nov 29, 2021 at 12:29

Vladimir Rusov · Accepted Answer · 2021-11-29 12:40:04Z

1

You made some mistakes:

Expression (x) => { /* a few lines of code */ } requires the use of the return keyword to return the result, while (x) => /* single line of code */ doesn't.
Your array main is three-dimensional array, not two-dimensional.

Try this:

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

Or easier:

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

answered Nov 29, 2021 at 12:40

Vladimir Rusov

463 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Andreas Over a year ago

"while (x) => /* single line of code */ doesn't" - That's not a matter of single line or not. { } creates a block. And that's what triggers the need of an explicit return. This is also the reason why you have to wrap an object in ( ) without an explicit return: (foo) => ({ bar: foo })

User863 · Accepted Answer · 2021-11-29 12:36:49Z

1

Issues

Note that there are 3 level nested arrays, so there should be 3 maps()
return is required if you use {} in the arrow function

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

Shorter version

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

answered Nov 29, 2021 at 12:36

User863

20.1k3 gold badges20 silver badges45 bronze badges

Comments

StackByMe · Accepted Answer · 2021-11-29 12:41:52Z

Another approach could be to recursively go through the array(s). This way you are not limited to a specific depth level.

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

zakhefron · Accepted Answer · 2021-11-29 12:43:15Z

1

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

edited Nov 29, 2021 at 12:43

answered Nov 29, 2021 at 12:37

zakhefron

1,4431 gold badge9 silver badges14 bronze badges

Collectives™ on Stack Overflow

How can I map a nested array in JS

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related