map, filter மற்றும் reduce என்ன செய்கின்றன?

Question

Accepted Answer

இவை **immutable** array iterators — அவை அசல் array-ஐ மாற்றாமல் ஒரு புதிய மதிப்பைத் திருப்பித் தருகின்றன, இது கையேடு `for` loops-ஐ விட சுத்தமான, மிகவும் declarative ஆன code-க்கு வழிவகுக்கிறது.

```js
const nums = [1, 2, 3, 4];

// map: transform each item → array of the SAME length
nums.map(n => n * 2);            // [2, 4, 6, 8]

// filter: keep items passing a test → SHORTER array
nums.filter(n => n % 2 === 0);  // [2, 4]

// reduce: fold the array into ONE value (accumulator + current)
nums.reduce((sum, n) => sum + n, 0); // 10
//          ^acc  ^item            ^initial value
```

## reduce எவ்வாறு செயல்படுகிறது (மக்கள் கடினமாக நினைப்பது)

Reduce ஒரு "accumulator"-ஐ எடுத்துச் சென்று array வழியே நடக்கிறது. ஒவ்வொரு படியும் புதிய accumulator-ஐத் திருப்பித் தருகிறது:

```js
// step 0: acc=0,  n=1 → 1
// step 1: acc=1,  n=2 → 3
// step 2: acc=3,  n=3 → 6
// step 3: acc=6,  n=4 → 10
```

இது வெறும் கூட்டல்களுக்கு மட்டுமல்ல — reduce objects-ஐ உருவாக்கலாம், items-ஐ குழுவாக்கலாம், அல்லது flatten செய்யலாம்:

```js
users.reduce((acc, u) => { acc[u.id] = u; return acc; }, {}); // index by id
```

## ஏன் இவற்றை விரும்ப வேண்டும்

இவை சுத்தமாக **chain** ஆகின்றன மற்றும் mutate செய்வதில்லை, இது state-driven UIs-இல் முக்கியமானது. side effects-க்கு மட்டுமே `forEach` பயன்படுத்தவும் (அது எதையும் திருப்பித் தருவதில்லை). பல passes-ஐ chain செய்ய வேண்டிய மிகப் பெரிய arrays-க்கு, ஒற்றை `reduce` அல்லது ஒரு எளிய loop மிகவும் திறமையாக இருக்கலாம்.