জাভাস্ক্রিপ্ট ফাংশনকে ৪ ভাবে কল(invoke) করা যায়।
প্রত্যেকটি মেথড this এর ইনিশিয়ালাইজেশনের ভিন্নতার কারণে পৃথক।
জাভাস্ক্রিপ্টে this কি-ওয়ার্ডটি ঐ অবজেক্টকে বুঝাবে, যে অবজেক্টের কোডের মধ্যে ইহা থাকবে।
যদি আমি একটি ফাংশনের মধ্যে this ব্যবহার করি, তাহলে ফাংশনটি যে অবজেক্টের মধ্যে রয়েছে this কি-ওয়ার্ডটি ঐ অবজেক্টকে বুঝায়।
আমরা জানি যে,জাভাস্ক্রিপ্ট ফাংশনকে এক্সিকিউট করার জন্য একে ইনভোক/কল করতে হয়।
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p>
গ্লোবাল ফাংশন (myFunction) ফেরত দেয় আর্গুমেন্টগুলোর গুনফল (a ,b):
</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return a * b;
}
document.getElementById("demo").innerHTML = myFunction(10, 2);
</script>
</body>
</html>উপরের ফাংশনটি কোনো অবজেক্টের অধীনে নয়। কিন্তু জাভাস্ক্রিপ্টে সবসময় একটি ডিফল্ট গ্লোবাল অবজেক্ট থাকে।
এইচটিএমএল-এ এইচটিএমল পেজ হলো ডিফল্ট গ্লোবাল অবজেক্ট, উপরের ফাংশনটি এইচটিএমল পেজের অধীনে রয়েছে।
ব্রাউজারে ব্রাউজার উইন্ডো হলো পেজের অবজেক্ট। এক্ষেত্রে ফাংশনটি স্বয়ংক্রিয়ভাবে উইন্ডোর ফাংশনে রূপান্তরিত হয়।
myFunction() এবং window.myFunction() একইঃ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p>গ্লোবাল ফাশংনটি স্বয়ংক্রিয়ভাবেই উইন্ডো ফাংশনে রূপান্তরিত হয়েছে। </p>
<p>myFunction() এবং window.myFunction() একই</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return a * b;
}
document.getElementById("demo").innerHTML = window.myFunction(10, 2);
</script>
</body>
</html>
ইহা জাভাস্ক্রিপ্ট ফাংশনকে কল করার একটি সাধারণ পন্থা, কিন্তু আমরা এমনটা অনুশীলন করবো না।
গ্লোবাল ভ্যারিয়েবল, মেথড অথবা ফাংশন ব্যবহার থেকে আমরা বিরত থাকবো।
ফাংশন কল করার সময় ইহা কোন অবজেক্টের অধীনস্থ উল্লেখ না থাকলে this এর ভ্যালু গ্লোবাল অবজেক্ট হয়ে যায়।
ওয়েব ব্রাউজারে গ্লোবাল অবজেক্ট হলো ব্রাউজার উইন্ডো।
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p>উইন্ডোর অবজেক্ট এর এইচটিএমএল এ <b>this</b>, এর মানটি গ্লোবাল ফাশংন। </p>
<p id="demo"></p>
<script>
function myFunction() {
return this;
}
document.getElementById("demo").innerHTML = myFunction();
</script>
</body>
</html>জাভাস্ক্রিপ্টে আপনি ফাংশনকে অবজেক্টের মেথড হিসেবে ডিফাইন করতে পারেনঃ
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p>myObject.fullName() ফেরত দেয় আজিজুর রহমান:</p>
<p id="demo"></p>
<script>
var myObject = {
firstName:"আজিজুর",
lastName: "রহমান",
fullName: function() {
return this.firstName + " " + this.lastName;
}
}
document.getElementById("demo").innerHTML = myObject.fullName();
</script>
</body>
</html>fullName মেথডটি myObject অবজেক্টের মধ্যে বিদ্যমান একটি ফাংশন।
এখানে this দ্বারা myObject কে বুঝানো হয়েছে।
অবজেক্ট মেথড এর thisমানটি ,অবজেক্ট এর মালিক।
[object Object]
অবজেক্ট মেথড হিসেবে একটি ফাংশনকে কল করার কারণে this এর ভ্যালু এখানে অবজেক্ট দেখায়।
যদি new কি-ওয়ার্ড দ্বারা ফাংশনকে কল করা হয় তাহলে একে কনস্ট্রাক্টর ইনভোক করা বুঝায়।
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p>এই উদাহরনে,myFunction একটি ফাশংন এর রচয়িতাঃ</p>
<p id="demo"></p>
<script>
function myFunction(arg1, arg2) {
this.firstName = arg1;
this.lastName = arg2;
}
var x = new myFunction("আজিজুর","রহমান")
document.getElementById("demo").innerHTML = x.firstName;
</script>
</body>
</html>একটি কনস্ট্রাক্টরকে ইনভোক করলে সেটি নতুন অবজেক্ট তৈরি করে। নতুন অবজেক্টটি তার কনস্ট্রাক্টর থেকে প্রোপার্টি ও মেথড ইনহেরিট করে।
কনস্ট্রাক্টরের this কি-ওয়ার্ডের কোনো ভ্যালু নেই।
যখন কনস্ট্রাক্টরকে ইনভোক করা হয় নতুন অবজেক্টটি this-এর ভ্যালু হবে।
জাভাস্ক্রিপ্টে ফাংশন হলো অবজেক্ট। জাভাস্ক্রিপ্ট ফাংশনের প্রোপার্টি ও মেথড থাকে।
call() এবং apply() জাভাস্ক্রিপ্ট ফাংশনের দুইটি প্রিডিফাইনড মেথড। মেথড দুইটিই ফাংশন ইনভোক করার জন্য ব্যবহার করা যায় এবং উভয় মেথডেরই প্রথম প্যারামিটার হিসেবে একটি অবজেক্ট থাকে।
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p id="demo"></p>
<script>
var myObject;
function myFunction(a, b) {
return a * b;
}
myObject = myFunction.call(myObject, 10, 2);
document.getElementById("demo").innerHTML = myObject;
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>জাভাস্ক্রিপ্ট উদাহরণ</title>
</head>
<body>
<p id="demo"></p>
<script>
var myObject, myArray;
function myFunction(a, b) {
return a * b;
}
myArray = [10, 2]
myObject = myFunction.apply(myObject, myArray);
document.getElementById("demo").innerHTML = myObject;
</script>
</body>
</html>উভয়ই মেথডই প্রথম আর্গুমেন্ট হিসেবে একটি অবজেক্ট গ্রহন করে। পার্থক্য শুধুমাত্র call() ফাংশন আর্গুমেন্টগুলো আলাদাভাবে গ্রহন করে এবং apply() ফাংশনের আর্গুমেন্টগুলো অ্যারে আকারে আকারে করে।
জাভাস্ক্রিপ্ট স্ট্রিক্ট মুডে(use strict) ফাংশন ইনভোকের সময় প্রথম আর্গুমেন্টটি this এর ভ্যালু হয়ে যায়, যদিও আর্গুমেন্টটি অবজেক্ট নয়। স্ট্রিক মুডে প্রথম আর্গুমেন্ট না দেওয়া হলে এঁরর দেখাবে। নন-স্ট্রিক্ট মুডে গ্লোবাল অবজেক্ট রুপান্তরিত হবে।
Read more
or
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ducimus nihil, quo, quis minus aspernatur expedita, incidunt facilis aliquid inventore voluptate dolores accusantium laborum labore a dolorum dolore omnis qui? Consequuntur sed facilis repellendus corrupti amet in quibusdam ducimus illo autem, a praesentium.
1 hour ago
