কম্পিউটার টিউটোরিয়াল

JavaScript-এ শর্তসাপেক্ষে অবজেক্ট প্রপার্টি পরিবর্তন করা (Logical AND)

JavaScript-এ লজিক্যাল AND অপারেটর (&&) এবং স্প্রেড সিনট্যাক্স (...) ব্যবহার করে শর্ত পূরণ হলে অবজেক্ট প্রপার্টি শর্তসাপেক্ষে পরিবর্তন বা যোগ করা যায়।

কোড উদাহরণ

let marks = { Mark1: 33, Mark2: 89 };
let isBacklog = false;

// Backlog false: Mark1 অপরিবর্তিত
let result1 = { ...marks, ...(isBacklog === true && { Mark1: 33 }) };
console.log("Backlog false:", result1); // { Mark1: 33, Mark2: 89 }

isBacklog = true;

// Backlog true: Mark1 আপডেট হয়ে 93
let result2 = { ...marks, ...(isBacklog === true && { Mark1: 93 }) };
console.log("Backlog true:", result2); // { Mark1: 93, Mark2: 89 }

চলানোর পদ্ধতি

  1. কোডটি conditionalProp.js নামে সংরক্ষণ করুন।
  2. টার্মিনালে চালান: node conditionalProp.js

আউটপুট

Backlog false: { Mark1: 33, Mark2: 89 }
Backlog true: { Mark1: 93, Mark2: 89 }

কীভাবে কাজ করে

  • condition && value - শর্ত true হলে `value` রিটার্ন, false হলে `false` রিটার্ন।
  • { ...obj, ...(condition && { prop: val }) } - শর্ত true হলে স্প্রেড হয়, false হলে `{...false}` = কোনো প্রভাব নেই।
  • শর্ট-সার্কিট ইভ্যালুয়েশন: `false && anything` = `false` (রাইট সাইড রান হয় না)।

বিকল্প প্যাটার্ন: টারনারি অপারেটর

const result = {
    ...marks,
    Mark1: isBacklog ? 93 : marks.Mark1
};

বিকল্প: IIFE বা ফাংশন

const result = (() => {
    const obj = { ...marks };
    if (isBacklog) obj.Mark1 = 93;
    return obj;
})();

ব্যবহার ক্ষেত্র

  • কন্ডিশনাল কনফিগারেশন অবজেক্ট বানানো।
  • ফর্ম ডেটা ভ্যালিডেশন অনুযায়ী ফিল্ড যোগ/বদল।
  • API রিকোয়েস্ট পেলোড ডাইনামিক বানানো।

সতর্কতা

  • শর্ত `false` হলে `false` স্প্রেড হয় (হারMLESS, কিন্তু অপ্রয়োজনীয়)।
  • নেস্টেড অবজেক্টের জন্য ডিপ মার্জ দরকার (lodash merge)।
  • রিডেবিলিটি: জটিল শর্তের জন্য if/else বা টারনারি ভালো।
  1. জাভাস্ক্রিপ্টে অবজেক্টে প্রপার্টি আছে কিনা চেক করা

  2. জাভাস্ক্রিপ্টে অবজেক্টের অ্যারেতে প্রোপার্টি নাম রিপ্লেস করা

  3. জাভাস্ক্রিপ্টে জটিল অবজেক্ট থেকে id প্রোপার্টি দিয়ে সার্চ করা

  4. CSS filter প্রপার্টি অ্যানিমেশন দিয়ে পরিবর্তন করুন