Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

JavaScript Array: शुरुआती लोगों के लिए गाइड

आइए अपने लिए फलों की एक सूची बनाएं। हम अपनी सूची को "fruit" कहेंगे, और निम्नलिखित मान जोड़ेंगे: केला, तरबूज, अंगूर। ओह, मुझे फल कितने पसंद हैं! हालांकि यह खरीदारी सूची पर ट्यूटोरियल की तरह लग सकता है, हमने वास्तव में अपने लिए एक ऐरे बना लिया है।

इस गाइड में, हम बताने जा रहे हैं कि ऐरे क्या हैं, वे कैसे काम करते हैं, और आपको अपने कोड में उनका उपयोग क्यों करना चाहिए। हम ऐरे के कुछ उदाहरणों पर चर्चा करेंगे ताकि आप JavaScript ऐरे निंजा बन सकें!

Array क्या है?

एक ऐरे एक ऑब्जेक्ट है जो डेटा संग्रहीत करता है। ऐरे में आइटम्स का एक क्रमबद्ध संग्रह होता है, और शून्य या अधिक आइटम्स संग्रहीत कर सकते हैं। ऐरे प्रोग्रामिंग में उपयोगी होते हैं क्योंकि वे आपको समान मानों को एक वेरिएबल में संग्रहीत करने की अनुमति देते हैं।

उदाहरण के लिए, अपने पसंदीदा फलों को सूचीबद्ध करने के लिए आपको दस सिंगल वेरिएबल्स लिखने की आवश्यकता नहीं है। एक ऐरे के साथ, आप अपने सभी पसंदीदा फलों को एक वेरिएबल में जोड़ सकते हैं।

निम्नलिखित उदाहरण पर विचार करें:

let fruits = [ "Banana", "Grapes", "Melon" ];

यहाँ हमने "fruits" नामक एक ऐरे बनाया है। यह तीन अलग-अलग मान संग्रहीत करता है, जिनमें से प्रत्येक एक फल को दर्शाता है जिसे हम किराने की दुकान पर खरीदना चाहते हैं। अपने ऐरे को घोषित करने के लिए, हमने अपने आइटम्स की सूची को स्क्वायर ब्रैकेट्स में घेर लिया है।

ऐरे घोषित करना

ऐरे घोषित करने के दो तरीके हैं। ज्यादातर लोग जिस तरह से करते हैं वह आइटम्स की सूची को स्क्वायर ब्रैकेट्स से घेरकर होता है, जैसे हमने पहले किया था:

let berries = [ "Strawberry", "Blueberry", "Gooseberry" ];

इस उदाहरण में हमने तीन मानों के साथ एक ऐरे घोषित किया है। हम ऐरे कंस्ट्रक्टर का भी उपयोग कर सकते हैं, जो ऐरे घोषित करने के लिए new कीवर्ड का उपयोग करता है:

let berries = new Array( "Strawberry", "Blueberry", "Gooseberry" );

ये कोड स्निपेट्स अलग-अलग मेथड्स का उपयोग करके समान ऐरे बनाते हैं। ध्यान दें कि हमारे दूसरे उदाहरण में हमने अपने ऐरे को घोषित करने के लिए सर्कुलर ब्रैकेट्स का उपयोग किया है। हमें ऐरे घोषित करने के लिए new Array कंस्ट्रक्टर का भी उपयोग करना पड़ा। यही कारण है कि ज्यादातर लोग पहली विधि पसंद करते हैं; स्क्वायर ब्रैकेट्स याद रखना बहुत आसान है और टाइप करना तेज़ है।

ऐरे में समान डेटा प्रकार शामिल नहीं होने चाहिए। हमारा ऐरे किसी भी संख्या में विभिन्न प्रकार के डेटा संग्रहीत कर सकता है:

let berries = [ "Strawberry", 1.50, true ];

यह ऐरे तीन अलग-अलग प्रकार के डेटा संग्रहीत करता है: एक स्ट्रिंग, एक नंबर, और एक बूलियन। अब जब आप ऐरे घोषित करने से परिचित हैं, तो आप उनकी सामग्री तक पहुंचना शुरू करने के लिए तैयार हैं।

ऐरे पढ़ना

ऐरे बहुत उपयोगी नहीं होंगे यदि हम उनके मानों को पढ़ नहीं सकते। इसीलिए इंडेक्सिंग मौजूद है। इंडेक्सिंग किसी पुनरावृत्त ऑब्जेक्ट, जैसे सूची, में व्यक्तिगत आइटम्स तक पहुंचने का एक तरीका है।

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

let fruits = [ "Banana", "Grapes", "Melon" ];

यहाँ इस ऐरे को असाइन किए गए इंडेक्स मान हैं:

  • 0: Banana
  • 1: Grapes
  • 2: Melon

इन नंबरों का उपयोग करके, हम अपनी सूची में व्यक्तिगत आइटम्स तक पहुंच सकते हैं। मान लीजिए आप पहचानना चाहते हैं कि आपके ऐरे में इंडेक्स स्थिति 1 पर कौन सा फल है। आप ऐरे के नाम के बाद स्क्वायर ब्रैकेट्स में इंडेक्स मान बताकर ऐसा कर सकते हैं:

fruits[1];

हमारा कोड लौटाता है: Grapes। हम इंडेक्स स्थिति 1 का संदर्भ दे रहे हैं, जो मान "Grapes" संग्रहीत करता है। यदि आप मान 0 पास करते, तो "Banana" लौटाया जाता। यदि आप किसी ऐसे आइटम तक पहुंचने का प्रयास करते हैं जो मौजूद नहीं है, तो "undefined" लौटाया जाएगा:

fruits[10];

आउटपुट: undefined। इंडेक्सिंग तब विशेष रूप से उपयोगी होती है जब आप ऐरे में आइटम्स के माध्यम से लूप करना चाहते हैं। मान लीजिए आप अपने ऐरे में प्रत्येक फल को कंसोल पर प्रिंट करना चाहते हैं। आप ऐसा for लूप का उपयोग करके कर सकते हैं जैसे यह:

for (var i = 0; i < fruits.length; i++) {
    console.log(fruits[i]);
}

यह कोड लौटाता है:

Banana
Grapes
Melon

हमारा कोड हमारी सूची में प्रत्येक आइटम के माध्यम से लूप करता है, फिर प्रत्येक आइटम को कंसोल पर प्रिंट करता है। आप यह भी देखेंगे कि हमने length प्रॉपर्टी का उपयोग किया है। यह हमारी सूची की लंबाई लौटाता है।

ऐरे में आइटम्स जोड़ें

अधिकांश समय, आप अपने ऐरे को शुरू में घोषित करने के बाद इसमें एक नया मान जोड़ना चाहेंगे। आप push() ऐरे मेथड का उपयोग करके ऐसा कर सकते हैं।

हम अपनी फलों की सूची में "Strawberry" जोड़ना भूल गए। ओह नहीं! चिंता न करें, हम इसे push() मेथड का उपयोग करके हमेशा जोड़ सकते हैं:

let fruits = [ "Banana", "Grapes", "Melon" ];
fruits.push("Strawberry");
console.log(fruits);

अब जब हमने यह कोड चलाया है, तो हमारा ऐरे इस तरह दिखता है:

BananaGrapesMelonStrawberry
0123

आप unshift() का उपयोग करके अपने ऐरे की शुरुआत में डेटा जोड़ सकते हैं। स्ट्रॉबेरी हमारी खरीदारी सूची में इतनी महत्वपूर्ण हैं कि हम उन्हें पहले दिखाना चाहते हैं:

let fruits = [ "Banana", "Grapes", "Melon" ];
fruits.unshift("Strawberry");
console.log(fruits);

यह हमारी मूल "fruits" सूची को इस तरह दिखाएगा:

StrawberryBananaGrapesMelon
0123

ऐरे से आइटम्स हटाएं

पता चला कि हमारे घर पर पहले से ही एक तरबूज है, इसलिए हमें उसके लिए खरीदारी करने की आवश्यकता नहीं है। तरबूज हमारी सूची के अंत में है, इसलिए हमारे पास इसे हटाने के दो विकल्प हैं:

  • splice(): इंडेक्स नंबर द्वारा तत्वों को हटाता है।
  • pop(): ऐरे के अंत से एक तत्व को हटाता है।

आइए splice() का उदाहरण के रूप में उपयोग करें:

let fruits = [ "Banana", "Grapes", "Melon" ];
fruits.splice(3, 1);
console.log(fruits);

हमारा कोड लौटाता है:

Strawberry Banana Grapes

splice() दो पैरामीटर स्वीकार करता है। पहला ऐरे से हटाए जाने वाला इंडेक्स नंबर है, और दूसरा हटाने के लिए कितने आइटम्स हैं। इस मामले में, हम इंडेक्स मान 3 वाले आइटम को हटाना चाहते थे, इसलिए हमने अपने पैरामीटर्स के रूप में "3, 1" निर्दिष्ट किया।

pop() कोई पैरामीटर स्वीकार नहीं करता। यह बस सूची के अंतिम आइटम को हटा देता है:

let fruits = [ "Banana", "Grapes", "Melon" ];
fruits.pop();
console.log(fruits);

हमारा कोड लौटाता है:

Banana Grapes

आप सूची की शुरुआत से आइटम हटाने के लिए shift() का भी उपयोग कर सकते हैं:

let fruits = [ "Banana", "Grapes", "Melon" ];
fruits.shift();
console.log(fruits);

हमारा कोड लौटाता है:

Grapes Melon

push() और unshift() सूचियों में आइटम्स जोड़ते हैं। pop() और shift() सूचियों से आइटम्स हटाते हैं। स्प्लिस मेथड का उपयोग इंडेक्स मान के आधार पर सूची से आइटम हटाने के लिए भी किया जा सकता है।

ऐरे में आइटम्स बदलें

जबकि केले एक स्वादिष्ट फल हैं, अक्सर वे इतने बड़े होते हैं कि आप थोड़ा भूख लगने पर स्नैक के रूप में एक को नहीं खा सकते। बेबी केले खाना आसान होता है।

अब, मान लीजिए हम अपनी "fruits" सूची को बदलना चाहते हैं ताकि हम नियमित केले के बजाय बेबी केले खरीदें। हम असाइनमेंट ऑपरेटर का उपयोग करके ऐसा कर सकते हैं जैसे हम किसी वेरिएबल के साथ करेंगे:

fruits[0] = "Baby bananas";
console.log(fruits);

हमारा कोड लौटाता है:

Baby bananas Grapes Melon

हमने इंडेक्स स्थिति 0 पर आइटम को संशोधित करके मान "Baby bananas" संग्रहीत किया है। ऐरे में मान बदलने के लिए आपको किसी विशेष मेथड का उपयोग करने की आवश्यकता नहीं है; असाइनमेंट ऑपरेटर का उपयोग ऐरे में मान बदलने के लिए किया जाता है।

निष्कर्ष

यह JavaScript ऐरे के बारे में आपको जो जानने की आवश्यकता है उसकी मूल बातें हैं। आपके लिए सीखने के लिए और भी बहुत कुछ है, लेकिन यही प्रोग्रामिंग को मजेदार बनाता है: आपके लिए हमेशा एक नई चुनौती होती है। यदि और कुछ नहीं, तो आपने मेरे पसंदीदा फलों के बारे में सीखा है। हालांकि मैं कहूंगा कि मुझे ब्लैककरंट्स पसंद हैं, जिनका मैंने इस ट्यूटोरियल में उल्लेख नहीं किया।

अब आप JavaScript ऐरे के साथ एक विशेषज्ञ की तरह काम करना शुरू करने के लिए तैयार हैं!

  1. जावास्क्रिप्ट array.keys() मेथड जावास्क्रिप्ट array.keys() मेथड

    जावास्क्रिप्ट का array.keys() मेथड एरे की कीज के साथ एक Array Iterator ऑब्जेक्ट लौटाने के लिए उपयोग किया जाता है। सिंटैक्स इस प्रकार है: array.keys() उदाहरण 1 <!DOCTYPE html> <html> <body> <h2>कार वेरिएंट्स</h2> <p id=test></p> <script> var

  1. जावास्क्रिप्ट Array.isArray() मेथड जावास्क्रिप्ट Array.isArray() मेथड

    जावास्क्रिप्ट का Array.isArray() मेथड यह निर्धारित करने के लिए उपयोग किया जाता है कि कोई ऑब्जेक्ट एरे है या नहीं। सिंटैक्स इस प्रकार है: Array.isArray(obj) ऊपर, obj पैरामीटर टेस्ट किया जाने वाला ऑब्जेक्ट है। उदाहरण 1 <!DOCTYPE html> <html> <body> <h2>रैंकिंग पॉइंट्स</

  1. जावास्क्रिप्ट array.flatMap() मेथड जावास्क्रिप्ट array.flatMap() मेथड

    जावास्क्रिप्ट का array.flatMap() मेथड इनपुट एरे एलिमेंट को एक नए एरे में फ्लैट करने के लिए उपयोग किया जाता है। यह पहले प्रत्येक एलिमेंट को मैप फंक्शन का उपयोग करके मैप करता है और फिर परिणाम को एक लेवल तक फ्लैट करता है। सिंटैक्स इस प्रकार है: array.flatMap(function callback(currentValue, index, arra