28 KiB

Raw Blame History Unescape Escape

জাভাস্ক্রিপ্টের বেসিক: মেথড এবং ফাংশন

স্কেচনোট করেছেন Tomomi Imura

প্রি-লেকচার কুইজ

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

ফাংশন আপনাকে কোডের অংশগুলো একত্রিত করতে দেয়, যাতে আপনি সেগুলো আপনার প্রোগ্রামের বিভিন্ন জায়গায় পুনরায় ব্যবহার করতে পারেন। একই লজিক বারবার কপি-পেস্ট করার পরিবর্তে, আপনি একবার একটি ফাংশন তৈরি করতে পারেন এবং যখনই প্রয়োজন তখন এটি কল করতে পারেন। এই পদ্ধতি আপনার কোডকে সংগঠিত রাখে এবং আপডেট করা অনেক সহজ করে তোলে।

এই পাঠে, আপনি শিখবেন কীভাবে নিজের ফাংশন তৈরি করবেন, তাদের কাছে তথ্য পাঠাবেন এবং দরকারী ফলাফল ফিরে পাবেন। আপনি ফাংশন এবং মেথডের মধ্যে পার্থক্য বুঝতে পারবেন, আধুনিক সিনট্যাক্স পদ্ধতি শিখবেন এবং দেখবেন কীভাবে ফাংশন অন্য ফাংশনের সাথে কাজ করতে পারে। আমরা এই ধারণাগুলো ধাপে ধাপে তৈরি করব।

🎥 উপরের ছবিতে ক্লিক করুন মেথড এবং ফাংশন সম্পর্কে একটি ভিডিও দেখার জন্য।

আপনি এই পাঠটি Microsoft Learn এ নিতে পারেন!

ফাংশন

ফাংশন হলো একটি স্বতন্ত্র কোড ব্লক যা একটি নির্দিষ্ট কাজ সম্পাদন করে। এটি এমন একটি লজিককে একত্রিত করে যা আপনি যখনই প্রয়োজন তখন কার্যকর করতে পারেন।

আপনার প্রোগ্রামের বিভিন্ন জায়গায় একই কোড বারবার লেখার পরিবর্তে, আপনি এটি একটি ফাংশনে প্যাকেজ করতে পারেন এবং যখনই প্রয়োজন তখন এটি কল করতে পারেন। এই পদ্ধতি আপনার কোডকে পরিষ্কার রাখে এবং আপডেট করা অনেক সহজ করে তোলে। কল্পনা করুন, যদি আপনাকে আপনার কোডবেসের ২০টি ভিন্ন স্থানে ছড়িয়ে থাকা লজিক পরিবর্তন করতে হয়, তাহলে কতটা কঠিন হবে।

আপনার ফাংশনগুলোর নাম বর্ণনামূলকভাবে দেওয়া অত্যন্ত গুরুত্বপূর্ণ। একটি ভালো নামকরণ করা ফাংশন তার উদ্দেশ্য স্পষ্টভাবে প্রকাশ করে – যখন আপনি cancelTimer() দেখেন, তখন আপনি সঙ্গে সঙ্গে বুঝতে পারেন এটি কী করে, যেমন একটি স্পষ্টভাবে লেবেলযুক্ত বোতাম আপনাকে বলে দেয় ক্লিক করলে কী হবে।

ফাংশন তৈরি এবং কল করা

চলুন দেখি কীভাবে একটি ফাংশন তৈরি করা যায়। সিনট্যাক্স একটি ধারাবাহিক প্যাটার্ন অনুসরণ করে:

function nameOfFunction() { // function definition
 // function definition/body
}

এটি ভেঙে দেখি:

function কীওয়ার্ড জাভাস্ক্রিপ্টকে বলে "এই যে, আমি একটি ফাংশন তৈরি করছি!"
nameOfFunction হলো যেখানে আপনি আপনার ফাংশনকে একটি বর্ণনামূলক নাম দেন
বন্ধনী () হলো যেখানে আপনি প্যারামিটার যোগ করতে পারেন (আমরা শীঘ্রই এটি নিয়ে আলোচনা করব)
কার্লি ব্রেস {} এর মধ্যে থাকে সেই কোড যা আপনি ফাংশন কল করলে কার্যকর হয়

চলুন একটি সাধারণ অভিবাদন ফাংশন তৈরি করি এটি কার্যকরভাবে দেখার জন্য:

function displayGreeting() {
  console.log('Hello, world!');
}

এই ফাংশন কনসোলে "Hello, world!" প্রিন্ট করে। একবার আপনি এটি সংজ্ঞায়িত করলে, আপনি এটি যতবার প্রয়োজন ব্যবহার করতে পারেন।

আপনার ফাংশন কার্যকর করতে (বা "কল করতে"), এর নাম লিখুন এবং তারপরে বন্ধনী যোগ করুন। জাভাস্ক্রিপ্ট আপনাকে ফাংশন সংজ্ঞায়িত করার আগে বা পরে কল করার অনুমতি দেয় – জাভাস্ক্রিপ্ট ইঞ্জিন কার্যকর করার ক্রম পরিচালনা করবে।

// calling our function
displayGreeting();

যখন আপনি এই লাইনটি চালান, এটি আপনার displayGreeting ফাংশনের ভিতরের সমস্ত কোড কার্যকর করে, আপনার ব্রাউজারের কনসোলে "Hello, world!" প্রদর্শন করে। আপনি এই ফাংশনটি বারবার কল করতে পারেন।

Note: আপনি এই পাঠে মেথড ব্যবহার করছেন। console.log() হলো একটি মেথড – মূলত একটি ফাংশন যা console অবজেক্টের অন্তর্গত। মূল পার্থক্য হলো মেথড অবজেক্টের সাথে সংযুক্ত থাকে, যেখানে ফাংশন স্বাধীনভাবে থাকে। অনেক ডেভেলপার নৈমিত্তিক কথোপকথনে এই শব্দগুলো বিনিময় করে ব্যবহার করেন।

ফাংশন লেখার সেরা পদ্ধতি

ফাংশন লেখার জন্য কিছু টিপস:

আপনার ফাংশনগুলোর নাম স্পষ্ট এবং বর্ণনামূলক রাখুন – ভবিষ্যতে আপনি নিজেই এর জন্য কৃতজ্ঞ হবেন!
camelCasing ব্যবহার করুন বহু-শব্দের নামের জন্য (যেমন calculateTotal এর পরিবর্তে calculate_total)
প্রতিটি ফাংশনকে একটি কাজ ভালোভাবে সম্পাদন করার দিকে মনোযোগ দিন

ফাংশনে তথ্য পাঠানো

আমাদের displayGreeting ফাংশন সীমিত – এটি সবার জন্য শুধুমাত্র "Hello, world!" প্রদর্শন করতে পারে। প্যারামিটার আমাদের ফাংশনগুলোকে আরও নমনীয় এবং কার্যকরী করে তোলে।

প্যারামিটার হলো প্লেসহোল্ডার যা আপনি প্রতিবার ফাংশন ব্যবহার করার সময় বিভিন্ন মান প্রবেশ করাতে পারেন। এইভাবে, একই ফাংশন প্রতিবার ভিন্ন তথ্যের সাথে কাজ করতে পারে।

আপনার ফাংশন সংজ্ঞায়িত করার সময় বন্ধনীর ভিতরে প্যারামিটার তালিকাভুক্ত করুন, একাধিক প্যারামিটার থাকলে কমা দিয়ে আলাদা করুন:

function name(param, param2, param3) {

}

প্রতিটি প্যারামিটার একটি প্লেসহোল্ডারের মতো কাজ করে – যখন কেউ আপনার ফাংশন কল করবে, তারা প্রকৃত মান সরবরাহ করবে যা এই জায়গাগুলোতে প্লাগ ইন হবে।

চলুন আমাদের অভিবাদন ফাংশন আপডেট করি যাতে এটি কারও নাম গ্রহণ করতে পারে:

function displayGreeting(name) {
  const message = `Hello, ${name}!`;
  console.log(message);
}

লক্ষ্য করুন আমরা ব্যাকটিকস (`) এবং ${} ব্যবহার করছি নামটি সরাসরি আমাদের বার্তায় প্রবেশ করাতে – এটি একটি টেমপ্লেট লিটারাল বলা হয়, এবং এটি ভেরিয়েবল মিশ্রিত করে স্ট্রিং তৈরি করার একটি খুব সুবিধাজনক উপায়।

এখন যখন আমরা আমাদের ফাংশন কল করি, আমরা যেকোনো নাম পাস করতে পারি:

displayGreeting('Christopher');
// displays "Hello, Christopher!" when run

জাভাস্ক্রিপ্ট স্ট্রিং 'Christopher' গ্রহণ করে, এটি name প্যারামিটারে অ্যাসাইন করে এবং ব্যক্তিগতকৃত বার্তা "Hello, Christopher!" তৈরি করে।

ডিফল্ট মান

যদি আমরা কিছু প্যারামিটার ঐচ্ছিক করতে চাই, তাহলে ডিফল্ট মান খুবই কার্যকর!

ধরুন আমরা চাই মানুষ অভিবাদন শব্দটি কাস্টমাইজ করতে পারুক, কিন্তু যদি তারা নির্দিষ্ট না করে, তাহলে আমরা "Hello" ব্যবহার করব। আপনি ডিফল্ট মান সেট করতে পারেন সমান চিহ্ন ব্যবহার করে, ঠিক একটি ভেরিয়েবল সেট করার মতো:

function displayGreeting(name, salutation='Hello') {
  console.log(`${salutation}, ${name}`);
}

এখানে, name এখনও প্রয়োজনীয়, কিন্তু salutation এর একটি ব্যাকআপ মান 'Hello' আছে যদি কেউ ভিন্ন অভিবাদন সরবরাহ না করে।

এখন আমরা এই ফাংশনটি দুটি ভিন্ন উপায়ে কল করতে পারি:

displayGreeting('Christopher');
// displays "Hello, Christopher"

displayGreeting('Christopher', 'Hi');
// displays "Hi, Christopher"

প্রথম কলটিতে, জাভাস্ক্রিপ্ট ডিফল্ট "Hello" ব্যবহার করে কারণ আমরা কোনো অভিবাদন নির্দিষ্ট করিনি। দ্বিতীয় কলটিতে, এটি আমাদের কাস্টম "Hi" ব্যবহার করে। এই নমনীয়তা ফাংশনগুলোকে বিভিন্ন পরিস্থিতিতে মানিয়ে নিতে সক্ষম করে।

রিটার্ন মান

আমাদের ফাংশনগুলো এখন পর্যন্ত শুধু কনসোলে বার্তা প্রিন্ট করেছে, কিন্তু যদি আপনি চান একটি ফাংশন কিছু গণনা করে আপনাকে ফলাফল ফিরিয়ে দিক?

এটি রিটার্ন মান যেখানে আসে। শুধু কিছু প্রদর্শন করার পরিবর্তে, একটি ফাংশন আপনাকে একটি মান ফিরিয়ে দিতে পারে যা আপনি একটি ভেরিয়েবলে সংরক্ষণ করতে পারেন বা আপনার কোডের অন্য অংশে ব্যবহার করতে পারেন।

একটি মান ফিরিয়ে দিতে, আপনি return কীওয়ার্ড ব্যবহার করেন এবং তারপরে যা ফিরিয়ে দিতে চান তা লিখুন:

return myVariable;

এখানে একটি গুরুত্বপূর্ণ বিষয়: যখন একটি ফাংশন একটি return স্টেটমেন্টে পৌঁছায়, এটি সঙ্গে সঙ্গে চলা বন্ধ করে এবং সেই মানটি ফিরে দেয় যিনি এটি কল করেছেন।

চলুন আমাদের অভিবাদন ফাংশনটি পরিবর্তন করি যাতে এটি বার্তা প্রিন্ট করার পরিবর্তে বার্তা ফিরিয়ে দেয়:

function createGreetingMessage(name) {
  const message = `Hello, ${name}`;
  return message;
}

এখন এই ফাংশনটি অভিবাদন তৈরি করে এবং আমাদের কাছে ফিরিয়ে দেয়।

ফিরিয়ে দেওয়া মানটি ব্যবহার করতে, আমরা এটি একটি ভেরিয়েবলে সংরক্ষণ করতে পারি ঠিক অন্য যেকোনো মানের মতো:

const greetingMessage = createGreetingMessage('Christopher');

এখন greetingMessage এ "Hello, Christopher" রয়েছে এবং আমরা এটি আমাদের কোডের যেকোনো জায়গায় ব্যবহার করতে পারি – একটি ওয়েবপেজে প্রদর্শন করতে, একটি ইমেইলে অন্তর্ভুক্ত করতে, বা অন্য একটি ফাংশনে পাস করতে।

ফাংশনগুলোকে ফাংশনের প্যারামিটার হিসেবে ব্যবহার করা

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

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

চলুন setTimeout দেখি, যা একটি বিল্ট-ইন ফাংশন যা নির্দিষ্ট সময় অপেক্ষা করে এবং তারপরে কিছু কোড চালায়। আমাদের বলতে হবে এটি কী কোড চালাবে – ফাংশন পাস করার জন্য এটি একটি আদর্শ ব্যবহার।

এই কোডটি চেষ্টা করুন – ৩ সেকেন্ড পরে, আপনি একটি বার্তা দেখতে পাবেন:

function displayDone() {
  console.log('3 seconds has elapsed');
}
// timer value is in milliseconds
setTimeout(displayDone, 3000);

লক্ষ্য করুন আমরা displayDone (বন্ধনী ছাড়া) setTimeout এ পাস করছি। আমরা নিজেরাই ফাংশনটি কল করছি না – আমরা এটি setTimeout এর কাছে হস্তান্তর করছি এবং বলছি "৩ সেকেন্ডে এটি কল করো।"

অ্যানোনিমাস ফাংশন

কখনও কখনও আপনি একটি ফাংশন শুধুমাত্র একটি কাজের জন্য প্রয়োজন এবং এটিকে একটি নাম দিতে চান না। ভাবুন – যদি আপনি একটি ফাংশন শুধুমাত্র একবার ব্যবহার করেন, তাহলে কেন আপনার কোডে একটি অতিরিক্ত নাম যোগ করবেন?

জাভাস্ক্রিপ্ট আপনাকে অ্যানোনিমাস ফাংশন তৈরি করতে দেয় – নাম ছাড়া ফাংশন যা আপনি যেখানে প্রয়োজন সেখানে সংজ্ঞায়িত করতে পারেন।

আমাদের টাইমার উদাহরণটি একটি অ্যানোনিমাস ফাংশন ব্যবহার করে পুনরায় লিখি:

setTimeout(function() {
  console.log('3 seconds has elapsed');
}, 3000);

এটি একই ফলাফল অর্জন করে, কিন্তু ফাংশনটি সরাসরি setTimeout কলের মধ্যে সংজ্ঞায়িত করা হয়েছে, একটি পৃথক ফাংশন ঘোষণা করার প্রয়োজন দূর করে।

ফ্যাট অ্যারো ফাংশন

আধুনিক জাভাস্ক্রিপ্টে ফাংশন লেখার আরও সংক্ষিপ্ত একটি উপায় হলো অ্যারো ফাংশন। এগুলো => ব্যবহার করে (যা দেখতে একটি তীরের মতো – বুঝলেন তো?) এবং ডেভেলপারদের মধ্যে খুব জনপ্রিয়।

অ্যারো ফাংশন আপনাকে function কীওয়ার্ড বাদ দিতে দেয় এবং আরও সংক্ষিপ্ত কোড লিখতে সাহায্য করে।

আমাদের টাইমার উদাহরণটি একটি অ্যারো ফাংশন ব্যবহার করে লিখি:

setTimeout(() => {
  console.log('3 seconds has elapsed');
}, 3000);

() হলো যেখানে প্যারামিটারগুলো যাবে (এই ক্ষেত্রে খালি), তারপর আসে তীর =>, এবং শেষে কার্লি ব্রেসে ফাংশনের বডি। এটি একই কার্যকারিতা প্রদান করে আরও সংক্ষিপ্ত সিনট্যাক্সের মাধ্যমে।

কখন কোন পদ্ধতি ব্যবহার করবেন

কখন কোন পদ্ধতি ব্যবহার করবেন? একটি ব্যবহারিক নির্দেশিকা: যদি আপনি ফাংশনটি একাধিকবার ব্যবহার করবেন, তাহলে এটিকে একটি নাম দিন এবং আলাদাভাবে সংজ্ঞায়িত করুন। যদি এটি একটি নির্দিষ্ট ব্যবহারের জন্য হয়, তাহলে একটি অ্যানোনিমাস ফাংশন বিবেচনা করুন। অ্যারো ফাংশন এবং প্রচলিত সিনট্যাক্স উভয়ই বৈধ পছন্দ, যদিও আধুনিক জাভাস্ক্রিপ্ট কোডবেসে অ্যারো ফাংশন বেশি ব্যবহৃত হয়।

🚀 চ্যালেঞ্জ

আপনি কি এক বাক্যে ফাংশন এবং মেথডের মধ্যে পার্থক্য ব্যাখ্যা করতে পারবেন? চেষ্টা করুন!

GitHub Copilot Agent চ্যালেঞ্জ 🚀

Agent মোড ব্যবহার করে নিম্নলিখিত চ্যালেঞ্জটি সম্পূর্ণ করুন:

বর্ণনা: এই পাঠে আলোচনা করা বিভিন্ন ফাংশন ধারণা প্রদর্শন করে এমন একটি গাণিতিক ফাংশনের ইউটিলিটি লাইব্রেরি তৈরি করুন, যার মধ্যে প্যারামিটার, ডিফল্ট মান, রিটার্ন মান এবং অ্যারো ফাংশন অন্তর্ভুক্ত থাকবে।

প্রম্পট: mathUtils.js নামে একটি জাভাস্ক্রিপ্ট ফাইল তৈরি করুন যাতে নিম্নলিখিত ফাংশনগুলো থাকে:

একটি ফাংশন add যা দুটি প্যারামিটার গ্রহণ করে এবং তাদের যোগফল ফিরিয়ে দেয়
একটি ফাংশন multiply যার ডিফল্ট প্যারামিটার মান রয়েছে (দ্বিতীয় প্যারামিটার ডিফল্টে ১)
একটি অ্যারো ফাংশন square যা একটি সংখ্যা গ্রহণ করে এবং তার বর্গফল ফিরিয়ে দেয়
একটি ফাংশন calculate যা অন্য একটি ফাংশনকে প্যারামিটার হিসেবে গ্রহণ করে এবং দুটি সংখ্যার উপর সেই ফাংশন প্রয়োগ করে
প্রতিটি ফাংশন কল করার জন্য উপযুক্ত টেস্ট কেস প্রদর্শন করুন

Agent মোড সম্পর্কে আরও জানুন এখানে।

পোস্ট-লেকচার কুইজ

পর্যালোচনা এবং স্ব-অধ্যয়ন

অ্যারো ফাংশন সম্পর্কে আরও পড়া মূল্যবান হতে পারে, কারণ এগুলো ক্রমবর্ধমানভাবে কোডবেসে ব্যবহার করা হচ্ছে। একটি ফাংশন লিখুন, এবং তারপর এই সিনট্যাক্স ব্যবহার করে এটি পুনরায় লিখুন।

অ্যাসাইনমেন্ট

ফান উইথ ফাংশন

অস্বীকৃতি:
এই নথিটি AI অনুবাদ পরিষেবা Co-op Translator ব্যবহার করে অনুবাদ করা হয়েছে। আমরা যথাসাধ্য সঠিকতার জন্য চেষ্টা করি, তবে অনুগ্রহ করে মনে রাখবেন যে স্বয়ংক্রিয় অনুবাদে ত্রুটি বা অসঙ্গতি থাকতে পারে। মূল ভাষায় থাকা নথিটিকে প্রামাণিক উৎস হিসেবে বিবেচনা করা উচিত। গুরুত্বপূর্ণ তথ্যের জন্য, পেশাদার মানব অনুবাদ সুপারিশ করা হয়। এই অনুবাদ ব্যবহারের ফলে কোনো ভুল বোঝাবুঝি বা ভুল ব্যাখ্যা হলে আমরা দায়ী থাকব না।

28 KiB Raw Blame History Unescape Escape