जावास्क्रिप्ट में एक कुंजी => मान सरणी को स्टोर करने का सबसे अच्छा तरीका है?


253

key=>valueजावास्क्रिप्ट में एक सरणी को स्टोर करने का सबसे अच्छा तरीका क्या है , और इसके माध्यम से कैसे लूप किया जा सकता है?

प्रत्येक तत्व की कुंजी एक टैग होनी चाहिए, जैसे कि {id}या बस idऔर मूल्य आईडी का संख्यात्मक मान होना चाहिए।

यह या तो एक मौजूदा जावास्क्रिप्ट कक्षा का तत्व होना चाहिए, या एक वैश्विक चर होना चाहिए जिसे आसानी से कक्षा के माध्यम से संदर्भित किया जा सकता है।

jQuery का उपयोग किया जा सकता है।


एक हैश $ के साथ iterated .each नहीं करेगा? यह बहुत मानक है।
कनिष्कनाकिस

18
दुनिया में आप इस सरल बुनियादी कार्य के लिए jQuery का उपयोग क्यों करना चाहते हैं, kincnakakis?
आर्टेम रसाकोवस्की

7
यदि आपका jQuery का उपयोग वैसे भी $ .each के साथ पुनरावृत्ति कर रहा है, तो यह लूप के लिए एक साधारण से बेहतर है।
कनिष्कनाकिस

@kgiannakakis बहुत सरल तर्क है, लेकिन सभी के लिए इतना स्पष्ट नहीं है, जैसा कि यहां देखा जा सकता है। ;-)
sdlins

2
@kgiannakakis या सरणी पर लूप के लिए jQuery का उपयोग करने के बजाय , आप जावास्क्रिप्ट का उपयोग कर सकते हैंArray.prototype.forEach
JoshyRobot

जवाबों:


433

बस यही एक जावास्क्रिप्ट वस्तु है:

var myArray = {id1: 100, id2: 200, "tag with spaces": 300};
myArray.id3 = 400;
myArray["id4"] = 500;

आप इसे माध्यम से लूप का उपयोग कर सकते हैं for..inपाश :

for (var key in myArray) {
  console.log("key " + key + " has value " + myArray[key]);
}

यह भी देखें: वस्तुओं (एमडीएन) के साथ काम करना

ECMAScript6 में भी है Map(वहां ब्राउज़र संगतता तालिका देखें):

  • ऑब्जेक्ट में एक प्रोटोटाइप होता है, इसलिए मैप में डिफ़ॉल्ट कुंजियाँ होती हैं। ES5 के बाद से मैप = Object.create (नल) का उपयोग करके इसे बाईपास किया जा सकता है, लेकिन शायद ही कभी किया गया था।

  • किसी ऑब्जेक्ट की कुंजियाँ स्ट्रिंग्स और सिंबल हैं, जहां वे किसी मैप के लिए कोई भी मूल्य हो सकते हैं।

  • आपको किसी ऑब्जेक्ट के लिए मैन्युअल रूप से ट्रैक रखने के दौरान मानचित्र का आकार आसानी से मिल सकता है।


26
यदि आपका ब्राउज़र इसे (IE9 और ऊपर) का समर्थन करता है, तो पहले खाली ऑब्जेक्ट बनाना var foo = Object.create(null)और फिर उसके साथ गुणों को जोड़ना अधिक सुरक्षित है foo.bar = "baz"। के साथ एक ऑब्जेक्ट बनाना {}इसके बराबर है Object.create(Object.prototype), जिसका अर्थ है कि यह सभी गुणों को प्राप्त करता है Object। आम तौर पर यह कोई समस्या नहीं है, लेकिन यह आपकी वस्तु को अप्रत्याशित चाबियों का कारण बन सकता है अगर कुछ पुस्तकालय ने वैश्विक को संशोधित किया है Object.prototype
रोरी ओ'केन

1
@ RoryO'Kane आप उस के आसपास पाने के लिए hasownproperty का उपयोग कर सकते हैं।

4
@DaMaxContent आप तीन बार बायीं ओर मुड़कर दाएं मुड़ सकते हैं।
कोडरचेत

1
@thenaglecode कभी-कभी 3 बार काम करना छोड़ दिया जाता है। कल्पना कीजिए कि क्या आप सही नहीं कर सकते हैं? या आपको इसे एक से अधिक बार करना था?

लेकिन शायद ओपी एक सरणी चाहता था क्योंकि वस्तुओं के क्रम को ब्राउज़र कार्यान्वयन में लगातार जारी नहीं रखा जा सकता है?
ट्रेनोआसिस

99

अगर मैं तुम्हें सही ढंग से समझा:

var hash = {};
hash['bob'] = 123;
hash['joe'] = 456;

var sum = 0;
for (var name in hash) {
    sum += hash[name];
}
alert(sum); // 579

31

आप मानचित्र का उपयोग कर सकते हैं ।

  • जावास्क्रिप्ट ईएस 6 में एक नई डेटा संरचना शुरू की गई।
  • जावास्क्रिप्ट के लिए वैकल्पिक कुंजी / मूल्य जोड़े के भंडारण के लिए वस्तु।
  • कुंजी / मूल्य जोड़े पर पुनरावृत्ति के लिए उपयोगी तरीके हैं।
var map = new Map();
map.set('name', 'John');
map.set('id', 11);

// Get the full content of the Map
console.log(map); // Map { 'name' => 'John', 'id' => 11 }

कुंजी का उपयोग करके मानचित्र का मूल्य प्राप्त करें

console.log(map.get('name')); // John 
console.log(map.get('id')); // 11

मानचित्र का आकार प्राप्त करें

console.log(map.size); // 2

मैप में चेक की मौजूद है

console.log(map.has('name')); // true
console.log(map.has('age')); // false

कुंजी प्राप्त करें

console.log(map.keys()); // MapIterator { 'name', 'id' }

मान प्राप्त करें

console.log(map.values()); // MapIterator { 'John', 11 }

मानचित्र के तत्व प्राप्त करें

for (let element of map) {
  console.log(element);
}

// Output:
// [ 'name', 'John' ]
// [ 'id', 11 ]

प्रमुख मूल्य जोड़े प्रिंट करें

for (let [key, value] of map) {
  console.log(key + " - " + value);
}

// Output: 
// name - John
// id - 11

मानचित्र की केवल कुंजी प्रिंट करें

for (let key of map.keys()) {
  console.log(key);
}

// Output:
// name
// id

मानचित्र के केवल मान मुद्रित करें

for (let value of map.values()) {
  console.log(value);
}

// Output:
// John
// 11

3
ऐसा लगता है कि यह संगत नहीं है JSON.stringify()
kenorb

11

जावास्क्रिप्ट में एक कुंजी मान सरणी एक वस्तु के रूप में संग्रहीत किया जाता है। जावास्क्रिप्ट में ऐरे के रूप में ऐसी चीजें हैं, लेकिन वे कुछ हद तक अभी भी विचार की जाने वाली वस्तुएं हैं, इस लोगों को जवाब की जांच करें - मैं किसी सरणी में नामित गुणों को क्यों जोड़ सकता हूं जैसे कि यह एक वस्तु थी?

ऐरे को आमतौर पर चौकोर ब्रैकेट सिंटैक्स का उपयोग करके देखा जाता है, और घुंघराले ब्रैकेट सिंटैक्स का उपयोग करते हुए ऑब्जेक्ट्स ("कुंजी => वैल्यू" सरणियों) का उपयोग किया जाता है, हालांकि आप स्क्वायर ब्रैकेट सिंटैक्स का उपयोग करके ऑब्जेक्ट गुण तक पहुँच सकते हैं जैसा कि एलेक्सी रोमानोव ने दिखाया है।

जावास्क्रिप्ट में एरर्स आमतौर पर केवल न्यूमेरिक, ऑटो इंक्रीमेंट कीज़ के साथ उपयोग किए जाते हैं, लेकिन जावास्क्रिप्ट ऑब्जेक्ट्स के नाम प्रमुख वैल्यू पेयर, फ़ंक्शंस और यहां तक ​​कि अन्य ऑब्जेक्ट्स भी रख सकते हैं।

सरल ऐरे।

$(document).ready(function(){

    var countries = ['Canada','Us','France','Italy'];
    console.log('I am from '+countries[0]);
    $.each(countries, function(key, value) {
        console.log(key, value);
    });

});

आउटपुट -

0 "कनाडा"

1 "हमें"

2 "फ्रांस"

3 "इटली"

हम ऊपर देखते हैं कि हम संख्यात्मक अंकों के साथ वर्ग कोष्ठक का उपयोग करके jQuery.each फ़ंक्शन और एक्सेस जानकारी का उपयोग करके एक संख्यात्मक सरणी को लूप कर सकते हैं।

सरल वस्तु (json)

$(document).ready(function(){

    var person = {
        name: "James",
        occupation: "programmer",
        height: {
            feet: 6,
            inches: 1
        },
    }

    console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation);

    $.each(person, function(key, value) {
        console.log(key, value);
    });

});

आउटपुट -

मेरा नाम जेम्स है और मैं 6 फीट 1 प्रोग्रामर हूं

जेम्स का नाम

व्यवसाय प्रोग्रामर

ऊँचाई वस्तु {पैर: 6, इंच: 1}

Php जैसी भाषा में, इसे कुंजी मूल्य जोड़े के साथ एक बहुआयामी सरणी, या एक सरणी में एक सरणी माना जाएगा। मैं मान रहा हूं क्योंकि आपने एक महत्वपूर्ण मूल्य सरणी के माध्यम से लूप करने के बारे में पूछा था कि आप जानना चाहते हैं कि किसी वस्तु (कुंजी => मान सरणी) को कैसे प्राप्त किया जाए, जैसे कि ऊपर दिए गए व्यक्ति की वस्तु, चलो कहते हैं, एक से अधिक व्यक्ति।

खैर, अब जब हम जानते हैं कि जावास्क्रिप्ट सरणियों का उपयोग आम तौर पर संख्यात्मक अनुक्रमण के लिए किया जाता है और वस्तुओं को अनुक्रमणिका अनुक्रमण के लिए अधिक लचीले रूप से उपयोग किया जाता है, हम उन वस्तुओं का एक सरणी बनाने के लिए एक साथ उपयोग करेंगे जिन्हें हम लूप कर सकते हैं, जैसे -

JSON सरणी (ऑब्जेक्ट्स का सरणी) -

$(document).ready(function(){

    var people = [
        {
            name: "James",
            occupation: "programmer",
            height: {
                feet: 6,
                inches: 1
            }
        }, {
            name: "Peter",
            occupation: "designer",
            height: {
                feet: 4,
                inches: 10
            }
        }, {
            name: "Joshua",
            occupation: "CEO",
            height: {
                feet: 5,
                inches: 11
            }
        }
    ];

    console.log("My name is "+people[2].name+" and I am a "+people[2].height.feet+" ft "+people[2].height.inches+" "+people[2].occupation+"\n");

    $.each(people, function(key, person) {
        console.log("My name is "+person.name+" and I am a "+person.height.feet+" ft "+person.height.inches+" "+person.occupation+"\n");
    });

});

आउटपुट -

मेरा नाम जोशुआ है और मैं 5 फीट 11 सीईओ हूं

मेरा नाम जेम्स है और मैं 6 फीट 1 प्रोग्रामर हूं

मेरा नाम पीटर है और मैं एक 4 फीट 10 डिजाइनर हूं

मेरा नाम जोशुआ है और मैं 5 फीट 11 सीईओ हूं

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


अच्छी तरह से समझाया मुझे एक समस्या को ठीक करने में मदद करता है जहां मैं ऊंचाइयों पर कब्जा करने के लिए कुछ का निर्माण कर रहा था।
प्रणय

3

एक सरणी के अंदर वस्तुएं:

var cars = [
        { "id": 1, brand: "Ferrari" }
        , { "id": 2, brand: "Lotus" }
        , { "id": 3, brand: "Lamborghini" }
    ];


0

मुझे इसका पता है लेकिन यह उन लोगों के लिए मददगार हो सकता है जो अन्य तरीके चाहते हैं। एक और तरीका सरणी कुंजी => मूल्यों को संग्रहीत किया जा सकता है, मानचित्र नामक सरणी विधि () का उपयोग करके; ( https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map ) आप तीर फ़ंक्शन का भी उपयोग कर सकते हैं

 
    var countries = ['Canada','Us','France','Italy'];  
// Arrow Function
countries.map((value, key) => key+ ' : ' + value );
// Anonomous Function
countries.map(function(value, key){
return key + " : " + value;
});


-11

आज हमने लारवेल-ब्लेड-जावास्क्रिप्ट नामक अपना नया पैकेज जारी किया। यह आपको जावास्क्रिप्ट चर को जावास्क्रिप्ट में निर्यात करने के लिए एक जावास्क्रिप्ट ब्लेड निर्देश प्रदान करता है। तो यह मूल रूप से जेफरी वे के लोकप्रिय PHP-Vars-To-Js- ट्रांसफार्मर पैकेज के रूप में ही करता है, लेकिन नियंत्रक में निर्यात चर के बजाय हमारे पैकेज इसे एक दृश्य करता है।

यहाँ इसका उपयोग कैसे किया जा सकता है इसका एक उदाहरण दिया गया है:

@javascript('key', 'value')

प्रस्तुत दृश्य आउटपुट देगा:

<script type="text/javascript">window['key'] = 'value';</script>

तो आपके ब्राउज़र में अब आपके पास एक मुख्य चर तक पहुंच है:

console.log(key); //outputs "value"

आप एकल तर्क का भी उपयोग कर सकते हैं:

@javascript(['key' => 'value'])

जो पहले उदाहरण के समान आउटपुट देगा।

आप एक नेमस्पेस सेट करने के लिए कॉन्फ़िग फ़ाइल का भी उपयोग कर सकते हैं, जहाँ सभी निर्यात किए गए जावास्क्रिप्ट चर का निवास होना चाहिए।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.