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

জাভাস্ক্রিপ্টে ফাংশন চেইনিং কী?


ফাংশন চেইনিং

ফাংশন চেইনিং হলো ডট নোটেশন ব্যবহার করে একাধিক ফাংশনকে একসাথে একটি লাইনে গ্রুপ করা। এই চেইনিং কোডকে সংক্ষিপ্ত করে এবং পারফরম্যান্স বাড়ায়। এখানে নরম্যাল অবজেক্ট ব্যবহার করে ফাংশন চেইনিং শিখব।

ক) ফাংশন চেইনিং ছাড়া

নিচের উদাহরণে 'obj' অবজেক্ট তৈরি করা হয়েছে এবং সেখানে 'this' কীওয়ার্ড দিয়ে 'i' নামে একটি পাবলিক প্রোপার্টি তৈরি করা হয়েছে যার প্রাথমিক মান ০। পরে add(), subtract() এবং print() নামে তিনটি ইউজার-ডিফাইনড ফাংশন অবজেক্টের ভিতরে তৈরি করা হয়েছে। এখন "obj" অবজেক্ট একটি ক্লাসের মতো কাজ করে (এই প্রোপার্টিগুলো অন্যান্য অবজেক্ট শেয়ার করতে পারে)।

এখন 'new' কীওয়ার্ড ব্যবহার করে 'x' নামে একটি অবজেক্ট তৈরি করা হয়েছে যা "obj"-এর প্রোপার্টিগুলো অ্যাক্সেস করতে পারে। যেহেতু "obj"-এর ভিতরে ঘোষিত ফাংশনগুলো (add, subtract, print) কিছু রিটার্ন করে না, তাই ফাংশন চেইনিং সম্ভব হয় না এবং আউটপুট হিসেবে undefined দেখায়। তবে আলাদা আলাদা (unchained) কল করলে আউটপুট ৩ আসে (৫-২)।

উদাহরণ

<html> <body> <script>    var obj = function(){       this.i = 0;       this.add = function(i){          this.i += i;        };        this.subtract = function(i){           this.i -= i;        };        this.print = function(){           document.write(this.i);           document.write("<br>");           document.write(x.add(3));  // returns undefined        }    }    var x = new obj();    x.add(5);    x.subtract(2);    x.print(); // 5-2 = 3 so prints 3.    x.add(5).subtract(2).print();  //  function chaining is not possible so undefined </script> </body> </html>

আউটপুট

3 undefined

খ) ফাংশন চেইনিং সহ

নিচের উদাহরণে, উপরের পরিস্থিতি বিবেচনা করে, ইউজার-ডিফাইনড "return this" স্টেটমেন্ট ব্যবহার করে add() এবং subtract() ফাংশনগুলো রিটার্ন করা হয়েছে, ফলে ফাংশন চেইনিং সম্ভব হয়েছে এবং আউটপুট ৩ দেখায়।

উদাহরণ

<html> <body> <script>    var obj = function(){       this.i = 0;       this.add = function(i){          this.i += i;          return this;       };       this.subtract = function(i){          this.i -= i;          return this;       };       this.print = function(){          document.write(this.i);       }    } var x = new obj(); x.add(5).subtract(2).print(); </script> </body> </html>

আউটপুট

3
  1. জাভাস্ক্রিপ্টে setTimeout() মেথড কী?

  2. জাভাস্ক্রিপ্টে অ্যানোনিমাস ফাংশন কী?

  3. জাভাস্ক্রিপ্টে ফাংশন এক্সপ্রেশন কী?

  4. জাভাস্ক্রিপ্টে ক্লোジャー (Closures) কী?