Skill

ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট (Destructuring Assignment)

জাভাস্ক্রিপ্ট ইএস৬ (ES6) - Web Development

359

ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট (Destructuring Assignment) ES6 এর একটি শক্তিশালী ফিচার, যা আপনাকে অ্যারে বা অবজেক্ট থেকে ডেটা বের করে নিয়ে সহজে ভ্যারিয়েবলে অ্যাসাইন করার সুবিধা দেয়। এটি কোডকে আরও সহজ, পরিষ্কার এবং পড়তে সহজ করে তোলে।

ডেস্ট্রাকচারিং এর মাধ্যমে আপনি একাধিক মান (values) বা প্রপার্টি (properties) কে একসাথে একাধিক ভ্যারিয়েবলে অ্যাসাইন করতে পারেন।


১. অ্যারে ডেস্ট্রাকচারিং (Array Destructuring)

অ্যারে ডেস্ট্রাকচারিংয়ের মাধ্যমে অ্যারের উপাদানগুলোকে একাধিক ভ্যারিয়েবলে সহজেই অ্যাসাইন করা যায়।

উদাহরণ:

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

// ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট
const [first, second, third] = numbers;

console.log(first);  // 1
console.log(second); // 2
console.log(third);  // 3

এখানে, অ্যারের প্রথম তিনটি উপাদান first, second এবং third ভ্যারিয়েবলে অ্যাসাইন করা হয়েছে।

আরও উদাহরণ:

const numbers = [10, 20, 30];

// অ্যারে ডেস্ট্রাকচারিং এর মাধ্যমে কিছু উপাদান বাদ দেয়া
const [first, , third] = numbers;  // দ্বিতীয় উপাদানটি বাদ দেয়া

console.log(first);  // 10
console.log(third);  // 30

এখানে, দ্বিতীয় উপাদানটি বাদ দিয়ে প্রথম এবং তৃতীয় উপাদানগুলোর মান নেয়ার জন্য একটি শূন্য জায়গা ব্যবহার করা হয়েছে।

ডিফল্ট মান ব্যবহার:

const numbers = [1];

// যদি কোনো মান না থাকে, তাহলে ডিফল্ট মান অ্যাসাইন হবে
const [first, second = 10] = numbers;

console.log(first);   // 1
console.log(second);  // 10 (ডিফল্ট মান)

২. অবজেক্ট ডেস্ট্রাকচারিং (Object Destructuring)

অবজেক্ট ডেস্ট্রাকচারিং এর মাধ্যমে আপনি অবজেক্টের প্রপার্টি গুলিকে ভ্যারিয়েবলে সরাসরি অ্যাসাইন করতে পারেন।

উদাহরণ:

const person = {
  name: "John",
  age: 30,
  country: "USA"
};

// অবজেক্ট ডেস্ট্রাকচারিং
const { name, age, country } = person;

console.log(name);    // "John"
console.log(age);     // 30
console.log(country); // "USA"

এখানে, অবজেক্টের প্রপার্টি name, age এবং country ভ্যারিয়েবলে অ্যাসাইন করা হয়েছে। উল্লেখযোগ্য যে, ডেস্ট্রাকচারিংয়ে, ভ্যারিয়েবলের নাম অবশ্যই অবজেক্টের প্রপার্টির নামের সাথে মিলতে হবে।

প্রপার্টির নাম পরিবর্তন করা:

const person = {
  name: "John",
  age: 30
};

// প্রপার্টির নাম পরিবর্তন করা
const { name: fullName, age: yearsOld } = person;

console.log(fullName);  // "John"
console.log(yearsOld);  // 30

এখানে, name এবং age এর মানকে নতুন ভ্যারিয়েবল fullName এবং yearsOld এ অ্যাসাইন করা হয়েছে।

ডিফল্ট মান ব্যবহার:

const person = {
  name: "John"
};

// যদি কোনো প্রপার্টি না থাকে, তাহলে ডিফল্ট মান অ্যাসাইন হবে
const { name, age = 25 } = person;

console.log(name);  // "John"
console.log(age);   // 25 (ডিফল্ট মান)

এখানে, age প্রপার্টি অবজেক্টে নেই, তাই age ভ্যারিয়েবলে ডিফল্ট মান ২৫ অ্যাসাইন করা হয়েছে।


৩. Nested (অবজেক্ট বা অ্যারের মধ্যে অবজেক্ট বা অ্যারে)

ডেস্ট্রাকচারিংয়ের মাধ্যমে আপনি নেস্টেড অবজেক্ট বা অ্যারে থেকেও মান বের করতে পারেন।

নেস্টেড অ্যারে ডেস্ট্রাকচারিং:

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

// নেস্টেড অ্যারে ডেস্ট্রাকচারিং
const [first, [second, third], fourth] = numbers;

console.log(first);   // 1
console.log(second);  // 2
console.log(third);   // 3
console.log(fourth);  // 4

নেস্টেড অবজেক্ট ডেস্ট্রাকচারিং:

const person = {
  name: "John",
  address: {
    city: "New York",
    zip: "10001"
  }
};

// নেস্টেড অবজেক্ট ডেস্ট্রাকচারিং
const { name, address: { city, zip } } = person;

console.log(name);  // "John"
console.log(city);  // "New York"
console.log(zip);   // "10001"

এখানে, address অবজেক্টের ভিতর থেকে city এবং zip প্রপার্টি ডেস্ট্রাকচারিং করা হয়েছে।


৪. ফাংশন আর্গুমেন্ট হিসেবে ডেস্ট্রাকচারিং

ফাংশনে ডেস্ট্রাকচারিং প্যারামিটার হিসেবে ব্যবহার করা যেতে পারে। এটি কোডকে আরও পরিষ্কার এবং সহজ করতে সাহায্য করে।

উদাহরণ:

function displayPerson({ name, age }) {
  console.log(`Name: ${name}, Age: ${age}`);
}

const person = {
  name: "John",
  age: 30
};

displayPerson(person);  // "Name: John, Age: 30"

এখানে, ফাংশনের প্যারামিটার হিসাবে ডেস্ট্রাকচারিং ব্যবহার করা হয়েছে, যাতে অবজেক্টের প্রপার্টি সরাসরি ভ্যারিয়েবল name এবং age হিসেবে অ্যাসাইন করা যায়।


ডেস্ট্রাকচারিং অ্যাসাইনমেন্ট ES6 এর একটি অত্যন্ত শক্তিশালী ফিচার, যা অ্যারে এবং অবজেক্ট থেকে ডেটা সহজে বের করে এনে ভ্যারিয়েবলে অ্যাসাইন করার সুবিধা দেয়। এটি কোডকে আরও সংক্ষিপ্ত, পরিষ্কার এবং পড়তে সহজ করে তোলে, এবং প্রোগ্রামিংয়ে আরও কার্যকরী হয়ে ওঠে।

Content added By

Array Destructuring ES6 (ECMAScript 2015) এর একটি শক্তিশালী বৈশিষ্ট্য যা আপনাকে সহজে অ্যারে (Array) থেকে মান (values) বের করতে সাহায্য করে। এর মাধ্যমে অ্যারের উপাদানগুলোকে আলাদা ভ্যারিয়েবলে অ্যাসাইন করা যায় একাধিক লাইন কোড লেখা ছাড়াই।

এই ফিচারটি কোডকে আরো সংক্ষিপ্ত, পরিষ্কার এবং পড়তে সহজ করে তোলে। Array Destructuring এর মাধ্যমে আপনি অ্যারের নির্দিষ্ট উপাদানগুলোকে ভ্যারিয়েবলে সরাসরি ডিক্লেয়ার করে নিতে পারেন।


Array Destructuring এর মৌলিক সিনট্যাক্স

Array Destructuring এর মৌলিক সিনট্যাক্স হলো:

const [variable1, variable2, variable3] = array;

এখানে, array হল যে অ্যারে থেকে আপনি মান গুলো বের করতে চান, এবং variable1, variable2, variable3 হল সেই মান গুলোকে সংরক্ষণ করতে ব্যবহৃত ভ্যারিয়েবল।

উদাহরণ:

const numbers = [1, 2, 3];

const [a, b, c] = numbers;

console.log(a);  // 1
console.log(b);  // 2
console.log(c);  // 3

এখানে, অ্যারে numbers এর মানগুলো সরাসরি ভ্যারিয়েবল a, b, এবং c তে অ্যাসাইন করা হয়েছে।


Array Destructuring এর অগ্রাধিকার

  1. অ্যারে থেকে নির্দিষ্ট মান বের করা
    আপনি যদি অ্যারের কিছু নির্দিষ্ট উপাদানকে চয়েস করতে চান, তবে আপনি ডেস্ট্রাকচারিংয়ের মাধ্যমে শুধুমাত্র প্রয়োজনীয় উপাদানগুলো বের করে নিতে পারেন।

    উদাহরণ:

    const numbers = [10, 20, 30, 40];
    
    const [x, , z] = numbers;  // শুধু প্রথম এবং তৃতীয় উপাদান নিয়ে আসা
    
    console.log(x);  // 10
    console.log(z);  // 30
    

    এখানে, আমরা দ্বিতীয় উপাদানটিকে বাদ দিয়েছি (এটা দুটি কমা , দিয়ে চিহ্নিত করা হয়েছে), এবং শুধুমাত্র প্রথম এবং তৃতীয় উপাদানগুলোকে ভ্যারিয়েবলে অ্যাসাইন করেছি।

  2. ডিফল্ট মান প্রদান
    যদি অ্যারে এর কোনো উপাদান undefined থাকে বা না থাকে, তবে আপনি ডিফল্ট মান নির্ধারণ করতে পারেন।

    উদাহরণ:

    const numbers = [10, , 30];
    
    const [a, b = 20, c] = numbers;
    
    console.log(a);  // 10
    console.log(b);  // 20 (দ্বিতীয় উপাদানটি অনুপস্থিত, তাই ডিফল্ট মান ২০ নেওয়া হয়েছে)
    console.log(c);  // 30
    

    এখানে, দ্বিতীয় উপাদানটি অ্যারে তে নেই, তাই b এর জন্য ডিফল্ট মান 20 ব্যবহার করা হয়েছে।

  3. Rest Parameters
    আপনি Rest Parameters ব্যবহার করে অবশিষ্ট উপাদানগুলোকে একটি অ্যারে হিসেবে সংগ্রহ করতে পারেন। এটি ... সিম্বল দ্বারা চিহ্নিত করা হয়।

    উদাহরণ:

    const numbers = [1, 2, 3, 4, 5];
    
    const [first, second, ...rest] = numbers;
    
    console.log(first);  // 1
    console.log(second);  // 2
    console.log(rest);    // [3, 4, 5]
    

    এখানে, first এবং second এর জন্য প্রথম দুটি উপাদান অ্যাসাইন করা হয়েছে, এবং বাকি উপাদানগুলো rest ভ্যারিয়েবলে একটি অ্যারে হিসেবে একত্রিত হয়ে গেছে।


Array Destructuring এর ব্যবহারিক উদাহরণ

  1. ফাংশনের আর্গুমেন্টস থেকে অ্যারে ডেস্ট্রাকচারিং

    আপনি ফাংশনের আর্গুমেন্টস হিসেবেও অ্যারে ডেস্ট্রাকচারিং ব্যবহার করতে পারেন। এটি যখন কোনো ফাংশন অ্যারে পাস করে, তখন খুবই কার্যকরী।

    উদাহরণ:

    function getCoordinates() {
      return [10, 20];
    }
    
    const [x, y] = getCoordinates();
    
    console.log(x);  // 10
    console.log(y);  // 20
    

    এখানে, getCoordinates() ফাংশনটি একটি অ্যারে ফেরত দেয়, এবং আমরা Array Destructuring ব্যবহার করে তা সরাসরি ভ্যারিয়েবল x এবং y তে অ্যাসাইন করেছি।

  2. অ্যারে অবজেক্টে ডেস্ট্রাকচারিং

    অ্যারের মধ্যে যদি অবজেক্ট থাকে, তাহলে আপনি তাদেরও ডেস্ট্রাকচার করতে পারেন।

    উদাহরণ:

    const user = [
      { name: "John", age: 30 },
      { name: "Doe", age: 25 }
    ];
    
    const [{ name: name1 }, { age: age2 }] = user;
    
    console.log(name1);  // John
    console.log(age2);   // 25
    

    এখানে, আমরা user অ্যারের মধ্যে দুটি অবজেক্ট থেকে name এবং age ডেস্ট্রাকচার করেছি।


Array Destructuring এর সুবিধা

  1. কোডের আকার ছোট করা:
    অ্যারে থেকে ভ্যালু এক্সট্র্যাক্ট করতে দীর্ঘ কোডের পরিবর্তে কম কোডে কাজ করা যায়।
  2. বিনোদনমূলক (Readable) কোড:
    কোড আরও পরিষ্কার, সহজবোধ্য এবং সহজে বুঝতে পারা যায়।
  3. ডিফল্ট মান এবং Rest Parameters:
    আপনি সহজে ডিফল্ট মান এবং বাকি উপাদানগুলো একত্রিত করতে পারেন, যা অনেক সময় কোডের প্রয়োজনীয়তা পূরণ করতে সাহায্য করে।

সারাংশ
Array Destructuring ES6 এর একটি শক্তিশালী এবং কার্যকরী ফিচার, যা অ্যারের উপাদানগুলোকে সরাসরি ভ্যারিয়েবলে অ্যাসাইন করতে সাহায্য করে। এটি কোডের আকার ছোট এবং পরিষ্কার করে, এবং default values, rest parameters সহ বিভিন্ন সুবিধা প্রদান করে।

Content added By

Object Destructuring ES6 এর একটি নতুন ফিচার, যা অবজেক্টের প্রপার্টি গুলোর মানকে পৃথক ভ্যারিয়েবলে সরাসরি অ্যাসাইন করার একটি সহজ পদ্ধতি প্রদান করে। এর মাধ্যমে কোড অনেক বেশি পরিষ্কার এবং সংক্ষিপ্ত হয়।


Object Destructuring এর সিনট্যাক্স

Object Destructuring এর সাধারণ সিনট্যাক্স হলো:

const { property1, property2 } = object;

এখানে, object হচ্ছে যে অবজেক্ট থেকে আপনি প্রপার্টি গুলো আনতে চান, এবং property1, property2 হচ্ছে সেই অবজেক্টের প্রপার্টি নাম।

উদাহরণ:

const person = {
  name: "John",
  age: 30,
  city: "New York"
};

const { name, age } = person;

console.log(name);  // "John"
console.log(age);   // 30

এখানে, person অবজেক্ট থেকে name এবং age প্রপার্টি পৃথক ভ্যারিয়েবলে ডেস্ট্রাকচার করা হয়েছে।


Object Destructuring এ Default Value

যদি ডেস্ট্রাকচারের সময় কোনো প্রপার্টি অবজেক্টে না থাকে, তবে আপনি default value সেট করতে পারেন। এটি তখন ব্যবহৃত হবে যদি ঐ প্রপার্টি অবজেক্টে উপস্থিত না থাকে।

উদাহরণ:

const person = {
  name: "John",
  age: 30
};

const { name, age, city = "Unknown" } = person;

console.log(name);  // "John"
console.log(age);   // 30
console.log(city);  // "Unknown" (যেহেতু `city` অবজেক্টে নেই, তাই default value ব্যবহার হবে)

এখানে, city প্রপার্টি অবজেক্টে না থাকলে "Unknown" ডিফল্ট মান হিসেবে অ্যাসাইন হবে।


Object Destructuring এর জন্য Aliases (Renaming)

যদি আপনি কোন প্রপার্টির নাম পরিবর্তন করে অন্য নাম দিয়ে ভ্যারিয়েবল ডিফাইন করতে চান, তাহলে আপনি alias ব্যবহার করতে পারেন। এটি প্রপার্টির নামের পরিবর্তে একটি নতুন নামের মাধ্যমে সেই প্রপার্টি অ্যাক্সেস করতে সাহায্য করে।

উদাহরণ:

const person = {
  name: "John",
  age: 30
};

const { name: fullName, age: years } = person;

console.log(fullName);  // "John"
console.log(years);     // 30

এখানে, name প্রপার্টি fullName নামে এবং age প্রপার্টি years নামে রিনেম করা হয়েছে।


Nested Object Destructuring

যখন অবজেক্টের মধ্যে আরেকটি অবজেক্ট থাকে (nested objects), তখন আপনি nested object গুলোকেও ডেস্ট্রাকচার করতে পারেন।

উদাহরণ:

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

const { name, address: { city, country } } = person;

console.log(name);    // "John"
console.log(city);    // "New York"
console.log(country); // "USA"

এখানে, address অবজেক্টের মধ্যে থাকা city এবং country প্রপার্টি আলাদাভাবে ডেস্ট্রাকচার করা হয়েছে।


Rest Pattern (Collecting Remaining Properties)

Rest Pattern ব্যবহার করে আপনি অবজেক্টের বাকি প্রপার্টিগুলোকে একটি একক অবজেক্টে জড়ো করতে পারেন। এটি সাধারণত ডেস্ট্রাকচারিং এর পর অবশিষ্ট প্রপার্টি সংগ্রহ করতে ব্যবহৃত হয়।

উদাহরণ:

const person = {
  name: "John",
  age: 30,
  city: "New York",
  country: "USA"
};

const { name, age, ...address } = person;

console.log(name);     // "John"
console.log(age);      // 30
console.log(address);  // { city: "New York", country: "USA" }

এখানে, name এবং age আলাদাভাবে ডেস্ট্রাকচার করা হয়েছে এবং অবশিষ্ট প্রপার্টি গুলো address নামের অবজেক্টে সংগৃহীত হয়েছে।


Function Parameters এ Object Destructuring

এছাড়াও, ফাংশনের প্যারামিটার হিসেবে অবজেক্ট ডেস্ট্রাকচারিং ব্যবহার করা যায়, যা কোডকে আরও সহজ এবং ক্লিন করে।

উদাহরণ:

const greet = ({ name, age }) => {
  console.log(`Hello, ${name}. You are ${age} years old.`);
};

const person = {
  name: "John",
  age: 30
};

greet(person);  // "Hello, John. You are 30 years old."

এখানে, greet ফাংশনে অবজেক্টের প্রপার্টি name এবং age সরাসরি প্যারামিটার হিসেবে ডেস্ট্রাকচার করা হয়েছে।


সারাংশ

Object Destructuring ES6 এর একটি শক্তিশালী বৈশিষ্ট্য, যা অবজেক্টের প্রপার্টি গুলোকে পৃথক ভ্যারিয়েবলে দ্রুত এবং সহজভাবে অ্যাসাইন করতে সাহায্য করে। এটি কোড সংক্ষিপ্ত, পরিষ্কার এবং আরও রিডেবল করে তোলে। ES6 এর Destructuring এর মাধ্যমে আপনি ডিফল্ট মান, আলিয়াস, নেস্টেড অবজেক্ট, রেস্ট প্যাটার্ন, এবং ফাংশন প্যারামিটার হিসেবে অবজেক্ট ডেস্ট্রাকচারিং সহ আরও অনেক সুবিধা উপভোগ করতে পারেন।

Content added By

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

ES6 এ ডিফল্ট ভ্যালু (Default Values) এবং রেনেমিং (Renaming) এর ফিচার দুটি ফাংশন আর্গুমেন্টস এবং ডেস্ট্রাকচারিং (Destructuring) ব্যবহারের ক্ষেত্রে খুবই উপকারী। এগুলি কোডকে আরও পরিষ্কার, সহজ এবং শক্তিশালী করে তোলে। চলুন, এই দুটি ফিচার কীভাবে কাজ করে তা বিস্তারিতভাবে আলোচনা করি।


1. ডিফল্ট ভ্যালু (Default Values)

ফাংশন আর্গুমেন্টে ডিফল্ট ভ্যালু ব্যবহার করা হয় যখন কোনো আর্গুমেন্টের মান সরবরাহ করা না হয় বা undefined পাঠানো হয়। আপনি সরাসরি ফাংশনের আর্গুমেন্টে ডিফল্ট মান সেট করতে পারেন, যা ফাংশনটি কল করার সময় যদি ওই আর্গুমেন্টটি সরবরাহ না করা হয়, তবে ডিফল্ট মানটি ব্যবহৃত হবে।

উদাহরণ:

function greet(name = "Guest") {
  console.log(`Hello, ${name}!`);
}

greet("John");  // "Hello, John!"
greet();         // "Hello, Guest!"

এখানে, name আর্গুমেন্টের ডিফল্ট মান "Guest" সেট করা হয়েছে। যখন greet() ফাংশন কোনো আর্গুমেন্ট ছাড়াই কল করা হয়, তখন "Guest" মানটি স্বয়ংক্রিয়ভাবে ব্যবহৃত হবে।


2. ডিফল্ট ভ্যালু ব্যবহার করে অবজেক্ট ডেস্ট্রাকচারিং

ডিফল্ট ভ্যালু শুধুমাত্র ফাংশন আর্গুমেন্টের জন্যই নয়, ডেস্ট্রাকচারিং এর সময়ও ব্যবহার করা যায়। অর্থাৎ, যখন আপনি কোনো অবজেক্ট থেকে ডেটা বের করে আনেন (Destructuring), তখন আপনি প্রত্যেকটি প্রপার্টির জন্য ডিফল্ট মান নির্ধারণ করতে পারেন।

উদাহরণ:

const user = { name: "Alice" };

const { name, age = 25 } = user;
console.log(name);  // "Alice"
console.log(age);   // 25 (এটা ডিফল্ট মান, যেহেতু `age` প্রপার্টি অবজেক্টে নেই)

এখানে, user অবজেক্টে age প্রপার্টি নেই, তাই ডিফল্ট মান 25 ব্যবহৃত হচ্ছে।


3. রেনেমিং (Renaming) ডেস্ট্রাকচারিং এ

ডেস্ট্রাকচারিংয়ের মাধ্যমে আপনি একে অপরের সাথে সম্পর্কিত ভ্যারিয়েবল নামগুলিকে পরিবর্তন বা রেনেম (rename) করতে পারেন। যখন আপনি অবজেক্ট বা অ্যারে ডেস্ট্রাকচার করেন, আপনি কোনো ভ্যারিয়েবলের নাম অন্য নামে সংরক্ষণ করতে পারবেন।

উদাহরণ (অবজেক্ট ডেস্ট্রাকচারিং):

const user = {
  firstName: "Alice",
  lastName: "Johnson"
};

const { firstName: first, lastName: last } = user;

console.log(first);  // "Alice"
console.log(last);   // "Johnson"

এখানে, firstName এবং lastName প্রপার্টিগুলো first এবং last নামে রেনেম করা হয়েছে।

উদাহরণ (অ্যারে ডেস্ট্রাকচারিং):

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

const [first, second] = arr;

console.log(first);   // 1
console.log(second);  // 2

এখানে, অ্যারে ডেস্ট্রাকচারিংয়ের মাধ্যমে আপনি নির্দিষ্ট ইনডেক্সের মানগুলি আলাদা ভ্যারিয়েবলে অ্যাসাইন করতে পারেন।


4. ডিফল্ট ভ্যালু এবং রেনেমিং একত্রে ব্যবহার

ডিফল্ট ভ্যালু এবং রেনেমিং একই সাথে ব্যবহার করা সম্ভব। যখন আপনি অবজেক্ট বা অ্যারে ডেস্ট্রাকচার করছেন, তখন আপনি উভয় ফিচার একত্রে ব্যবহার করতে পারেন।

উদাহরণ (অবজেক্ট ডেস্ট্রাকচারিং ডিফল্ট ভ্যালু এবং রেনেমিং):

const user = { name: "Alice" };

const { name: userName, age = 30 } = user;

console.log(userName);  // "Alice"
console.log(age);       // 30 (ডিফল্ট মান, কারণ `age` প্রপার্টি অবজেক্টে নেই)

উদাহরণ (অ্যারে ডেস্ট্রাকচারিং ডিফল্ট ভ্যালু এবং রেনেমিং):

const numbers = [10, 20];

const [firstNum, secondNum = 30] = numbers;

console.log(firstNum);  // 10
console.log(secondNum); // 20 (অ্যারে তে সেকেন্ড মান আছে, ডিফল্ট মান প্রয়োগ হয় না)

এখানে, অ্যারের দ্বিতীয় মান secondNum এর জন্য একটি ডিফল্ট ভ্যালু 30 দেয়া হয়েছিল, কিন্তু অ্যারে তে একটি মান থাকায় ডিফল্ট ভ্যালু ব্যবহার হয়নি।


সারাংশ

  • ডিফল্ট ভ্যালু ফাংশন আর্গুমেন্ট বা ডেস্ট্রাকচারিংয়ের সময় ব্যবহৃত হয়, যখন কোনো ভ্যারিয়েবলের জন্য মান সরবরাহ করা না হয়। এটি সরবরাহ করা না হলে, ডিফল্ট মান ব্যবহার করা হয়।
  • রেনেমিং ডেস্ট্রাকচারিংয়ের মাধ্যমে আপনি অবজেক্ট বা অ্যারের প্রপার্টি বা মানগুলোর নাম পরিবর্তন করতে পারেন।

এই দুটি ফিচার ব্যবহার করে কোড আরো পরিষ্কার এবং সংক্ষিপ্ত করা যায়, যা ডেভেলপারদের জন্য কার্যকরী এবং সহজ উপায় হয়ে ওঠে।

Content added By
Promotion

Are you sure to start over?

Loading...