Nested Destructuring

ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট (Destructuring Assignment) - জাভাস্ক্রিপ্ট ইএস৬ (ES6) - Web Development

293

Nested Destructuring হলো একধরনের ডেস্ট্রাকচারিং যেখানে আপনি অবজেক্ট বা অ্যারে ভিতরের আরেকটি অবজেক্ট বা অ্যারে থেকে ডেটা এক্সট্র্যাক্ট করেন। এটি ES6-এ এসেছে এবং এটি কনভেনশনে একাধিক স্তরের অবজেক্ট বা অ্যারে থেকে প্রয়োজনীয় তথ্য বের করার একটি পরিষ্কার ও সংক্ষিপ্ত পদ্ধতি।


1. Nested Object Destructuring

যখন একটি অবজেক্টের ভিতরে আরেকটি অবজেক্ট থাকে, তখন আপনি nested destructuring ব্যবহার করে ভিতরের অবজেক্টের প্রপার্টি গুলো এক্সট্র্যাক্ট করতে পারেন।

উদাহরণ:

const person = {
  name: "John",
  address: {
    street: "123 Main St",
    city: "New York",
    country: "USA"
  }
};

// Nested destructuring
const { name, address: { street, city } } = person;
console.log(name);    // "John"
console.log(street);  // "123 Main St"
console.log(city);    // "New York"

এখানে, আমরা address অবজেক্ট থেকে street এবং city এক্সট্র্যাক্ট করেছি। name সরাসরি মূল অবজেক্ট থেকে এক্সট্র্যাক্ট করা হয়েছে।


2. Nested Array Destructuring

যদি একটি অ্যারের মধ্যে অন্য একটি অ্যারে থাকে, তাহলে আপনি nested array destructuring ব্যবহার করতে পারেন।

উদাহরণ:

const numbers = [1, [2, 3], 4];

// Nested array destructuring
const [a, [b, c], d] = numbers;
console.log(a);  // 1
console.log(b);  // 2
console.log(c);  // 3
console.log(d);  // 4

এখানে, আমরা অ্যারের দ্বিতীয় উপাদান [2, 3] থেকে b এবং c এক্সট্র্যাক্ট করেছি।


3. Combined Nested Destructuring (Object and Array)

আপনি একযোগে অবজেক্ট এবং অ্যারে উভয়ের ডেস্ট্রাকচারিং করতে পারেন। অর্থাৎ, যদি একটি অবজেক্টের ভিতরে অ্যারে থাকে, বা কোনো অ্যারের ভিতরে অবজেক্ট থাকে, তাহলে আপনি একসঙ্গে তা ডেস্ট্রাক্ট করতে পারবেন।

উদাহরণ:

const data = {
  id: 101,
  name: "Alice",
  items: [
    { name: "Book", price: 10 },
    { name: "Pen", price: 5 }
  ]
};

// Nested destructuring of both object and array
const { name, items: [{ name: item1 }, { name: item2 }] } = data;

console.log(name);    // "Alice"
console.log(item1);   // "Book"
console.log(item2);   // "Pen"

এখানে, প্রথমে আমরা data অবজেক্ট থেকে name প্রপার্টি এক্সট্র্যাক্ট করেছি, তারপর items অ্যারের ভিতরে অবজেক্টগুলো থেকে name প্রপার্টি item1 এবং item2 হিসেবে এক্সট্র্যাক্ট করেছি।


4. Default Values in Nested Destructuring

যখন কোনো অবজেক্ট বা অ্যারে থেকে কোনো প্রপার্টি এক্সট্র্যাক্ট করার সময়, সেই প্রপার্টি উপস্থিত না থাকলে default value ব্যবহার করা যায়।

উদাহরণ:

const person = {
  name: "John",
  address: {
    street: "123 Main St"
    // city is missing
  }
};

// Nested destructuring with default value
const { name, address: { street, city = "Unknown" } } = person;
console.log(name);    // "John"
console.log(street);  // "123 Main St"
console.log(city);    // "Unknown" (default value used)

এখানে, city প্রপার্টি undefined থাকার কারণে "Unknown" ডিফল্ট মান সেট করা হয়েছে।


5. Nested Destructuring with Renaming

Nested destructuring এর মধ্যে আপনি একটি প্রপার্টি বা ভ্যারিয়েবলের নাম পরিবর্তনও করতে পারেন (renaming)।

উদাহরণ:

const user = {
  id: 1,
  profile: {
    firstName: "John",
    lastName: "Doe"
  }
};

// Nested destructuring with renaming
const { profile: { firstName: fName, lastName: lName } } = user;
console.log(fName);  // "John"
console.log(lName);  // "Doe"

এখানে, আমরা firstName এবং lastName এর নাম পরিবর্তন করে fName এবং lName দিয়েছি।


সারাংশ

  • Nested Destructuring ES6-এ অনেক শক্তিশালী একটি ফিচার, যা আপনাকে গভীর (nested) অবজেক্ট এবং অ্যারে থেকে ডেটা এক্সট্র্যাক্ট করতে সহায়তা করে।
  • এটি কোডকে পরিষ্কার এবং আরও পাঠযোগ্য করে তোলে।
  • আপনি একটি অবজেক্টের ভিতরে আরেকটি অবজেক্ট বা অ্যারের উপাদান এক্সট্র্যাক্ট করতে পারেন, এবং একইভাবে অ্যারের ভিতরেও অবজেক্টের উপাদান ডেস্ট্রাক্ট করা সম্ভব।
  • Default values এবং Renaming এর মাধ্যমে ডেস্ট্রাকচারিং আরও লজিকাল এবং সুবিধাজনক হয়ে উঠেছে।

এটি আপনার জাভাস্ক্রিপ্ট কোডিংকে আরও দক্ষ এবং কার্যকরী করে তুলবে।

Content added By
Promotion

Are you sure to start over?

Loading...