JavaScript Arrays - JavaScript Arrays क्या हैं?

JavaScript Arrays: पूरी गाइड हिंदी में

इस ट्यूटोरियल में हम JavaScript arrays के बारे में सब कुछ सीखेंगे - बेसिक्स से लेकर एडवांस्ड कॉन्सेप्ट्स तक। यह गाइड beginners और experienced developers दोनों के लिए उपयोगी है।

JavaScript Arrays क्या हैं? (What are JavaScript Arrays?)

JavaScript में array एक विशेष प्रकार की object है जो multiple values को एक single variable में store करने की अनुमति देती है। Arrays ordered collections होते हैं, जहां प्रत्येक value का एक numeric index होता है जो 0 से शुरू होता है।

// सरल array उदाहरण
let fruits = ["Apple", "Banana", "Mango"];
console.log(fruits[0]); // Output: "Apple"

Arrays JavaScript में बहुत ही flexible होते हैं और इनमें किसी भी data type के elements को store किया जा सकता है, जैसे numbers, strings, objects, यहां तक कि दूसरे arrays भी।

Array बनाने के तरीके (Ways to Create Arrays)

JavaScript में arrays बनाने के दो मुख्य तरीके हैं:

1. Array Literal Syntax

यह सबसे सरल और सामान्य तरीका है:

let emptyArray = [];
let numbers = [1, 2, 3, 4, 5];
let mixed = [1, "Hello", true, {name: "John"}, [7, 8, 9]];

2. Array Constructor

आप new Array() constructor का भी उपयोग कर सकते हैं:

let arr1 = new Array(); // खाली array
let arr2 = new Array(5); // length 5 का array
let arr3 = new Array(1, 2, 3); // [1, 2, 3]

नोट: Array constructor का उपयोग करते समय सावधान रहें। यदि आप केवल एक numeric argument पास करते हैं, तो यह array की length सेट करेगा, न कि उस value को element के रूप में add करेगा।

Array Properties (गुण)

length Property

length property array में elements की संख्या return करती है:

let colors = ["Red", "Green", "Blue"];
console.log(colors.length); // 3

आप length property का उपयोग array के अंत में elements add करने के लिए भी कर सकते हैं:

colors[colors.length] = "Yellow"; // ["Red", "Green", "Blue", "Yellow"]

Array Methods (तरीके)

JavaScript arrays में बहुत सारे built-in methods होते हैं जो array manipulation को आसान बनाते हैं। आइए इन्हें categories में देखें:

1. Adding/Removing Elements

Method	Description	Example
`push()`	Array के अंत में elements add करता है	`fruits.push("Orange");`
`pop()`	Array के अंत से last element को remove करता है	`fruits.pop();`
`unshift()`	Array की शुरुआत में elements add करता है	`fruits.unshift("Lemon");`
`shift()`	Array की शुरुआत से first element को remove करता है	`fruits.shift();`
`splice()`	Array में elements को add/remove करता है	`fruits.splice(1, 0, "Kiwi");`

Practical Example:

let fruits = ["Apple", "Banana"];
fruits.push("Orange");    // ["Apple", "Banana", "Orange"]
fruits.pop();            // ["Apple", "Banana"]
fruits.unshift("Mango"); // ["Mango", "Apple", "Banana"]
fruits.shift();          // ["Apple", "Banana"]
fruits.splice(1, 0, "Kiwi", "Lemon"); // ["Apple", "Kiwi", "Lemon", "Banana"]

2. Searching and Finding Elements

Method	Description	Example
`indexOf()`	Element की index return करता है (नहीं मिलने पर -1)	`fruits.indexOf("Apple");`
`lastIndexOf()`	Element की last index return करता है	`fruits.lastIndexOf("Apple");`
`includes()`	Check करता है कि element array में है या नहीं	`fruits.includes("Mango");`
`find()`	Test function को पास करने वाला पहला element return करता है	`fruits.find(fruit => fruit.length > 5);`
`findIndex()`	Test function को पास करने वाले पहले element की index return करता है	`fruits.findIndex(fruit => fruit === "Kiwi");`

3. Array Transformation

Method	Description	Example
`map()`	प्रत्येक element के लिए function को call करता है और results का नया array return करता है	`numbers.map(n => n * 2);`
`filter()`	Test function को पास करने वाले elements का नया array return करता है	`numbers.filter(n => n > 3);`
`reduce()`	Array को single value में reduce करता है	`numbers.reduce((sum, n) => sum + n, 0);`
`sort()`	Array के elements को sort करता है	`fruits.sort();`
`reverse()`	Array के elements का क्रम उलट देता है	`fruits.reverse();`

Transformation Examples:

// map() उदाहरण
let numbers = [1, 2, 3, 4];
let squares = numbers.map(num => num * num); // [1, 4, 9, 16]

// filter() उदाहरण
let evenNumbers = numbers.filter(num => num % 2 === 0); // [2, 4]

// reduce() उदाहरण
let sum = numbers.reduce((total, num) => total + num, 0); // 10

4. Array Iteration

Method	Description	Example
`forEach()`	प्रत्येक array element के लिए function execute करता है	`fruits.forEach(fruit => console.log(fruit));`
`every()`	Check करता है कि सभी elements test function को पास करते हैं	`numbers.every(n => n > 0);`
`some()`	Check करता है कि कोई भी element test function को पास करता है	`numbers.some(n => n > 3);`

5. Array Conversion

Method	Description	Example
`join()`	Array elements को string में join करता है	`fruits.join(", ");`
`toString()`	Array को string में convert करता है	`fruits.toString();`

Multidimensional Arrays (बहु-आयामी arrays)

JavaScript में आप arrays के अंदर arrays बना सकते हैं, जिन्हें multidimensional arrays कहा जाता है:

// 2D array (matrix)
let matrix = [
    [1, 2, 3],
    [4, 5, 6],
    [7, 8, 9]
];

// 3D array
let threeD = [
    [
        [1, 2],
        [3, 4]
    ],
    [
        [5, 6],
        [7, 8]
    ]
];

Multidimensional arrays में elements तक पहुंचने के लिए multiple indexes का उपयोग करें:

console.log(matrix[1][2]); // 6 (दूसरी row, तीसरा column)
console.log(threeD[1][0][1]); // 6

Array Destructuring (विघटन)

ES6 में introduce हुआ array destructuring आपको array elements को variables में unpack करने की अनुमति देता है:

let colors = ["Red", "Green", "Blue"];

// पारंपरिक तरीका
// let first = colors[0];
// let second = colors[1];

// Destructuring
let [first, second, third] = colors;
console.log(first);  // "Red"
console.log(second); // "Green"
console.log(third);  // "Blue"

आप default values और skipping elements का भी उपयोग कर सकते हैं:

let [a, , b] = colors; // दूसरे element को skip करें
console.log(a); // "Red"
console.log(b); // "Blue"

let [x, y, z, w = "Yellow"] = colors;
console.log(w); // "Yellow" (default value)

Spread Operator (...) with Arrays

Spread operator आपको arrays को expand करने की अनुमति देता है:

let arr1 = [1, 2, 3];
let arr2 = [...arr1, 4, 5]; // [1, 2, 3, 4, 5]

// Array को function arguments में spread करना
function sum(a, b, c) {
    return a + b + c;
}
let numbers = [5, 10, 15];
console.log(sum(...numbers)); // 30

Array.from() Method

Array.from() method array-like objects (जैसे arguments या DOM collections) या iterables (जैसे strings) से real arrays बनाता है:

// String से array बनाना
let str = "hello";
let arr = Array.from(str); // ["h", "e", "l", "l", "o"]

// Set से array बनाना
let set = new Set([1, 2, 3]);
let arrFromSet = Array.from(set); // [1, 2, 3]

Array.isArray() Method

यह check करता है कि दिया गया object एक array है या नहीं:

console.log(Array.isArray([1, 2, 3])); // true
console.log(Array.isArray({}));      // false
console.log(Array.isArray("Hello")); // false

Array Performance Considerations

JavaScript arrays के साथ काम करते समय performance को optimize करने के लिए:

push/pop vs shift/unshift: push() और pop() operations shift() और unshift() से faster होते हैं क्योंकि latter को array के सभी elements को re-index करना पड़ता है।
Large arrays: बड़े arrays के साथ काम करते समय loops के बजाय built-in methods (map, filter, etc.) का उपयोग करें क्योंकि वे अक्सर अधिक optimize होते हैं।
Memory: बड़े arrays को store करते समय, यदि आपको array के सभी elements की एक साथ आवश्यकता नहीं है, तो generators या iterators का उपयोग करने पर विचार करें।

Common Array Use Cases

1. Removing Duplicates from an Array

let duplicates = [1, 2, 2, 3, 4, 4, 5];
let unique = [...new Set(duplicates)]; // [1, 2, 3, 4, 5]

2. Finding Max/Min in an Array

let nums = [5, 10, 1, 8];
let max = Math.max(...nums); // 10
let min = Math.min(...nums); // 1

3. Flattening Nested Arrays

let nested = [[1, 2], [3, 4], [5, 6]];
let flat = nested.flat(); // [1, 2, 3, 4, 5, 6]

// गहरे nesting के लिए
let deepNested = [[[1, 2]], [[3, 4]], [[5, 6]]];
let deepFlat = deepNested.flat(2); // [1, 2, 3, 4, 5, 6]

4. Chunking an Array

function chunkArray(arr, size) {
    return Array.from(
        { length: Math.ceil(arr.length / size) },
        (_, i) => arr.slice(i * size, i * size + size)
    );
}

let arrayToChunk = [1, 2, 3, 4, 5, 6, 7];
let chunked = chunkArray(arrayToChunk, 3); 
// [[1, 2, 3], [4, 5, 6], [7]]

Modern JavaScript Array Features (ES6+)

1. Array.prototype.flat()

Nested arrays को specified depth तक flatten करता है:

let arr = [1, [2, [3, [4]]]];
arr.flat();    // [1, 2, [3, [4]]]
arr.flat(2);   // [1, 2, 3, [4]]
arr.flat(Infinity); // [1, 2, 3, 4]

2. Array.prototype.flatMap()

मानचित्रण (mapping) function को लागू करता है और फिर result को एक level तक flatten करता है:

let arr = ["Hello World", "Goodbye Moon"];
let words = arr.flatMap(phrase => phrase.split(" "));
// ["Hello", "World", "Goodbye", "Moon"]

3. Array.prototype.at()

दिए गए index पर element return करता है, negative indexes को भी support करता है:

let arr = [10, 20, 30, 40];
arr.at(1);   // 20
arr.at(-1);  // 40 (last element)
arr.at(-2);  // 30

Best Practices for Working with Arrays

Immutable operations का उपयोग करें: जहां संभव हो, मूल array को modify करने वाले methods (splice, sort, etc.) के बजाय नए arrays return करने वाले methods (map, filter, slice) का उपयोग करें।
Descriptive variable names: arr या temp जैसे generic names के बजाय userNames या productPrices जैसे descriptive names का उपयोग करें।

Array length caching: Loops में array length को cache करें:

// बुरा (हर iteration में length की गणना करता है)
for (let i = 0; i < arr.length; i++) { ... }

// अच्छा (length को cache करता है)
for (let i = 0, len = arr.length; i < len; i++) { ... }

Type consistency: एक array में एक ही type के elements रखने का प्रयास करें। Mixed-type arrays को संभालना मुश्किल हो सकता है।
Destructure for readability: Array elements को अलग-अलग variables में निकालने के लिए destructuring का उपयोग करें:
```
// बुरा
let first = arr[0];
let second = arr[1];

// अच्छा
let [first, second] = arr;
```

Conclusion

JavaScript arrays powerful और versatile data structures हैं जो आपको multiple values को organized तरीके से store और manipulate करने की अनुमति देते हैं। इस गाइड में हमने arrays के सभी मुख्य aspects को कवर किया है:

Arrays बनाने और initialize करने के विभिन्न तरीके
Array elements को access और modify करना
Array methods और उनके उपयोग के मामले
Modern JavaScript array features
Performance considerations और best practices

Arrays JavaScript में सबसे अधिक उपयोग किए जाने वाले data structures में से एक हैं, और इन्हें अच्छी तरह से समझना हर JavaScript developer के लिए आवश्यक है। अभ्यास करते रहें और real-world projects में इन techniques को apply करें!

अगला कदम: अब जब आप arrays के बारे में जानते हैं, तो JavaScript objects और array of objects के साथ काम करने का तरीका सीखने पर विचार करें, क्योंकि ये अक्सर real-world applications में एक साथ उपयोग किए जाते हैं।