JavaScript Object কী? Object সম্পূর্ণ গাইড ও উদাহরণ

JavaScript Object কী, Property, Method, this keyword, Constructor, Nested Object, Destructuring ও Object Methods উদাহরণসহ বিস্তারিত শিখুন।

JavaScript Object হলো JavaScript-এর অন্যতম গুরুত্বপূর্ণ একটি বিষয়। Object ব্যবহার করে আমরা একাধিক সম্পর্কিত তথ্যকে key-value pair আকারে এক জায়গায় সংরক্ষণ করতে পারি। Object-এর মধ্যে শুধু data নয়, function-ও রাখা যায়। Object-এর ভিতরে থাকা function-কে সাধারণত Method বলা হয়।

এই আর্টিকেলে আমরা JavaScript Object কী, Object কীভাবে তৈরি করতে হয়, Property কী, Method কী, Object Property কীভাবে access ও পরিবর্তন করতে হয়, this keyword, Constructor, Nested Object, Object.keys(), Object.values(), Object.entries(), Destructuring, Spread Operator এবং আরও গুরুত্বপূর্ণ বিষয় উদাহরণসহ শিখব।

JavaScript Object কী?

JavaScript Object হলো এমন একটি data structure যেখানে বিভিন্ন ধরনের data key এবং value আকারে সংরক্ষণ করা যায়।

যেমন একজন ব্যক্তির নাম, বয়স, ঠিকানা ইত্যাদি আলাদা আলাদা variable-এ রাখার পরিবর্তে একটি Object-এর মধ্যে রাখা যায়।

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50
};

এখানে person হলো একটি Object।

Object-এর মধ্যে তিনটি Property রয়েছে:

  1. firstName → "John"
  2. lastName → "Doe"
  3. age → 50

Object-এর Key এবং Value

Object-এর প্রতিটি তথ্য সাধারণত key-value pair হিসেবে লেখা হয়।

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

এখানে name এবং age হলো key বা property name। আর "John" এবং 30 হলো তাদের value।

Key এবং value-এর মধ্যে colon (:) ব্যবহার করা হয়।

JavaScript Object তৈরি করার নিয়ম

JavaScript-এ Object তৈরি করার সবচেয়ে সাধারণ পদ্ধতি হলো curly braces {} ব্যবহার করা।

const person = {
  name: "John",
  age: 50,
  city: "Dhaka"
};

এখানে person একটি Object এবং এর মধ্যে তিনটি Property রয়েছে।

Object Property কী?

Object-এর মধ্যে যে key-value pair থাকে, সেগুলোকে Object Property বলা হয়।

const car = {
  brand: "Toyota",
  model: "Corolla",
  year: 2025
};

এখানে brand, model এবং year হলো Object Property।

Object Property Access করা

Object-এর Property-এর value পাওয়ার জন্য প্রধানত দুইটি পদ্ধতি ব্যবহার করা হয়:

  1. Dot Notation
  2. Bracket Notation

1. Dot Notation

Dot notation-এ Object-এর নামের পরে একটি dot (.) দিয়ে Property-এর নাম লিখতে হয়।

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

console.log(person.name);
console.log(person.age);

Output:

John
50

2. Bracket Notation

Bracket notation-এ Property-এর নাম square bracket-এর মধ্যে লিখতে হয়।

console.log(person["name"]);
console.log(person["age"]);

Output:

John
50

Property-এর নাম যদি কোনো variable-এর মধ্যে থাকে, তখন bracket notation বিশেষভাবে কাজে লাগে।

let property = "name";

console.log(person[property]);

Output:

John

Object Property পরিবর্তন করা

Object তৈরি করার পরেও তার Property-এর value পরিবর্তন করা যায়।

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

person.age = 60;

console.log(person.age);

Output:

60

এখানে const ব্যবহার করা হলেও Object-এর Property পরিবর্তন করা সম্ভব। কারণ const Object-এর reference পরিবর্তন করতে বাধা দেয়, Object-এর Property পরিবর্তন করতে নয়।

Object-এ নতুন Property যোগ করা

Existing Object-এর মধ্যে নতুন Property যোগ করা যায়।

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

person.city = "Dhaka";

console.log(person.city);

Output:

Dhaka

Object Property Delete করা

Object থেকে কোনো Property মুছে ফেলার জন্য delete operator ব্যবহার করা যায়।

const person = {
  name: "John",
  age: 50,
  city: "Dhaka"
};

delete person.city;

console.log(person);

উপরের code-এ city Property-টি Object থেকে মুছে যাবে।

JavaScript Object Method

কোনো Object-এর মধ্যে যদি একটি function রাখা হয়, তাহলে সেই function-কে সাধারণত Method বলা হয়।

const person = {
  firstName: "John",
  lastName: "Doe",

  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

console.log(person.fullName());

Output:

John Doe

এখানে fullName হলো একটি Method। Method চালানোর জন্য person.fullName() লিখতে হয়েছে।

Object Method-এ this Keyword

JavaScript Object-এর Method-এর ক্ষেত্রে this keyword খুব গুরুত্বপূর্ণ।

const person = {
  firstName: "John",
  lastName: "Doe",

  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

এখানে this সাধারণভাবে সেই Object-কে নির্দেশ করছে যার মাধ্যমে Method-টি call করা হয়েছে।

console.log(person.fullName());

এখানে this বলতে person Object-কে বোঝাচ্ছে।

তাই:

this.firstName

এর অর্থ:

person.firstName

এবং:

this.lastName

এর অর্থ:

person.lastName

Object Method Call করার নিয়ম

Object-এর Method call করার সময় () ব্যবহার করতে হয়।

const person = {
  name: "John",

  sayHello: function() {
    return "Hello " + this.name;
  }
};

console.log(person.sayHello());

Output:

Hello John

কিন্তু নিচের code-এ () নেই:

console.log(person.sayHello);

তাই এখানে Method execute হবে না; function-এর reference পাওয়া যাবে।

Object-এর মধ্যে বিভিন্ন Data Type

JavaScript Object-এর Property-এর value হিসেবে বিভিন্ন ধরনের data রাখা যায়।

const person = {
  name: "John",
  age: 50,
  married: true,
  skills: ["HTML", "CSS", "JavaScript"],
  address: {
    city: "Dhaka"
  }
};

এখানে String, Number, Boolean, Array এবং Nested Object—সব ধরনের data ব্যবহার করা হয়েছে।

Object-এর মধ্যে Array

Object-এর কোনো Property-এর value হিসেবে Array রাখা যায়।

const person = {
  name: "John",
  skills: ["HTML", "CSS", "JavaScript"]
};

console.log(person.skills);
console.log(person.skills[0]);
console.log(person.skills[2]);

Output:

["HTML", "CSS", "JavaScript"]
HTML
JavaScript

Nested Object কী?

একটি Object-এর ভিতরে আরেকটি Object থাকলে তাকে Nested Object বলা হয়।

const person = {
  name: "John",
  age: 50,

  address: {
    city: "Dhaka",
    country: "Bangladesh"
  }
};

Nested Object-এর Property access করতে একাধিক dot ব্যবহার করা যায়।

console.log(person.address.city);
console.log(person.address.country);

Output:

Dhaka
Bangladesh

Object-এর মধ্যে Function

Object-এর মধ্যে function রাখা যায় এবং সেই function Object-এর Property ব্যবহার করতে পারে।

const person = {
  firstName: "Adiyan",
  lastName: "Islam",

  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

console.log(person.fullName());

Output:

Adiyan Islam

Object Constructor কী?

একই ধরনের অনেক Object তৈরি করার জন্য Constructor Function ব্যবহার করা যায়।

function Person(firstName, lastName, age) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.age = age;
}

এখন new keyword ব্যবহার করে নতুন Object তৈরি করা যায়।

const person1 = new Person("John", "Doe", 30);
const person2 = new Person("Jane", "Smith", 25);

console.log(person1.firstName);
console.log(person2.firstName);

Output:

John
Jane

Constructor Function কীভাবে কাজ করে?

  1. প্রথমে Constructor Function তৈরি করা হয়।
  2. this দিয়ে Object-এর Property নির্ধারণ করা হয়।
  3. new keyword ব্যবহার করে নতুন Object তৈরি করা হয়।
  4. প্রতিটি Object-এর জন্য আলাদা value দেওয়া যায়।
function Person(fname) {
  this.firstname = fname;
}

const person1 = new Person("John");
const person2 = new Person("Jane");

console.log(person1.firstname);
console.log(person2.firstname);

Output:

John
Jane

Object Constructor-এর Method

Constructor-এর ভিতরেও Method তৈরি করা যায়।

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;

  this.fullName = function() {
    return this.firstName + " " + this.lastName;
  };
}

const person = new Person("John", "Doe");

console.log(person.fullName());

Output:

John Doe

Object-এর Property Loop করা

Object-এর সব Property একে একে দেখার জন্য for...in loop ব্যবহার করা যায়।

const person = {
  name: "John",
  age: 50,
  city: "Dhaka"
};

for (let key in person) {
  console.log(key);
}

Output:

name
age
city

Property-এর value দেখতে চাইলে:

for (let key in person) {
  console.log(key + ": " + person[key]);
}

Output:

name: John
age: 50
city: Dhaka

Object.keys()

Object.keys() একটি Object-এর সব Property-এর নাম একটি Array হিসেবে return করে।

const person = {
  name: "John",
  age: 50,
  city: "Dhaka"
};

console.log(Object.keys(person));

Output:

["name", "age", "city"]

Object.values()

Object.values() Object-এর সব Property-এর value একটি Array হিসেবে return করে।

console.log(Object.values(person));

Output:

["John", 50, "Dhaka"]

Object.entries()

Object.entries() Object-এর key এবং value-কে Array-এর ভিতরে pair হিসেবে return করে।

console.log(Object.entries(person));

Output:

[
  ["name", "John"],
  ["age", 50],
  ["city", "Dhaka"]
]

Object Property আছে কি না Check করা

কোনো Property Object-এর মধ্যে আছে কি না জানতে in operator ব্যবহার করা যায়।

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

console.log("name" in person);
console.log("city" in person);

Output:

true
false

Object.hasOwn()

Object.hasOwn() ব্যবহার করে কোনো Property Object-এর নিজস্ব Property কি না check করা যায়।

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

console.log(Object.hasOwn(person, "name"));
console.log(Object.hasOwn(person, "city"));

Output:

true
false

Object Destructuring

Object Destructuring ব্যবহার করে Object-এর Property সরাসরি variable-এর মধ্যে নেওয়া যায়।

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50
};

const { firstName, lastName, age } = person;

console.log(firstName);
console.log(lastName);
console.log(age);

Output:

John
Doe
50

Object Spread Operator

Spread Operator (...) ব্যবহার করে একটি Object-এর Property অন্য Object-এর মধ্যে copy বা combine করা যায়।

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

const employee = {
  ...person,
  job: "Developer"
};

console.log(employee);

এখানে employee Object-এর মধ্যে person-এর Property এবং নতুন job Property দুটোই থাকবে।

Object.assign()

Object.assign() ব্যবহার করে এক বা একাধিক Object-এর Property অন্য Object-এর মধ্যে copy করা যায়।

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

const details = {
  city: "Dhaka"
};

const result = Object.assign({}, person, details);

console.log(result);

Result-এর মধ্যে থাকবে:

{
  name: "John",
  age: 50,
  city: "Dhaka"
}

Object-এ Function Expression ব্যবহার

Object-এর Property হিসেবে Function Expression ব্যবহার করা যায়।

const person = {
  name: "John",

  sayHello: function() {
    return "Hello " + this.name;
  }
};

console.log(person.sayHello());

Output:

Hello John

Object Method-এর Short Syntax

JavaScript-এ Object-এর Method লেখার জন্য সংক্ষিপ্ত syntax ব্যবহার করা যায়।

const person = {
  firstName: "John",
  lastName: "Doe",

  fullName() {
    return this.firstName + " " + this.lastName;
  }
};

console.log(person.fullName());

এটি নিচের পুরোনো syntax-এর সংক্ষিপ্ত রূপ:

fullName: function() {
  return this.firstName + " " + this.lastName;
}

Object-এর মধ্যে Arrow Function

Object-এর Property হিসেবে Arrow Function ব্যবহার করা যায়।

const person = {
  name: "John",

  sayHello: () => {
    return "Hello";
  }
};

console.log(person.sayHello());

তবে this keyword ব্যবহারের ক্ষেত্রে Arrow Function-এর আচরণ Regular Function-এর মতো নয়। Object-এর Property access করার জন্য this দরকার হলে সাধারণ Method syntax ব্যবহার করা বেশি সহজ।

Object কি পরিবর্তন করা যায়?

const দিয়ে Object declare করলেও Object-এর Property পরিবর্তন, যোগ বা delete করা যায়।

const person = {
  name: "John"
};

person.name = "Jane";

console.log(person.name);

Output:

Jane

তবে একই const variable-এ সম্পূর্ণ নতুন Object assign করা যায় না।

const person = {
  name: "John"
};

// এটি করা যাবে না:
// person = { name: "Jane" };

Object.freeze()

Object.freeze() ব্যবহার করলে Object-এর Property পরিবর্তন, নতুন Property যোগ বা Property delete করা থেকে Object-কে freeze করা যায়।

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

Object.freeze(person);

person.age = 60;

console.log(person.age);

Object freeze করা থাকায় সাধারণভাবে age পরিবর্তন হবে না।

Object-এর Property হিসেবে String, Number ও Boolean

const user = {
  username: "Ariful",
  age: 25,
  active: true
};

console.log(user.username);
console.log(user.age);
console.log(user.active);

Object একইসাথে বিভিন্ন data type সংরক্ষণ করতে পারে।

Object-এর মধ্যে অন্য Object ও Array একসাথে

const student = {
  name: "Ariful",
  age: 25,

  skills: [
    "HTML",
    "CSS",
    "JavaScript"
  ],

  address: {
    city: "Dhaka",
    country: "Bangladesh"
  }
};

console.log(student.name);
console.log(student.skills[2]);
console.log(student.address.city);

Output:

Ariful
JavaScript
Dhaka

JavaScript Object এবং Array-এর পার্থক্য

Object Array
Named Property ব্যবহার করে Index ব্যবহার করে
person.name users[0]
একটি নির্দিষ্ট Entity-এর তথ্য রাখতে সুবিধাজনক একাধিক Item-এর তালিকা রাখতে সুবিধাজনক
const person = {
  name: "John",
  age: 50
};

const colors = [
  "Red",
  "Green",
  "Blue"
];

বাস্তব উদাহরণ: Student Object

একটি Student-এর তথ্য Object-এর মাধ্যমে সুন্দরভাবে রাখা যায়।

const student = {
  name: "Rahim",
  age: 20,
  department: "Computer Science",
  skills: ["HTML", "CSS", "JavaScript"],

  getInfo() {
    return this.name + " - " + this.department;
  }
};

console.log(student.getInfo());

Output:

Rahim - Computer Science

বাস্তব উদাহরণ: Product Object

const product = {
  name: "Laptop",
  price: 50000,
  brand: "Dell",

  getPrice() {
    return this.price;
  }
};

console.log(product.name);
console.log(product.getPrice());

Output:

Laptop
50000

JavaScript Object-এর গুরুত্বপূর্ণ বিষয়গুলো

  1. Object হলো key-value pair-এর collection।
  2. Object তৈরি করতে সাধারণত {} ব্যবহার করা হয়।
  3. Object-এর data-কে Property বলা হয়।
  4. Object-এর ভিতরের function-কে Method বলা হয়।
  5. Property access করতে Dot Notation বা Bracket Notation ব্যবহার করা যায়।
  6. Method call করতে () ব্যবহার করতে হয়।
  7. Object Method-এর মধ্যে this keyword ব্যবহার করা যায়।
  8. একই ধরনের অনেক Object তৈরি করতে Constructor Function ব্যবহার করা যায়।
  9. Object.keys() Property-এর নাম দেয়।
  10. Object.values() Property-এর value দেয়।
  11. Object.entries() key-value pair দেয়।
  12. Object Destructuring দিয়ে Property সহজে variable-এ নেওয়া যায়।
  13. Spread Operator দিয়ে Object copy বা combine করা যায়।

সম্পূর্ণ Object Example

নিচের example-এ Object-এর Property, Method এবং this keyword একসাথে ব্যবহার করা হয়েছে।

const person = {
  firstName: "Adiyan",
  lastName: "Islam",
  age: 25,
  city: "Dhaka",

  fullName() {
    return (
      this.firstName + " " + this.lastName
    ).toUpperCase();
  },

  getAge() {
    return this.age;
  }
};

console.log(person.firstName);
console.log(person.fullName());
console.log(person.getAge());

Output:

Adiyan
ADIYAN ISLAM
25

সাধারণ ভুল

1. Method call করার সময় () ভুলে যাওয়া

console.log(person.fullName);

এটি Method-এর reference দেখাবে। Method execute করতে হবে:

console.log(person.fullName());

2. ভুল Property Name ব্যবহার করা

const person = {
  name: "John"
};

console.log(person.age);

এখানে age Property নেই, তাই result হবে undefined

3. arguments এবং parameters গুলিয়ে ফেলা

function Person(fname) {
  this.firstname = fname;
}

const person = new Person("John");

এখানে fname হলো parameter এবং "John" হলো argument

উপসংহার

JavaScript Object JavaScript শেখার জন্য অত্যন্ত গুরুত্বপূর্ণ একটি concept। Web development-এর প্রায় সব ধরনের project-এ Object ব্যবহার করা হয়। User information, product data, API response, configuration, database data এবং application state—সব জায়গাতেই Object দেখা যায়।

শুরুতে আপনার সবচেয়ে ভালোভাবে শেখা উচিত: Object Property, Dot Notation, Bracket Notation, Method, this keyword, Constructor এবং Object Destructuring। এগুলো ভালোভাবে বুঝতে পারলে JavaScript-এর পরবর্তী বিষয়গুলো শেখা অনেক সহজ হবে।

Post a Comment

To avoid SPAM, all comments will be moderated before being displayed.
Don't share any personal or sensitive information.