Header Ads

Javascript Function জাভাস্ক্রিপ্ট ফাংশন

জাভাস্ক্রিপ্ট ফাংশন(Function)

Image result for javascript function()

জাভাস্ক্রিপ্ট ফাংশন হচ্ছে একগুচ্ছ কোড যা কোন নির্দিষ্ট কাজ সম্পাদন করার জন্য তৈরি করা হয়।
জাভাস্ক্রিপ্ট ফাংশন নিজে নিজে সম্পাদিত(execution) হয় না। এটা সম্পাদিত হয় যখন কোন কিছুর মাধ্যমে একে ডাকা হয়।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>

<h4> এই উদাহারনে একটি ফাংশন কল করে যা একটি ক্যালকুলেশন এক্সিকিউট করে এবং নিম্নোক্ত ফলাফল প্রদান করেঃ </h4>

<p id="test"></p>

<script>
function myFunc(a, b) {
    return a * b;
}
document.getElementById("test").innerHTML = myFunc(5, 2);
</script>

</body>
</html>


ফলাফল




জাভাস্ক্রিপ্ট ফাংশনের গঠনপ্রণালী(Syntax)

জাভাস্ক্রিপ্ট ফাংশন তৈরি করতে প্রথমে function কিওয়ার্ড(keyword) লিখতে হবে, তারপর ফাংশনের নাম এবং এর ডান পাশে () এবং এর ডানপাশে {} লিখতে হয়।
ফাংশনের নাম সাধারনত অক্ষর(letters),সংখ্যা(digits),আন্ডারস্কোর(_), ডলার($) চিহ্ন দিয়ে লেখা যায়।
প্রথম বন্ধনীর মাঝের প্যারামিটারগুলো কমার(,) মাধ্যমে আলাদা করা হয়ঃ (parameter1,  parameter2, ...)
দ্বিতীয় বন্ধনীর {} মধ্যে অবস্থিত কোডগুলো ফাংশনকে কল করার মাধ্যমে সম্পাদিত হয়।
function name(parameter1, parameter2, parameter3) {
    সম্পাদনযোগ্য কোড
}

ফাংশন প্যারামিটার(parameter) হচ্ছে ফাংশন ডেফিনেশনের প্রথম বন্ধনীর মধ্যে ব্যবহৃত নাম
ফাংশন আর্গুমেন্ট(arguments) হচ্ছে ফাংশনকে ডাকার(invoke) সময় প্যারামিটারের মান যেগুলো ফাংশন ব্যবহার করে।
ফাংশনের মধ্যে আর্গুমেন্টগুলো লোকাল ভ্যারিয়েবলের(local variables) মত আচরণ করে।
Noteজাভাস্ক্রিপ্টের ফাংশনগুলো অন্যান্য প্রোগ্রামিং ল্যাঙ্গুয়েজের প্রসিডিউর(Procedure) অথবা সাব্রুটিনের(Subroutine) মত।

ফাংশন ডাকা(Invocation)

কোন কিছুর মাধ্যমে ফাংশনকে ডাক(Call) দেওয়া হলে ফাংশনের ভিতরের কোডগুলো সম্পাদিত(Execution) হয়ঃ
  • যখন কোন ইভেন্ট ঘটে (ব্যবহারকারী বাটনে ক্লিক করলে)
  • যখন একে ডাকা(Call) হয়
  • স্বয়ংক্রিয়ভাবে (নিজেই নিজেকে কল করে)
এই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে ফাংশন কল সম্পর্কে আপনি আরো শিখবেন।

ফাংশন রিটার্ন(Return)

জাভাস্ক্রিপ্ট রিটার্ন(return) স্টেটমেন্টের কাছে পৌঁছালে ফাংশন এক্সিকিউশন বন্ধ হয়ে যায়।
যদি ফাংশনকে কোন স্টেটমেন্টে কল করা হয় তাহলে জাভাস্ক্রিপ্ট ঐ স্টেটমেন্টের পরে সেই ফাংশনের কোড করার জন্য ফেরত যায়।
ফাংশন প্রায়ই রিটার্ন(return) ভ্যালু এক্সিকিউট করে। রিটার্নকৃত ভ্যালু কলারের(Caller) কাছে ফেরত পাঠানো হয়ঃ

উদাহরণ

দুইটি সংখ্যার গুণফল রিটার্ন করিঃ
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>

<h4> এই উদাহারনে একটি ফাংশন কল করে যা একটি ক্যালকুলেশন এক্সিকিউট করে এবং নিম্নোক্ত ফলাফল প্রদান করেঃ </h4>

<p id="test"></p>

<script>
function myFunc(a, b) {
    return a * b;
}
document.getElementById("test").innerHTML = myFunc(5, 2);
</script>

</body>
</html>


ফলাফল




ফাংশন কেন?

আপনি কোড বারবার ব্যবহার করতে পারবেনঃ কোড একবার লিখে অসংখ্যবার ব্যবহার করতে পারবেন।
ভিন্ন ভিন্ন ফলাফল পাওয়ার জন্য আপনি বিভিন্ন আর্গুমেন্ট ব্যবহার করে একই কোড অনেকবার ব্যবহার করতে পারেন।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>

<h4> এই উদাহারনে একটি ফাংশন ভিন্ন ভিন্ন আর্গুমেন্ট দ্বারা কল করে যা একাধিক ক্যালকুলেশন এক্সিকিউট করে এবং নিম্নোক্ত ফলাফল প্রদান করেঃ </h4>

<p id="test"></p>

<script>
function myFunc(a, b) {
    return a * b;
}
document.getElementById("test").innerHTML = myFunc(5, 2) + "<br>" + myFunc(6, 4);
</script>

</body>
</html>


ফলাফল




() অপারেটর ফাংশনকে কল করে

উপরোক্ত উদাহরনে ব্যবহৃত toCelsius দ্বারা ফাংশন অবজেক্টকে বুঝা‍য় এবং toCelsius() দ্বারা ফাংশনের ফলাফলকে বুঝায়।

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>

<h4> () ছাড়া ফাংশন এক্সেস করলে ফাংশন ডেফিনেশন রিটার্ন হয়ঃ </h4>

<p id="test"></p>

<script>
function myFunc(a, b) {
    return a * b;
}
document.getElementById("test").innerHTML = myFunc;
</script>

</body>
</html>


ফলাফল




ফাংশনকে ভ্যারিয়েবল হিসেবে ব্যবহার

জাভাস্ক্রিপ্টে আপনি ফাংশনকে ভ্যারিয়েবলের মত ব্যবহার করতে পারেন।
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>

<p id="test"></p>

<script>
function myFunc(a, b) {
    return a * b;
}
var result = myFunc(5, 2);
document.getElementById("test").innerHTML = "ফলাফল হলো " + result ;
</script>

</body>
</html>

একটি ফাংশনের রিটার্ন ভ্যালু একটি ভ্যারিয়েবলে জমা না রেখেঃ
আপনি ফাংশনকে সরাসরি ভ্যারিয়েবলের মত ব্যবহার করতে পারেনঃ

উদাহরণ

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>

<p id="test"></p>

<script>
function myFunc(a, b) {
    return a * b;
}
document.getElementById("test").innerHTML = "ফলাফল হলো " + myFunc(5, 2) ;
</script>

</body>
</html>


ফলাফল



Noteএই টিউটোরিয়ালের পরবর্তী পরিচ্ছেদে আপনি ফাংশন সম্পর্কে আরো শিখবেন।

No comments

Powered by Blogger.