কনটেক্সট বাউন্ড ফাংশন এবং _.bindAll ব্যবহার

Advanced Underscore.js Techniques - আন্ডারস্কোর.জেএস (underscorejs) - Web Development

299

কনটেক্সট বাউন্ড ফাংশন (Context-Bound Functions)

কনটেক্সট বাউন্ড ফাংশন হল এমন ফাংশন যেগুলি একটি নির্দিষ্ট this কনটেক্সটের সাথে বাঁধা থাকে। JavaScript-এ, ফাংশন যখন কল করা হয়, তখন তার this কী হবে তা সাধারণত কল কনটেক্সটের উপর নির্ভর করে। তবে কখনও কখনও, আমরা চাই যে একটি ফাংশন একটি নির্দিষ্ট অবজেক্টের কনটেক্সটের সাথে কাজ করুক, যদিও ফাংশনটি অন্য কোথাও কল করা হচ্ছে।

_.bind() ফাংশনটি ব্যবহার করে আপনি একটি ফাংশনকে নির্দিষ্ট কনটেক্সটের সাথে বাঁধতে পারেন। তবে, যদি আপনি একাধিক ফাংশনকে একই কনটেক্সটের সাথে বাঁধতে চান, তাহলে _.bindAll() ব্যবহার করা সহজ এবং সুবিধাজনক।


_.bind() এর ব্যবহার

_.bind() ফাংশনটি JavaScript-এর bind() ফাংশনের মতো কাজ করে, যা একটি ফাংশনকে একটি নির্দিষ্ট কনটেক্সটের সাথে বাঁধে, এবং পরবর্তী সময়ে যখন সেই ফাংশনটি কল করা হয়, তখন তার this কনটেক্সট হবে সেই নির্দিষ্ট অবজেক্ট।

সিনট্যাক্স:

_.bind(func, context, *arguments);
  • func: যে ফাংশনটিকে কনটেক্সটের সাথে বাঁধতে হবে।
  • context: যে অবজেক্টের কনটেক্সট ব্যবহার করতে হবে।
  • *arguments: (অপশনাল) যে আর্গুমেন্টগুলো আপনি ফাংশনে পাস করতে চান।

উদাহরণ:

var person = {
  name: "John",
  greet: function() {
    console.log("Hello, " + this.name);
  }
};

// `greet` ফাংশনকে `person` অবজেক্টের সাথে বাঁধা
var greetPerson = _.bind(person.greet, person);
greetPerson(); // Output: Hello, John

এখানে, greet ফাংশনটি person অবজেক্টের this কনটেক্সটের সাথে বাঁধা হয়েছে, তাই যখন greetPerson() কল করা হয়, তখন এটি সঠিক this কনটেক্সট ব্যবহার করে "Hello, John" প্রিন্ট করবে।


_.bindAll() এর ব্যবহার

_.bindAll() একটি Underscore.js ফাংশন যা একসাথে অনেকগুলো ফাংশনকে একটি নির্দিষ্ট কনটেক্সটের সাথে বাঁধতে সাহায্য করে। যখন একটি অবজেক্টে অনেকগুলো মেথড থাকে, তখন _.bindAll() ব্যবহার করে আপনি সব মেথডগুলোকে একই this কনটেক্সটের সাথে বাঁধতে পারেন, যাতে কোন সমস্যা না হয়।

সিনট্যাক্স:

_.bindAll(object, *methodNames);
  • object: যেটি অবজেক্ট যেখানে সমস্ত মেথড বাঁধা হবে।
  • *methodNames: ফাংশন বা মেথডের নাম, যেগুলি আপনি কনটেক্সটের সাথে বাঁধতে চান।

উদাহরণ:

var person = {
  name: "John",
  greet: function() {
    console.log("Hello, " + this.name);
  },
  sayGoodbye: function() {
    console.log("Goodbye, " + this.name);
  }
};

// `greet` এবং `sayGoodbye` মেথডগুলোকে `person` অবজেক্টের সাথে বাঁধা
_.bindAll(person, 'greet', 'sayGoodbye');

// এখন `greet` এবং `sayGoodbye` মেথড সঠিক কনটেক্সটের সাথে কাজ করবে
person.greet();      // Output: Hello, John
person.sayGoodbye(); // Output: Goodbye, John

এখানে, greet এবং sayGoodbye উভয় ফাংশন person অবজেক্টের কনটেক্সটের সাথে বাঁধা হয়েছে, তাই যখন আপনি এই ফাংশনগুলো কল করবেন, তখন this.name সঠিকভাবে "John" রিটার্ন করবে।


_.bindAll এবং this কনটেক্সটের সমস্যা সমাধান

JavaScript-এ অনেক সময় আমরা this কনটেক্সট নিয়ে সমস্যায় পড়ি, বিশেষ করে যখন কোনো ফাংশনকে আর্গুমেন্ট হিসেবে পাস করি অথবা কলব্যাক ফাংশন ব্যবহার করি। _.bindAll() এর মাধ্যমে আপনি সহজেই এই ধরনের সমস্যা এড়িয়ে যেতে পারেন এবং একটি নির্দিষ্ট কনটেক্সটের সাথে ফাংশনগুলোকে বাঁধতে পারেন।

উদাহরণ (callback function):

var person = {
  name: "John",
  greet: function() {
    console.log("Hello, " + this.name);
  }
};

// `setTimeout` এর কনটেক্সটে `this` হারিয়ে যাবে, তবে `_.bindAll` ব্যবহার করলে সমস্যা সমাধান হবে
_.bindAll(person, 'greet');

// এখন `greet` ফাংশন সঠিক `this` কনটেক্সটের সাথে কাজ করবে
setTimeout(person.greet, 1000); // Output: Hello, John

এখানে, setTimeout ফাংশন কল করার সময় this হারিয়ে যাওয়ার সমস্যা ছিল। _.bindAll() ব্যবহার করে আমরা greet মেথডটি person অবজেক্টের this কনটেক্সটের সাথে বাঁধলাম, যার ফলে সেটি সঠিকভাবে কাজ করেছে।


সারাংশ

_.bindAll() এবং _.bind() দুটি শক্তিশালী ফাংশন যা আপনাকে JavaScript-এ this কনটেক্সটের সমস্যা সমাধান করতে সাহায্য করে। _.bind() একটি একক ফাংশনকে একটি নির্দিষ্ট কনটেক্সটের সাথে বাঁধতে ব্যবহৃত হয়, আর _.bindAll() একাধিক ফাংশনকে একই কনটেক্সটের সাথে বাঁধতে ব্যবহৃত হয়। এই দুটি ফাংশন ব্যবহার করে আপনি ফাংশনাল প্রোগ্রামিংয়ের দক্ষতা উন্নত করতে পারেন এবং কোডের স্থিতিশীলতা বজায় রাখতে পারেন।

Content added By
Promotion

Are you sure to start over?

Loading...