इंडेक्स किए गए कलेक्शन

इंडेक्स किया गया कलेक्शन एक डेटा स्ट्रक्चर होता है. इसमें एलिमेंट को सेव करने और ऐक्सेस करने के लिए, नंबर वाले इंडेक्स का इस्तेमाल किया जाता है. इंडेक्स किए गए कलेक्शन में सेव की गई वैल्यू को नंबर वाले इंडेक्स असाइन किए जाते हैं. इसकी शुरुआत 0 से होती है. यह पैटर्न "ज़ीरो-इंडेक्सिंग" होता है. इसके बाद, इंडेक्स किए गए कलेक्शन में सेव की गई वैल्यू को ऐक्सेस करने के लिए, उनके इंडेक्स का रेफ़रंस दिया जा सकता है.

Array

अरे एक कंटेनर होता है जिसमें किसी भी तरह के डेटा टाइप की शून्य या उससे ज़्यादा वैल्यू हो सकती हैं. इनमें कॉम्प्लेक्स ऑब्जेक्ट या अन्य अरे शामिल हैं. किसी अरे में स्टोर की गई वैल्यू को कभी-कभी अरे के "एलिमेंट" कहा जाता है.

कलेक्शन बनाएं

प्रिमिटिव डेटा टाइप की तरह ही, अरे बनाने के दो तरीके हैं: अरे लिटरल वैल्यू के तौर पर या new Array() के साथ JavaScript के पहले से मौजूद Array() कंस्ट्रक्टर का इस्तेमाल करके. किसी वैरिएबल के लिए अरे असाइन करने से, किसी एक आइडेंटिफ़ायर को कई वैल्यू असाइन करने का ऐसा तरीका आसान हो जाता है और उसे आसानी से पोर्टेबल भी किया जा सकता है.

ऐरे लिटरल सिंटैक्स में ब्रैकेट ([]) के सेट का इस्तेमाल होता है, जो शून्य या उससे ज़्यादा कॉमा लगाकर अलग किए गए डेटा वैल्यू के आस-पास होता है:

const myArray = [];

कलेक्शन कंस्ट्रक्टर सिंटैक्स, JavaScript के बिल्ट-इन Array ऑब्जेक्ट को new कीवर्ड के साथ, कंस्ट्रक्टर के तौर पर इस्तेमाल करता है:

const myArray = new Array();

अरे लिटरल और अरे कंस्ट्रक्टर सिंटैक्स, दोनों की मदद से अरे बनने के बाद, उस कैटगरी में जानकारी अपने-आप भर जाती है. हालांकि, वैल्यू तय करने के तरीके में सिंटैक्स थोड़ा अलग होते हैं. ऐरे लिटरल सिंटैक्स में ब्रैकेट के बीच कॉमा लगाकर अलग की गई वैल्यू का इस्तेमाल किया जाता है. यह वैल्यू, नतीजे वाले अरे की तरह दिखती है:

const myArray = [ true, null, "String", false ];

myArray;
> [ true, null, "String", false ]

ऐरे कंस्ट्रक्टर सिंटैक्स एक खास तरह के अपवाद को छोड़कर, कॉमा लगाकर अलग की गई वैल्यू को आर्ग्युमेंट के तौर पर लेता है:

const myArray = new Array( true, null, "String", false );

myArray;
> Array(4) [ true, null, "String", false ]

जब Array कंस्ट्रक्टर को एक संख्या वाली वैल्यू भेजी जाती है, तो वह वैल्यू, नतीजे पाने वाले अरे में शून्यवीं पोज़िशन पर असाइन नहीं की जाती. इसके बजाय, वैल्यू के लिए खाली स्लॉट की संख्या वाली अरे बनाई जाती है. इससे अरे पर कोई सीमा लागू नहीं होती. आइटम को इसमें उसी तरह जोड़ा और हटाया जा सकता है जिस तरह लिटरल ऐरे की तरह किया जाता है.

// Firefox:\
const myArray = new Array( 10 );

myArray;
> Array(10) [ <10 empty slots> ]

// Chrome:
const myArray = new Array( 10 );

myArray;
> (10) [empty × 10]

खाली स्लॉट वाली कैटगरी (जिन्हें कभी-कभी "स्पार्स अरे" भी कहा जाता है) खास केस होते हैं. undefined या साफ़ तौर पर null वैल्यू शामिल करने के बजाय, खाली स्लॉट को अक्सर undefined वैल्यू माना जाता है. हालांकि, ऐसा हमेशा नहीं होता.

लिटरल वैल्यू वाला अरे बनाते समय, कॉमा के बीच से वैल्यू हटाकर गलती से अरे लिटरल सिंटैक्स का इस्तेमाल करके स्पार्स अरे बनाया जा सकता है:

const myArray = [ true,, true, false ];

myArray;
> Array(4) [ true, <1 empty slot>, true, false ]

सभी कॉन्टेक्स्ट में खाली स्लॉट को काम की वैल्यू नहीं माने जाने के बावजूद, खाली स्लॉट को अरे की कुल लंबाई में शामिल किया जाता है. इससे अरे की वैल्यू दोहराते समय, अनचाहे नतीजे मिल सकते हैं:

const myArray = [ 1,, 3, 4 ];

myArray.length;
> 4

for( const myValue of myArray ) {
  console.log( myValue + 10 );
}
> 11
> NaN
> 13
> 14

यह व्यवहार JavaScript के डिज़ाइन से जुड़े सबसे पुराने फ़ैसलों में से एक है. आधुनिक डेवलपमेंट में, स्पार्स एरे का इस्तेमाल करने से बचें.

प्रिमिटिव की तरह ही, लिटरल वैल्यू अपने संबंधित कंस्ट्रक्टर में प्रॉपर्टी और मेथड को शामिल करती है. कलेक्शन, ऑब्जेक्ट का एक खास टाइप होता है. इसलिए, अरे लिटरल सिंटैक्स और new Array() सिंटैक्स, फ़ंक्शनल तौर पर एक जैसे नतीजे बनाते हैं: एक ऑब्जेक्ट जो Array कंस्ट्रक्टर से अपना प्रोटोटाइप लेता है.

const arrayLiteral = [];
const arrayConstructor = new Array();

typeof arrayLiteral;
> "object"

arrayLiteral;
> Array []
    length: 0
    <prototype>: Array []

typeof arrayConstructor;
> "object"

arrayConstructor;
> Array []
    length: 0
    <prototype>: Array []

दोनों नतीजे एक जैसे हैं और अरे लिटरल सिंटैक्स ज़्यादा छोटा और लिटरल है. इसलिए, हमारा सुझाव है कि आप new Array() सिंटैक्स के बजाय, हमेशा अरे लिटरल सिंटैक्स का इस्तेमाल करें.

अरे की वैल्यू ऐक्सेस करें

आपके पास ऐरे में मौजूद अलग-अलग एलिमेंट को ऐक्सेस करने का विकल्प होता है. इसके लिए, अरे या इसके आइडेंटिफ़ायर के बाद ब्रैकेट ([]) का इस्तेमाल किया जाता है, जिसमें उस एलिमेंट के इंडेक्स को रेफ़र करने वाला नंबर मौजूद होता है:

[ "My string", "My other string" ][ 1 ];
> "My other string"

const myArray = [ "My string", 50, true ];

myArray[ 0 ];
> "My string"

myArray[ 1 ];
> 50

myArray[ 2 ];
> true

JavaScript में कैटगरी असोसिएट नहीं होती हैं. इसका मतलब है कि इंडेक्स के तौर पर आर्बिट्रेरी स्ट्रिंग का इस्तेमाल नहीं किया जा सकता. हालांकि, अरे में एलिमेंट को ऐक्सेस करने के लिए इस्तेमाल किए जाने वाले न्यूमेरिक वैल्यू को, पर्दे के पीछे की स्ट्रिंग वैल्यू के तौर पर इस्तेमाल किया जाता है. इसका मतलब है कि ऐसी स्ट्रिंग वैल्यू का इस्तेमाल किया जा सकता है जिसमें सिर्फ़ संख्या वाले वर्ण हों:

const myArray = [ "My string", 50, true ];

myArray[ 2 ];
> true

myArray[ "2" ];
> true

कलेक्शन में मौजूद एलिमेंट से बाहर के किसी एलिमेंट को ऐक्सेस करने की कोशिश करने पर, undefined मिलता है, यह कोई गड़बड़ी नहीं है:

const myArray = [ "My string", 50, true ];

myArray[ 9 ];
> undefined

असाइनमेंट खत्म किया जा रहा है

असाइनमेंट को नष्ट करना, अरे या ऑब्जेक्ट से वैल्यू की रेंज निकालने और उन्हें आइडेंटिफ़ायर के सेट को असाइन करने का एक आसान तरीका है. इस प्रोसेस को कभी-कभी ओरिजनल डेटा स्ट्रक्चर को "अनपैक करना" कहा जाता है. हालांकि, इसमें ओरिजनल अरे या ऑब्जेक्ट में कोई बदलाव नहीं होता.

स्ट्रक्चर करने वाला असाइनमेंट, वैल्यू का ट्रैक रखने के लिए, आइडेंटिफ़ायर की अरे या ऑब्जेक्ट जैसी सूची का इस्तेमाल करता है. बाइंडिंग पैटर्न डिस्ट्रक्चरिंग नाम के सबसे आसान तरीके में, हर वैल्यू को अरे या ऑब्जेक्ट से अनपैक किया जाता है. साथ ही, let या const या var का इस्तेमाल करके, वैल्यू को उससे जुड़े वैरिएबल को असाइन किया जाता है:

const myArray = [ "A string", "A second string" ];
const [ myFirstElement, mySecondElement ] = myArray;

const myObject = { firstValue: false, secondValue: true };
const { myProp, mySecondProp } = myObject;

myFirstElement;
> "My string"

mySecondElement;
> "Second string"

myProp;
> false

mySecondProp;
> true

किसी ऑब्जेक्ट को नष्ट करने के लिए कर्ली ब्रैकेट ({}) और किसी अरे को नष्ट करने के लिए, स्क्वेयर ब्रैकेट ([]) का इस्तेमाल करें.

const myArray = [ false, true ];
const myObject = { firstValue: false, secondValue: true };

const [ myProp, mySecondProp ] = myObject;
> Uncaught TypeError: myObject is not iterable

const { myElement, mySecondElement } = myArray;

myElement
> undefined

mySecondElement;
> undefined

किसी अरे को बाईं से दाईं ओर क्रम से हटाया जाता है. स्ट्रक्चर करने वाले असाइनमेंट का हर आइडेंटिफ़ायर, एक ही इंडेक्स वाले कलेक्शन के एलिमेंट से मेल खाता है:

const myArray = [ 1, 2, 3 ];
const [ myElement, mySecondElement, myThirdElement ] = myArray;

myElement;
> 1

mySecondElement;
> 2

myThirdElement;
> 3

यह किसी ऑब्जेक्ट को नष्ट करते समय भी डिफ़ॉल्ट व्यवहार है. हालांकि, अगर डेटा नष्ट करने वाले असाइनमेंट में इस्तेमाल किए गए आइडेंटिफ़ायर, ऑब्जेक्ट की प्रॉपर्टी की कुंजियों से मेल खाते हैं, तो उन आइडेंटिफ़ायर से जुड़ी प्रॉपर्टी की वैल्यू से अपने-आप डेटा भर जाता है. इस बात से कोई फ़र्क़ नहीं पड़ता कि वे किस क्रम में हैं:

const myObject = { firstValue: 1, secondValue: 2, thirdValue 3 };
const { secondValue, thirdValue, firstValue } = myObject;

firstValue;
> 1

secondValue;
> 2

thirdValue;
> 3

किसी आइडेंटिफ़ायर को छोड़कर, एलिमेंट को स्किप किया जा सकता है:

const myArray = [ 1, 2, 3 ];
const [ firstValue,, secondValue ] = myArray;

firstValue;
> 1

secondValue;
> 3

सिंटैक्स को नष्ट करने से आपको डिफ़ॉल्ट वैल्यू असाइन करने की सुविधा भी मिलती है. ऐसा तब किया जा सकता है, जब डिस्ट्रक्चर्ड वैल्यू के लिए कोई खाली स्लॉट हो, जैसा कि स्पार्स अरे या undefined वैल्यू के मामले में होता है.

const myArray = [ true, ];
const [ firstValue = "Default string.", secondValue = "Default string." ] = myArray;

firstValue;
> true

secondValue;
> "Default string."

डीकंस्ट्रक्शन की वैल्यू किसी खास टाइप के मुताबिक नहीं होती. इसका मतलब है कि "गलत" वैल्यू, जैसे कि खाली स्ट्रिंग ("") या null अब भी काम की डीकंस्ट्रक्ट वैल्यू मानी जाती हैं:

const myArray = [ false, null, 0, "",, undefined ];
const [ falseValue = true, nullValue = true, zeroValue = true, emptyStringValue = true, emptySlot = true, undefinedValue = true ] = myArray;

falseValue;
> false;

nullValue;
> null

zeroValue;
> 0

emptyStringValue;
> ""

emptySlot;
> true

undefinedValue;
> true

स्प्रेड ऑपरेटर

ES6 में पेश किए गए स्प्रेड ऑपरेटर (...) का इस्तेमाल करें. इससे अलग-अलग एलिमेंट में अरे, स्ट्रिंग या ऑब्जेक्ट लिटरल जैसे बार-बार इस्तेमाल किए जा सकने वाले डेटा स्ट्रक्चर को बड़ा किया जा सकता है. स्प्रेड ऑपरेटर के तुरंत बाद, बड़ा किया जाने वाला डेटा स्ट्रक्चर या उस डेटा स्ट्रक्चर वाले वैरिएबल का आइडेंटिफ़ायर डाला जाता है.

const myArray = [ 1, 2, 3 ];

console.log( ...myArray );
> 1 2 3

स्प्रेड सिंटैक्स का इस्तेमाल मुख्य रूप से अरे को कॉपी करने और उन्हें आपस में जोड़ने के लिए किया जाता है:

const myArray = [ 4, 5, 6 ];
const mySecondArray = [1, 2, 3, ...myArray ];

mySecondArray;
> Array(6) [ 1, 2, 3, 4, 5, 6 ]

स्प्रेड सिंटैक्स का इस्तेमाल सिर्फ़ इन कॉन्टेक्स्ट में किया जा सकता है:

अरे और स्ट्रिंग के लिए, स्प्रेड सिंटैक्स सिर्फ़ तब लागू होता है, जब फ़ंक्शन कॉल में शून्य या ज़्यादा आर्ग्युमेंट या किसी अरे में एलिमेंट की उम्मीद हो. इस सेक्शन में स्प्रेड ऑपरेटर सिंटैक्स का पहला उदाहरण काम करता है, क्योंकि यह पहले से मौजूद console.log तरीके में, ...myArray को आर्ग्युमेंट के तौर पर पास करता है.

उदाहरण के लिए, आपके पास किसी दूसरे अरे के बाहर, वैरिएबल में भेजे जा रहे डेटा को असाइन करने का विकल्प नहीं है:

const myArray = [ 1, 2, 3 ];
const spreadVariable = ...myArray;
> Uncaught SyntaxError: Unexpected token '...'

लेकिन, ओरिजनल अरे को लिटरल ऐरे में बांटकर ऐरे को कॉपी किया जा सकता है:

const myArray = [ 1, 2, 3 ];
const spreadArray = [ ...myArray ];

spreadArray;
> Array(3) [ 1, 2, 3 ]

दो या उससे ज़्यादा अरे बनाने वाले एलिमेंट को मर्ज करने के लिए:

const myArray = [ 1, 2, 3 ];
const mySecondArray = [ 4, 5, 6 ];
const myNewArray = [ ...myArray, ...mySecondArray ];

myNewArray;
> Array(6) [ 1, 2, 3, 4, 5, 6 ]

इसके अलावा, फ़ंक्शन कॉल में ऐरे के एलिमेंट को अलग-अलग आर्ग्युमेंट के तौर पर पास करने के लिए:

const myArray = [ true, false ];
const myFunction = ( myArgument, mySecondArgument ) => {
    console.log( myArgument, mySecondArgument );
};

myFunction( ...myArray );
> true false

ES2018 में ऑब्जेक्ट लिटरल के साथ काम करने के लिए, स्प्रेड ऑपरेटर को बड़ा किया गया. कलेक्शन की तरह ही, ऑब्जेक्ट को डुप्लीकेट या मर्ज करने के लिए, स्प्रेड ऑपरेटर का इस्तेमाल किया जा सकता है:

const myObj = { myProperty : true };
const mySecondObj = { ...myObj };

mySecondObj;
> Object { myProperty: true }

const myFirstObj = { myProperty : true };
const mySecondObj = { additionalProperty : true };
const myMergedObj = { ...myFirstObj, ...mySecondObj };

myMergedObj;
> Object { myProperty: true, additionalProperty: true }

स्प्रेड ऑपरेटर "शैलो" कॉपी बनाता है. इसका मतलब है कि यह ओरिजनल ऑब्जेक्ट के प्रोटोटाइप और गिनती नहीं जा सकने वाली प्रॉपर्टी को कॉपी नहीं करता है.

const myCustomPrototype = { protoProp: "My prototype." };
const myObj = Object.create( myCustomPrototype, {
    myEnumerableProp: {
        value: true,
        enumerable: true
    },
    myNonEnumerableProp: {
        value: false,
        enumerable: false
    }
});
const myNewObj = { ...myObj };

myObj;
> Object { myEnumerableProp: true, … }
    myEnumerableProp: true
    myNonEnumerableProp: false
    <prototype>: Object { protoProp: "My prototype." }

myNewObj;
> Object { myEnumerableProp: true }
    myEnumerableProp: true
    <prototype>: Object { … }

ध्यान रखें कि सरणियों और ऑब्जेक्ट का इस्तेमाल, एक-दूसरे की जगह नहीं किया जा सकता. किसी ऑब्जेक्ट को अरे या अरे में, किसी ऑब्जेक्ट में नहीं फैलाया जा सकता.

आराम करने वाला ऑपरेटर

हालांकि, ऑपरेटर का सिंटैक्स एक जैसा ही है, लेकिन बाकी ऑपरेटर (...) उसका इस्तेमाल किए गए कॉन्टेक्स्ट के आधार पर, उलटा फ़ंक्शन करता है. दोहराए जा सकने वाले डेटा स्ट्रक्चर को अलग-अलग एलिमेंट में बड़ा करने के बजाय, डिस्ट्रक्चरिंग असाइनमेंट या फ़ंक्शन पैरामीटर के तौर पर, बाकी ऑपरेटर एलिमेंट को फिर से इस्तेमाल किए जा सकने वाले डेटा स्ट्रक्चर में मिला देता है. यह नाम इसलिए दिया गया है, क्योंकि इसका इस्तेमाल डेटा वैल्यू के एक सेट के "बाकी" डेटा को इकट्ठा करने के लिए किया जाता है.

संरचना को नष्ट करने वाले असाइनमेंट के साथ इस्तेमाल किए जाने पर, सिंटैक्स को "अन्य प्रॉपर्टी" सिंटैक्स कहा जाता है.

const myArray = [ "First", "Second", "Third", "Fourth", "Fifth" ];

[ myFirstElement, mySecondElement, ...remainingElements ] = myArray;

myFirstElement;
> "First"

mySecondElement;
> "Second"

remainingElements;
> Array(3) [ "Third", "Fourth", "Fifth"]

जब किसी फ़ंक्शन में अनिश्चित संख्या में आर्ग्युमेंट देने के लिए इसका इस्तेमाल किया जाता है, तो सिंटैक्स को "rest पैरामीटर" सिंटैक्स कहा जाता है:

function myFunction( ...myParameters ) {
    let result = 0;
    myParameters.forEach( ( myParam ) => {
        result += myParam;
    });
    return result;
};

myFunction( 2, 2 );
> 4

myFunction( 1, 1, 1, 10, 5 );
> 18

myFunction( 10, 11, 25 );
> 46

%TypedArray%

टाइप किए गए अरे एक ES6 सुविधा है, जिसे स्ट्रक्चर्ड बाइनरी डेटा को स्टोर करने के लिए डिज़ाइन किया गया है. उदाहरण के लिए, अपलोड की गई फ़ाइलों या WebGL के साथ काम करते समय.

सिंबल की तरह, %TypedArray% इंट्रिंसिक फ़ंक्शन (आम तौर पर %TypedArray% या @@TypedArray के तौर पर दर्ज किया जाता है, ताकि इसे ग्लोबल प्रॉपर्टी न समझा जाए), पारंपरिक तरीके में कंस्ट्रक्टर फ़ंक्शन नहीं होता. साथ ही, इसे new से शुरू या सीधे कॉल नहीं किया जा सकता. इसके बजाय, %TypedArray% अलग-अलग कंस्ट्रक्टर के पैरंट सुपर क्लास को दिखाता है, जिनमें से हर एक खास बाइनरी डेटा फ़ॉर्मैट के साथ काम करता है. सामान्य %TypedArray% सुपर क्लास, ऐसी प्रॉपर्टी और यूटिलिटी के तरीके उपलब्ध कराती है जो %TypedArray% कंस्ट्रक्टर की सभी सब-क्लास और उनके इंस्टेंस इनहेरिट करती हैं.

जांचें कि आपको कितना समझ आया

`cont myArray = [ 30, 50, 70 ];` दिए जाने पर `myArray[1]` क्या मिलता है?

50

30

70

अगर `myArray` में तीन वैल्यू हैं, तो `myarray[9]` क्या दिखेगा?

Undefined

गड़बड़ी का मैसेज

9

Null