How can i use .reduce() to take a multi-layered array and return a single layer array from scratch

I am working on a problem from extra practice; being giving a multilayered array for instance:
const grades = [
[1, 2, 3],
[4, 5, 6],
[7, 8, 9]
];
how can i convert the above multilayered array to a single array of all values using reduce method. my approach to this problem is:

const reduced = grades.reduce(x=>{
  for(let i;i<x.length;i++){
    let y = x[i];
    for(let j=0;j<y.length;j++){
      return y[j];
    }
  }
}, [])

I keep getting

/home/ccuser/workspace/javascript-iterators-iterators-review/main.js:40
  for(let i;i<x.length;i++){
               ^

TypeError: Cannot read property 'length' of undefined
    at grades.reduce.x (/home/ccuser/workspace/javascript-iterators-iterators-review/main.js:40:16)
    at Array.reduce (native)
    at Object.<anonymous> (/home/ccuser/workspace/javascript-iterators-iterators-review/main.js:39:24)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.runMain (module.js:605:10)
    at run (bootstrap_node.js:427:7)

I don’t know what i am doing wrong. i have seen similar problem solved without reduce. i want a solution that involves the method .reduce().

Before you write any code you might want to consider what the function you are giving to reduce should at all do.

What input should that function accept?
What output should it produce?

a reduce method accept two argument: the accumulator and currentvalue.
the accumulator in this case is a callback function and my current value is an empty array.

the output of a reduce method is based on the return value of the callback function

No you’re mixing up the parameters of reduce itself and the callback function.

If you’ve been doing things with reduce before, then you could review that.

You can also read here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce
There’s a description there of what the callback does.

You can also implement reduce itself yourself. Reduce is a function that might seem difficult/magical when in reality it’s a very simple loop, and implementing it can really help you understand it.

obviously i am a newbie; i would check out the link.

The callback combines two things, but yours only accepts a single argument so it’s ignoring half of the essential input.

So what is the callback supposed to do with those two things?

This is what reduce does:

for (let x of xs) {
  acc = f(acc, x)
}

…that’s the whole thing. It’s a loop.

i was hoping to merge all the individual element into one single array

Well yeah, that’s the overall result, but given that reduce does this:

what does f therefore need to do? if you’re using reduce, then part of the problem is already solved, what remains to be solved, what does f still need to do?

thanks for the feedback, i would try and read up more documentation to understand reduce method better.