Spread অপারেটর কি এবং এর ব্যবহার

Rest এবং Spread অপারেটর - জাভাস্ক্রিপ্ট ইএস৬ (ES6) - Web Development

345

Spread Operator (...) ES6 (ECMAScript 2015) এর একটি গুরুত্বপূর্ণ বৈশিষ্ট্য, যা অ্যারে বা অবজেক্টের উপাদানগুলোকে একটি নতুন কন্টেক্সটে এক্সপ্যান্ড বা "ফেলিয়ে" দেয়। এই অপারেটরটি মূলত অ্যারে বা অবজেক্টের উপাদানগুলোকে নতুন ডেটা স্ট্রাকচারে কপি করতে বা একত্রিত করতে ব্যবহৃত হয়।

Spread Operator মূলত array, object, বা function এ ব্যবহৃত হতে পারে এবং এটি মূল ডেটা স্ট্রাকচারের কোনো পরিবর্তন না করে উপাদানগুলোকে বিস্তৃত (expand) করতে সাহায্য করে।


Spread Operator এর সাধারণ সিনট্যাক্স

  • Array: ...array
  • Object: ...object

Spread Operator এর ব্যবহার

  1. Array এর সাথে Spread Operator

Spread Operator অ্যারের উপাদানগুলোকে নতুন অ্যারে বা অন্য অ্যারে মধ্যে প্রসারিত (expand) করতে সাহায্য করে। এটি মূল অ্যারের ডেটা পরিবর্তন না করেই একটি নতুন অ্যারে তৈরি করতে ব্যবহৃত হয়।

উদাহরণ: অ্যারে কপি করা

const numbers = [1, 2, 3];
const newNumbers = [...numbers];

console.log(newNumbers);  // [1, 2, 3]

এখানে, numbers অ্যারেটি Spread Operator ব্যবহার করে newNumbers তে কপি করা হয়েছে। মূল অ্যারে numbers অক্ষত আছে এবং newNumbers একটি নতুন অ্যারে হিসেবে তৈরি হয়েছে।

উদাহরণ: অ্যারে একত্রিত (merge) করা

const numbers1 = [1, 2];
const numbers2 = [3, 4];

const combinedNumbers = [...numbers1, ...numbers2];

console.log(combinedNumbers);  // [1, 2, 3, 4]

এখানে, numbers1 এবং numbers2 কে Spread Operator দিয়ে একত্রিত (merge) করা হয়েছে। দুটি অ্যারে একসাথে নতুন একটি অ্যারে combinedNumbers এ পরিণত হয়েছে।

উদাহরণ: নতুন উপাদান যোগ করা

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

console.log(moreNumbers);  // [1, 2, 3, 4, 5]

এখানে, numbers অ্যারেতে নতুন উপাদান 4 এবং 5 যুক্ত করা হয়েছে।


  1. Object এর সাথে Spread Operator

Spread Operator অবজেক্টের কনটেন্ট একত্রিত বা কপি করার জন্যও ব্যবহৃত হয়। এটি অবজেক্টের শেল বা কনটেইনারে উপাদানগুলি প্রসারিত করতে সাহায্য করে।

উদাহরণ: অবজেক্ট কপি করা

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

const newPerson = { ...person };

console.log(newPerson);  // { name: "John", age: 30 }

এখানে, person অবজেক্টটি newPerson তে কপি করা হয়েছে। নতুন অবজেক্টটি মূল অবজেক্টের কন্টেন্টের কপি, কিন্তু কোনো মিউটেশন হয়নি।

উদাহরণ: অবজেক্ট একত্রিত করা

const person = { name: "John", age: 30 };
const job = { position: "Developer", company: "XYZ" };

const combinedPerson = { ...person, ...job };

console.log(combinedPerson);  // { name: "John", age: 30, position: "Developer", company: "XYZ" }

এখানে, person এবং job অবজেক্টগুলো Spread Operator দিয়ে একত্রিত করা হয়েছে। নতুন অবজেক্ট combinedPerson তে দুটি অবজেক্টের কন্টেন্ট মিশে গেছে।

উদাহরণ: অবজেক্টের মান আপডেট করা

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

console.log(updatedPerson);  // { name: "John", age: 31 }

এখানে, age মানটি আপডেট করা হয়েছে এবং অন্যান্য মান অপরিবর্তিত রাখা হয়েছে।


Spread Operator এর সুবিধা

  1. কপি করার সহজ উপায়: Spread Operator দিয়ে অ্যারে বা অবজেক্টের কপি তৈরি করা সহজ, যার ফলে ডেটার অরিজিনাল কন্টেন্ট পরিবর্তন না করে নতুন ডেটা স্ট্রাকচার তৈরি করা সম্ভব।
  2. অ্যারে বা অবজেক্ট একত্রিত করা: এটি একাধিক অ্যারে বা অবজেক্টকে একত্রিত (merge) করার জন্য খুবই কার্যকর।
  3. ডেটার কন্টেন্টের পুনরায় ব্যবহার: Spread Operator ব্যবহার করে আপনি কোনো ডেটার কন্টেন্ট পুনরায় ব্যবহার করতে পারেন, এবং মূল ডেটার সাথে কোনো পরিবর্তন না করেই নতুন ডেটা স্ট্রাকচার তৈরি করতে পারেন।
  4. কমপ্যাক্ট কোড: Spread Operator কোড কমপ্যাক্ট এবং সহজ করে তোলে, কারণ আপনি শুধুমাত্র ... ব্যবহার করে একটি অ্যারে বা অবজেক্টের উপাদান প্রসারিত করতে পারেন।

নিষ্কর্ষ

Spread Operator ES6 এর একটি গুরুত্বপূর্ণ এবং শক্তিশালী বৈশিষ্ট্য যা অ্যারে এবং অবজেক্টের উপাদানকে দ্রুত এবং সহজভাবে প্রসারিত, কপি বা একত্রিত করতে সাহায্য করে। এটি কোডকে ছোট এবং পড়তে সহজ করে তোলে এবং ডেটা ম্যানিপুলেশনকে অনেক বেশি কার্যকর করে।

Content added By
Promotion

Are you sure to start over?

Loading...