JS Callback Function

#javascript #callback #function #webdev

Callback function কি ?

jS এ কোন একটি function কে অন্য আরেকটা function এর প্যারামিটার হিসেবে pass করা হয় তখন সেই function কে callback function বলা হয় ।

function anotherFunction(callback){
  callback()
}

উপরে anotherFunction নামে একটি function ডিফাইন করা হয়েছে,সেই function এর প্যারামিটারে আমরা callback নামে একটা প্যারামিটার নিয়েছি এবং সেটি anotherFuntion এর ভিতরে function call এর মতো করে call করেছি । অর্থাৎ আমরা আশা করি যে যখন ডেভেলপার anotherFunction কে invoke বা call করবে তখন anotherFunction এর argument হিসেবে একটি function কে pass করবে।

function simpleTextLog(){
  console.log("simple text showing")
}
anotherFunction(simpleTextLog)

output : simple text showing

কেন Callback Function প্রয়োজন ?

মূলত asynchronous প্রোগ্রামিং এর ক্ষেত্রে callback function টি ব্যাপক ভাবে ব্যাবহার করা হয় তবুও নিচে ছোট একটি উদাহারন দিলাম।

আমরা জানি যে js এ কোড উপর থেকে নিচে লাইন বাই লাইন execute হয় । এখন যদি আমরা চাই, আমদের কোন একটা function এর কাজ শেষ হলে আরেকটি function এর কাজ শুরু হবে । সেই ক্ষেত্রে আমরা অনেক উপায়ে Function Sequence Control করতে পারি ।

যেমন : আমরা চাচ্ছি যে, দুইটি সংখ্যার যোগ ফল ডিসপ্লে করতে । সেই জন্য আমরা যোগ করার জন্য একটি function তৈরি করবো,যার কাজ হবে যোগ করা এবং ডিসপ্লে করার জন্য আরেকটি function তৈরি করবো,যার কাজ হবে শুধু ডিসপ্লে করা ।

Ex-1

function displaySum(sum){
 console.log(`total sum is ${sum}`);
}

function doSum(num1,num2){
   const sum = num1 + num2;
   return sum;
}

const result = doSum(5,7)
displaySum(result)

Ex-2

function displaySum(sum){
 console.log(`total sum is ${sum}`);
}

function doSum(num1,num2){
   const sum = num1 + num2;
  displaySum(sum)
}

doSum(5,7)

Ex-1 এ কাজটি করার জন্য আমাদের দুটি function আলাদা করে পর পর কল করা লাগতেছে । এখানে displaySum function টি doSum function এর উপর নির্ভরশীল ছিলো । তাই এই ক্ষেত্রে এই উদাহারন কে আমরা batter Function Sequence Control বলতে পারি না ।

Ex-2 এটিও batter Function Sequence Control বলতে পারি না । কারণ ফলাফল ডিসপ্লে করার জন্য doSum function থেকে displaySum function কে control করা যাচ্ছে না । মনে করেন আপনি চাচ্ছেন যে doSum function টি আপনার আপ্লিকেশনে 3 বার কল করতে চাচ্ছেন । এখন 3 বার কল করার সময় displaySum function কল হয়ে যাবে কিন্তু আপনি চাচ্ছেন যে doSum function থেকে শুধু মাত্র একবার বা আপনার ইচ্ছা মতো displaySum function কল করবেন। সেটি করার জন্যই আমাদের callback function ব্যাবহার করতে হবে।

callback function এর মাদ্ধমে doSum function থেকে displaySum function কে control করা যাবে।
যেমন :

function displaySum(sum){
 console.log(`total sum is ${sum}`);
}

function doSum(num1,num2,cb){
   const sum = num1 + num2;
  cb && cb(sum)
}

doSum(5,7,displaySum) //output: total sum is 12
doSum(5,7) //output: undefined

উপরের কোডে displaySum function হলো callback function যেটি doSum function এর argument হিসবে pass হয়েছে ।

*নোট : callback function হিসেবে যখন কোন function কে argument হিসেবে পাঠাবেন তখন function এর reference পাঠাতে হয় । সেই জন্য function এর name এর সাথে কখনো "()" ব্র্যাকেট বা parentheses ব্যবহার করবেন না । যখন কোন একটা function এর name এর সাথে ব্র্যাকেট বা parentheses ব্যবহার করা হয় তখন সেই function টি কল হয়ে যায় । *