Array Flatten in JavaScript

Before dive into Array Flatten in JavaScript, first we need to understand one small problem.

Sometimes we don’t get data in a clean simple array. Instead we get array inside array, and again inside array. This is called nested array. Like if I say [1, [2, 3], [4, [5]]] then here values are not in one level, they are spread in multiple levels.

Now think you want to loop this array or apply some logic like sum or filtering. It becomes messy because you need to go inside each level manually. That’s why flattening comes into the picture.

Why flattening arrays is useful

Flattening means converting a nested array into a single level array. So above example will become [1, 2, 3, 4, 5].
Now everything is simple, you can loop, filter, map without worrying about levels. This is very common in real data where APIs return complex structures.

What is Array Flatten

Array flatten is a process where we take nested array and bring all values into one single array. No inner arrays, just plain values in one line.

Concept of flattening

Think like you have a box and inside that box more small boxes are there. Flattening means opening all boxes and putting all items on table in one place.

If we see it step by step
First take element
Check if it is array or not
If not then add into result
If yes then go inside and repeat same process

This keeps going until all values are extracted.

Different approaches to flatten arrays

JavaScript gives a direct method flat() which is easiest way. You can simply do arr.flat() and it will flatten one level. If you want full flatten then you can pass infinity.

Second way is using recursion. This is mostly used in interview. You create a function which checks if value is array, then call same function again. This shows your understanding of logic.

Third way is using reduce. It is little tricky but good for practice. You combine values and keep flattening while iterating.

Common interview scenario

Mostly interviewer will give nested array and ask to flatten without using inbuilt method. Here they want to check your thinking, not syntax. If you know recursion clearly then problem becomes easy.

Sometimes they also twist question like flatten only specific depth or remove only one level. So understanding concept is important, not just memorizing method.

One simple visual idea
Imagine [1, [2, [3, 4]]]
First level you open gives 1, 2, [3, 4]
Next level you open gives 1, 2, 3, 4
So step by step you are removing layers.

So now you understand what nested arrays are, why flattening is needed and how we can solve it. This is small topic but very important because it builds your problem solving thinking, especially in JavaScript interviews.

#javascript #webdevelopment #frontend #coding #learninpublic #jsconcepts #programming #developers #codinglife #interviewprep #problemSolving #100DaysOfCode #techlearning #codingjourney #arrays #chaicode