Tech TutorBangla Web Documentation
Portfolio
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • JavaScript Documentation48টি অধ্যায়
প্রযুক্তি নির্বাচন
HomeHTMLCSSTailwind CSSJavaScriptTypeScriptReactNext.jsNode.jsExpressSocket.IOExpoWordPressPostgreSQLPrismaPostgresNestJSMongoDBDockerTanStackTanStack TableRTK QueryGitGitHub
  • Introduction
  • JavaScript কী?
  • Syntax & Comments
  • Variables
  • Data Types: Basics
  • Data Types: Conversion
  • Data Types: Advanced
  • Strings
  • Numbers & Math
  • Date & Time
  • Operators
  • Conditions
  • Loops
  • Functions: Basics
  • Functions: Intermediate
  • Functions: Advanced
  • Scope & Hoisting
  • Closures & this
  • ES6+ Modern
  • Arrays: Basics
  • Arrays: Intermediate
  • Arrays: Advanced
  • Objects: Basics
  • Objects: Intermediate
  • Objects: Advanced
  • Class: Basics
  • Class: Intermediate
  • Class: Advanced
  • DOM: Basics
  • DOM: Intermediate
  • DOM: Advanced
  • Events: Basics
  • Events: Intermediate
  • Events: Advanced
  • Async JavaScript
  • Promise
  • Async / Await
  • Fetch API
  • JSON
  • Modules
  • Browser Storage
  • Event Loop Deep
  • Prototype Chain
  • Iterators & Generators
  • WeakMap, WeakSet, Proxy
  • Error Handling
  • Practice Problems
  • Mini Projects
  • Basics
  • Functions & Scope
  • Types & Syntax
  • Arrays & Objects
  • Advanced
  • Functional Programming
  • Objects & Symbols
  • Async Deep Dive
  • Modern JavaScript
  1. Docs
  2. JavaScript
  3. প্রশ্ন/উত্তর
  4. Arrays & Objects
  5. Q16. What is destructuring in JavaScript? Explain with array and object examples.
JavaScriptArrays & Objects

Q16. What is destructuring in JavaScript? Explain with array and object examples.

Array ও object থেকে একসাথে আলাদা ভেরিয়েবলে মান বের করার সুন্দর পদ্ধতি।

Destructuring মানে কোনো array বা object থেকে ভেতরের মানগুলো একসাথে ধরে আলাদা আলাদা ভেরিয়েবলে বের করে নেওয়া। ES6-এ এসেছে এবং লাইনে লাইনে index বা key বের করার কাজ অনেক ছোট করে দেয়।

দুই ধরনের destructuringjavascript
javascript
// array — বাঁ পাশে ধন্ডার বন্ধনী
const [first, second, third] = [10, 20, 30];

console.log(first, second, third); // 10 20 30

// object — বাঁ পাশে লাল বন্ধনী
const { name, age } = { name: "Rahim", age: 25 };

console.log(name, age); // "Rahim" 25

মূল কথা হলো, variable-এর নাম ডান পাশের key বা অবস্থানের সাথে মেলানো হচ্ছে। Array-তে মেলানো হয় অবস্থান দিয়ে আর object-এ key দিয়ে।

দুই ধরনেই নতুন নামে সেট করা, ডিফল্ট মান দেওয়া আর বাকিগুলো বের করার সুবিধা আছে।

আরও কিছু সুবিধাjavascript
javascript
// নাম বদলানো
const { name: userName } = { name: "Rahim" };
console.log(userName); // "Rahim"

// ডিফল্ট মান
const { role = "user" } = {};
console.log(role); // "user"

// বাকিগুলো বের করা (rest)
const [a, ...others] = [1, 2, 3, 4];
console.log(a, others); // 1 [2, 3, 4]

// skip করা — ফাঁকা জায়গা রাখতে হয়
const [, second] = ["x", "y", "z"];
console.log(second); // "y"

Nested object ও array-এও কাজ করে, এবং swap করার জন্য এটি সবচেয়ে স্বাভাবিক উপায়।

nested ও swapjavascript
javascript
// nested
const {
  user: { name, address: { city } },
} = {
  user: { name: "Rahim", address: { city: "Dhaka" } },
};

console.log(name, city); // "Rahim" "Dhaka"

// swap — অতিরিক্ত ভেরিয়েবল ছাড়াই
let a = 1;
let b = 2;
[a, b] = [b, a];

console.log(a, b); // 2 1

ফাংশনের প্যারামিটারেও destructuring ব্যবহার হয়, তাই ওপনএক্সলে কোনো property ব্যবহার না করলেও obj.x লিখতে হয় না।

ফাংশন ও map-এjavascript
javascript
function greet({ name, age = 0 }) {
  return name + " (" + age + ")";
}

console.log(greet({ name: "Rahim", age: 25 })); // "Rahim (25)"

// map-এর সাথে খুব প্রাকৃতিক
const users = [{ name: "Rahim" }, { name: "Karim" }];

console.log(
  users.map(({ name }) => name)
); // ["Rahim", "Karim"]
কখন ব্যবহার করবেন

API থেকে আসা বড় object থেকে দুই-একটা প্রপার্টি দরকার হলে, বা map-এর ভিতরে কাজ করলে destructuring কোড অনেক পরিষ্কার করে দেয়।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।
Arrays & Objects বিভাগের আরও প্রশ্নJavaScript প্রশ্ন/উত্তর
Tech Tutor

বাংলায় ওয়েব ডেভেলপমেন্ট ডকুমেন্টেশন শিখুন — ধাপে ধাপে।

Homeসব ডকুমেন্টেশনQuick Startআমার নোটস

© 2026 Tech Tutor. বাংলায় শিখুন, বাংলায় গড়ুন।

mdanamolhasan1998@gmail.com