प्रारंभिक
जावास्क्रिप्ट में केवल एक डेटा प्रकार होता है जिसमें कई मान हो सकते हैं: ऑब्जेक्ट । एक ऐरे वस्तु का एक विशेष रूप है।
(सादा) वस्तुओं का रूप होता है
{key: value, key: value, ...}
अर्र्स का रूप है
[value, value, ...]
दोनों सरणियाँ और ऑब्जेक्ट एक key -> valueसंरचना को उजागर करते हैं। किसी सरणी में कुंजियां संख्यात्मक होनी चाहिए, जबकि किसी भी स्ट्रिंग का उपयोग ऑब्जेक्ट में कुंजी के रूप में किया जा सकता है। कुंजी-मूल्य जोड़े को "गुण" भी कहा जाता है ।
संपत्तियों को या तो डॉट नोटेशन का उपयोग करके एक्सेस किया जा सकता है
const value = obj.someProperty;
या ब्रैकेट संकेतन , अगर संपत्ति का नाम मान्य जावास्क्रिप्ट पहचानकर्ता नाम नहीं होगा [कल्पना] , या नाम एक चर का मूल्य है:
// the space is not a valid character in identifier names
const value = obj["some Property"];
// property name as variable
const name = "some Property";
const value = obj[name];
उस कारण से, सरणी तत्वों को केवल ब्रैकेट नोटेशन का उपयोग करके एक्सेस किया जा सकता है:
const value = arr[5]; // arr.5 would be a syntax error
// property name / index as variable
const x = 5;
const value = arr[x];
रुको ... JSON के बारे में क्या?
JSON XML, YAML, CSV और अन्य की तरह डेटा का एक पाठीय प्रतिनिधित्व है। इस तरह के डेटा के साथ काम करने के लिए, इसे पहले जावास्क्रिप्ट डेटा प्रकारों, यानी सरणियों और वस्तुओं में बदलना होगा (और उन लोगों के साथ कैसे काम करना है, यह अभी समझाया गया है)। पार्स JSON के जावास्क्रिप्ट में JSON को कैसे समझा जाए ? ।
आगे पढ़ने की सामग्री
सरणियों और वस्तुओं तक कैसे पहुंचा जाए, यह मूलभूत जावास्क्रिप्ट ज्ञान है और इसलिए एमडीएन जावास्क्रिप्ट गाइड , विशेषकर वर्गों को पढ़ना उचित है
नेस्टेड डेटा संरचनाओं तक पहुँचना
एक नेस्टेड डेटा संरचना एक सरणी या ऑब्जेक्ट है जो अन्य सरणियों या वस्तुओं को संदर्भित करता है, अर्थात इसके मान सरणियाँ या ऑब्जेक्ट हैं। इस तरह के ढांचे को लगातार डॉट या ब्रैकेट अंकन द्वारा पहुँचा जा सकता है।
यहाँ एक उदाहरण है:
const data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
चलो मान लेते हैं कि हम nameदूसरी वस्तु तक पहुंचना चाहते हैं ।
यहाँ हम इसे चरण-दर-चरण कैसे कर सकते हैं:
जैसा कि हम देख सकते हैं dataकि एक ऑब्जेक्ट है, इसलिए हम डॉट नोटेशन का उपयोग करके इसके गुणों तक पहुंच सकते हैं। itemsसंपत्ति के रूप में निम्नानुसार पहुंचा जा सकता है:
data.items
मान एक सरणी है, इसके दूसरे तत्व तक पहुंचने के लिए, हमें ब्रैकेट नोटेशन का उपयोग करना होगा:
data.items[1]
यह मान एक वस्तु है और हम nameसंपत्ति तक पहुंचने के लिए फिर से डॉट नोटेशन का उपयोग करते हैं। तो हम अंततः प्राप्त करते हैं:
const item_name = data.items[1].name;
वैकल्पिक रूप से, हम किसी भी गुण के लिए ब्रैकेट नोटेशन का उपयोग कर सकते थे, खासकर अगर नाम में ऐसे अक्षर शामिल थे जो इसे डॉट नोटेशन उपयोग के लिए अमान्य बना देते थे:
const item_name = data['items'][1]['name'];
मैं एक संपत्ति का उपयोग करने की कोशिश कर रहा हूं, लेकिन मुझे केवल undefinedवापस मिलेगा ?
जब आप प्राप्त कर रहे होते हैं undefined, तो अधिकांश वस्तु / सरणी में बस उस नाम की कोई संपत्ति नहीं होती है।
const foo = {bar: {baz: 42}};
console.log(foo.baz); // undefined
ऑब्जेक्ट / सरणी की संरचना का उपयोग करें console.logया console.dirनिरीक्षण करें। आप जिस संपत्ति तक पहुंचने की कोशिश कर रहे हैं, वह वास्तव में एक नेस्टेड ऑब्जेक्ट / सरणी पर परिभाषित हो सकती है।
console.log(foo.bar.baz); // 42
क्या होगा यदि संपत्ति के नाम गतिशील हैं और मैं उन्हें पहले से नहीं जानता हूं?
संपत्ति के नाम अज्ञात हैं या हम एक वस्तु के सभी गुण का उपयोग करना चाहते हैं / एक सरणी के तत्वों, हम उपयोग कर सकते हैं for...in [MDN] वस्तुओं के लिए लूप और for [MDN] सभी गुण / तत्वों पर पुनरावृति करने सरणियों के लिए पाश।
वस्तुओं
के सभी गुणों पर पुनरावृति करने के लिए data, हम इस तरह से ऑब्जेक्ट पर पुनरावृति कर सकते हैं :
for (const prop in data) {
// `prop` contains the name of each property, i.e. `'code'` or `'items'`
// consequently, `data[prop]` refers to the value of each property, i.e.
// either `42` or the array
}
ऑब्जेक्ट कहाँ से आता है (और आप क्या करना चाहते हैं) पर निर्भर करते हुए, आपको प्रत्येक पुनरावृत्ति में परीक्षण करना पड़ सकता है कि क्या संपत्ति वास्तव में ऑब्जेक्ट की संपत्ति है, या यह एक विरासत में मिली संपत्ति है। आप इसे Object#hasOwnProperty [एमडीएन] के साथ कर सकते हैं ।
करने के लिए विकल्प के रूप में for...inके साथ hasOwnProperty, आप उपयोग कर सकते हैं Object.keys [MDN] एक पाने के लिए संपत्ति के नाम की सरणी :
Object.keys(data).forEach(function(prop) {
// `prop` is the property name
// `data[prop]` is the property value
});
Arrays
data.items सरणी के सभी तत्वों पर पुनरावृति करने के लिए , हम एक forलूप का उपयोग करते हैं :
for(let i = 0, l = data.items.length; i < l; i++) {
// `i` will take on the values `0`, `1`, `2`,..., i.e. in each iteration
// we can access the next element in the array with `data.items[i]`, example:
//
// var obj = data.items[i];
//
// Since each element is an object (in our example),
// we can now access the objects properties with `obj.id` and `obj.name`.
// We could also use `data.items[i].id`.
}
कोई भी for...inसरणियों पर पुनरावृत्त करने के लिए उपयोग कर सकता है , लेकिन ऐसे कारण हैं जिनसे इसे बचा जाना चाहिए: जावास्क्रिप्ट में बुरे व्यवहार पर विचार करने वाले सरणियों के साथ 'फॉर (लिस्ट में var आइटम) क्यों है? ।
ECMAScript 5 के बढ़ते ब्राउज़र समर्थन के साथ, सरणी विधि forEach [MDN] एक दिलचस्प विकल्प भी बन जाती है:
data.items.forEach(function(value, index, array) {
// The callback is executed for each element in the array.
// `value` is the element itself (equivalent to `array[index]`)
// `index` will be the index of the element in the array
// `array` is a reference to the array itself (i.e. `data.items` in this case)
});
ES2015 (ES6) का समर्थन करने वाले वातावरण में, आप [MDN] लूप का उपयोग कर सकते हैं , जो न केवल सरणियों के लिए काम करता है, बल्कि किसी भी चलने योग्य के लिए :for...of
for (const item of data.items) {
// `item` is the array element, **not** the index
}
प्रत्येक पुनरावृत्ति में, for...ofसीधे हमें पुनरावृत्ति का अगला तत्व देता है, उपयोग या उपयोग करने के लिए कोई "सूचकांक" नहीं है।
क्या होगा यदि डेटा संरचना की "गहराई" मेरे लिए अज्ञात है?
अज्ञात कुंजियों के अलावा, डेटा संरचना की "गहराई" (अर्थात कितनी नेस्टेड ऑब्जेक्ट) है, यह अज्ञात भी हो सकता है। गहरी नेस्टेड गुणों तक कैसे पहुंचें, आमतौर पर सटीक डेटा संरचना पर निर्भर करता है।
लेकिन अगर डेटा संरचना में दोहराए जाने वाले पैटर्न होते हैं, उदाहरण के लिए, एक बाइनरी ट्री का प्रतिनिधित्व, समाधान में आमतौर पर डेटा संरचना के प्रत्येक स्तर तक पुनरावर्ती [विकिपीडिया] का उपयोग शामिल है।
एक बाइनरी ट्री का पहला लीफ नोड प्राप्त करने के लिए यहां एक उदाहरण दिया गया है:
function getLeaf(node) {
if (node.leftChild) {
return getLeaf(node.leftChild); // <- recursive call
}
else if (node.rightChild) {
return getLeaf(node.rightChild); // <- recursive call
}
else { // node must be a leaf node
return node;
}
}
const first_leaf = getLeaf(root);
const root = {
leftChild: {
leftChild: {
leftChild: null,
rightChild: null,
data: 42
},
rightChild: {
leftChild: null,
rightChild: null,
data: 5
}
},
rightChild: {
leftChild: {
leftChild: null,
rightChild: null,
data: 6
},
rightChild: {
leftChild: null,
rightChild: null,
data: 7
}
}
};
function getLeaf(node) {
if (node.leftChild) {
return getLeaf(node.leftChild);
} else if (node.rightChild) {
return getLeaf(node.rightChild);
} else { // node must be a leaf node
return node;
}
}
console.log(getLeaf(root).data);
अज्ञात कुंजी और गहराई के साथ नेस्टेड डेटा संरचना तक पहुंचने के लिए एक अधिक सामान्य तरीका मूल्य के प्रकार का परीक्षण करना और तदनुसार कार्य करना है।
यहां एक उदाहरण है जो किसी नेस्टेड डेटा संरचना के अंदर सभी आदिम मूल्यों को एक सरणी में जोड़ता है (यह मानते हुए कि इसमें कोई फ़ंक्शन नहीं है)। यदि हम एक वस्तु (या सरणी) का सामना करते हैं तो हम बस toArrayउस मूल्य (पुनरावर्ती कॉल) पर फिर से कॉल करते हैं।
function toArray(obj) {
const result = [];
for (const prop in obj) {
const value = obj[prop];
if (typeof value === 'object') {
result.push(toArray(value)); // <- recursive call
}
else {
result.push(value);
}
}
return result;
}
const data = {
code: 42,
items: [{
id: 1,
name: 'foo'
}, {
id: 2,
name: 'bar'
}]
};
function toArray(obj) {
const result = [];
for (const prop in obj) {
const value = obj[prop];
if (typeof value === 'object') {
result.push(toArray(value));
} else {
result.push(value);
}
}
return result;
}
console.log(toArray(data));
सहायकों
चूंकि एक जटिल वस्तु या सरणी की संरचना आवश्यक रूप से स्पष्ट नहीं है, हम आगे बढ़ने के तरीके के बारे में निर्णय करने के लिए प्रत्येक चरण में मूल्य का निरीक्षण कर सकते हैं। console.log [एमडीएन] और console.dir [एमडीएन] हमें ऐसा करने में मदद करते हैं। उदाहरण के लिए (क्रोम कंसोल का आउटपुट):
> console.log(data.items)
[ Object, Object ]
यहाँ हम देखते हैं कि data.itemsदो तत्वों के साथ एक सरणी है जो दोनों वस्तुएं हैं। क्रोम कंसोल में ऑब्जेक्ट्स का विस्तार और निरीक्षण भी तुरंत किया जा सकता है।
> console.log(data.items[1])
Object
id: 2
name: "bar"
__proto__: Object
यह हमें बताता है कि data.items[1]एक वस्तु है, और इसे विस्तारित करने के बाद हम देखते हैं कि इसमें तीन गुण हैं id, nameऔर __proto__। उत्तरार्द्ध एक आंतरिक संपत्ति है जिसका उपयोग ऑब्जेक्ट की प्रोटोटाइप श्रृंखला के लिए किया जाता है। प्रोटोटाइप श्रृंखला और विरासत इस जवाब के लिए गुंजाइश से बाहर है, हालांकि।