preliminaries
জাভাস্ক্রিপ্টের একমাত্র ডেটা টাইপ রয়েছে যাতে একাধিক মান থাকতে পারে: অবজেক্ট । একটি অ্যারে অবজেক্টের একটি বিশেষ ফর্ম।
(সরল) অবজেক্টগুলির ফর্ম রয়েছে
{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];
অপেক্ষা করুন ... জেএসওনের কী হবে?
জেএসএন হ'ল এক্সএমএল, ওয়াইএএমএল, সিএসভি এবং অন্যান্যদের মতো ডেটাগুলির পাঠ্য উপস্থাপনা। এই জাতীয় ডেটা নিয়ে কাজ করার জন্য, প্রথমে এটি জাভাস্ক্রিপ্ট ডেটা ধরণের, যেমন অ্যারে এবং অবজেক্টগুলিতে রূপান্তর করতে হবে (এবং কীভাবে কীভাবে এটি ব্যাখ্যা করা হয়েছিল) explained 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
}
বস্তুটি কোথা থেকে এসেছে (এবং আপনি কী করতে চান) তার উপর নির্ভর করে আপনাকে প্রতিটি পুনরাবৃত্তিতে পরীক্ষা করতে হবে সম্পত্তিটি আসলে বস্তুর সম্পত্তি, না এটি উত্তরাধিকার সূত্রে প্রাপ্ত সম্পত্তি is আপনি Object#hasOwnProperty [MDN] এর সাথে এটি করতে পারেন ।
বিকল্প হিসাবে for...inসঙ্গে hasOwnProperty, আপনি ব্যবহার করতে পারেন Object.keys [MDN] একটি পেতে অবস্থায় বৈশিষ্টগুলির নাম অ্যারে :
Object.keys(data).forEach(function(prop) {
// `prop` is the property name
// `data[prop]` is the property value
});
অ্যারেগুলির
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অ্যারেগুলিতে পুনরাবৃত্তি করতেও ব্যবহার করতে পারে তবে এর কারণগুলি এড়ানো উচিত কারণগুলি: জাভাস্ক্রিপ্টে অ্যারেগুলি খারাপ অনুশীলন হিসাবে বিবেচিত অ্যারের সাথে কেন 'তালিকার ক্ষেত্রে (আইটেমের জন্য)' কেন? ।
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 [এমডিএন] এটি করতে আমাদের সহায়তা করে। উদাহরণস্বরূপ (Chrome কনসোলের আউটপুট):
> 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__। পরেরটি হ'ল অভ্যন্তরীণ সম্পত্তি যা অবজেক্টটির প্রোটোটাইপ চেইনের জন্য ব্যবহৃত হয়। প্রোটোটাইপ চেইন এবং উত্তরাধিকার যদিও এই উত্তরের সুযোগের বাইরে নয়।