ফাংশন তৈরি করে এমন স্ট্যান্ডার্ড ফর্মগুলির রুনডাউন এখানে রয়েছে: (মূলত অন্য প্রশ্নের জন্য লিখিত, তবে ক্যানোনিকাল প্রশ্নে স্থানান্তরিত হওয়ার পরে অভিযোজিত))
শর্তাবলী:
দ্রুত তালিকা:
কার্য ঘোষণা
"অজ্ঞাতনামা" functionএক্সপ্রেশন (যা শব্দ থাকা সত্ত্বেও কখনও কখনও নামের সাথে ফাংশন তৈরি করে)
নামকরণ functionএক্সপ্রেশন
অ্যাকসেসর ফাংশন ইনিশিয়ালাইজার (ES5 +)
তীর ফাংশন এক্সপ্রেশন (ES2015 +) (যা বেনামে ফাংশন এক্সপ্রেশনগুলির মতো, একটি স্পষ্ট নাম জড়িত না, এবং এখনও নাম সহ ফাংশন তৈরি করতে পারে)
অবজেক্ট ইনিশিয়ালাইজারে পদ্ধতি ঘোষণা (ES2015 +)
class(ES2015 +) এর মধ্যে নির্মাতা এবং পদ্ধতি ঘোষণা
কার্য ঘোষণা
প্রথম রূপটি একটি ফাংশন ঘোষণা , যা দেখতে এটির মতো দেখাচ্ছে:
function x() {
console.log('x');
}
একটি ফাংশন ঘোষণা একটি ঘোষণা ; এটি কোনও বিবৃতি বা অভিব্যক্তি নয়। যেমন, আপনি এটির সাথে অনুসরণ করেন না ;(যদিও এটি করা নিরীহ)।
কোনও ধাপে ধাপে কোড কার্যকর করার আগে , কার্যকর হওয়া প্রসঙ্গে প্রবেশের সময় একটি ফাংশন ঘোষণা প্রক্রিয়া করা হয়। এটি তৈরি করে ফাংশনটি একটি যথাযথ নাম দেওয়া হয় ( xউপরের উদাহরণে), এবং সেই নামটি সেই সুযোগে রাখা হয় যেখানে ঘোষণাপত্রটি উপস্থিত হয়।
যেহেতু এটি একই প্রসঙ্গে কোনও ধাপে ধাপে কোডের আগে প্রক্রিয়াজাত করা হয়, আপনি এই জাতীয় জিনিসগুলি করতে পারেন:
x(); // Works even though it's above the declaration
function x() {
console.log('x');
}
ES2015 পর্যন্ত, বৈশিষ্ট আবরণ না কি একটি JavaScript ইঞ্জিন যদি আপনি চান একটি নিয়ন্ত্রণ কাঠামোর ভিতরে একটি ফাংশন ঘোষণা করা করা উচিৎ try, if, switch, whileভালো, ইত্যাদি
if (someCondition) {
function foo() { // <===== HERE THERE
} // <===== BE DRAGONS
}
এবং যেহেতু ধাপে ধাপে কোডটি চালানোর আগে এগুলি প্রক্রিয়া করা হয়, তাই তারা যখন কোনও নিয়ন্ত্রণ কাঠামোতে থাকে তখন তাদের কী করা উচিত তা জানা মুশকিল।
যদিও এটি করা ES2015 অবধি নির্দিষ্ট করা হয়নি, তবে এটি ব্লকগুলিতে ফাংশন ঘোষণাগুলি সমর্থন করার জন্য একটি অনুমোদিত মঞ্জুরি। দুর্ভাগ্যক্রমে (এবং অনিবার্যভাবে), বিভিন্ন ইঞ্জিন বিভিন্ন কাজ করেছিল।
ES2015 হিসাবে, স্পেসিফিকেশনটি কী করবে তা বলে। আসলে এটি তিনটি পৃথক জিনিস দেয়:
- যদি আলগা মোডে কোনও ওয়েব ব্রাউজারে না থাকে তবে জাভাস্ক্রিপ্ট ইঞ্জিনটি একটি কাজ করার কথা
- যদি কোনও ওয়েব ব্রাউজারে আলগা মোডে থাকে তবে জাভাস্ক্রিপ্ট ইঞ্জিনটি অন্য কিছু করার কথা
- যদি কড়া মোডে থাকে (ব্রাউজারটি না হয়), জাভাস্ক্রিপ্ট ইঞ্জিনটি আরও একটি কাজ করার কথা
আলগা মোডগুলির নিয়মগুলি জটিল, তবে কঠোর মোডে, ব্লকগুলিতে ফাংশন ঘোষণাগুলি সহজ: এগুলি ব্লকের স্থানীয় হয় (তাদের ব্লকের সুযোগ রয়েছে , যা ES2015 এও নতুন) এবং এগুলি শীর্ষে তোলা হয় ব্লকের তাই:
"use strict";
if (someCondition) {
foo(); // Works just fine
function foo() {
}
}
console.log(typeof foo); // "undefined" (`foo` is not in scope here
// because it's not in the same block)
"নামবিহীন" functionএক্সপ্রেশন
দ্বিতীয় সাধারণ ফর্মটিকে একটি বেনামি ফাংশন এক্সপ্রেশন বলা হয় :
var y = function () {
console.log('y');
};
সমস্ত এক্সপ্রেশনগুলির মতো, কোডটি ধাপে ধাপে কার্যকর করার সময় এটিকে মূল্যায়ন করা হয়।
ES5- এ, এটি তৈরি করে ফাংশনটির কোনও নাম নেই (এটি নামবিহীন)। ES2015 এ, ফাংশনটি প্রসঙ্গ থেকে অনুমান করে যদি সম্ভব হয় তবে একটি নাম নির্ধারিত হয়। উপরের উদাহরণে নামটি হবে y। অনুরূপ কিছু করা হয় যখন ফাংশনটি কোনও প্রার্টিটি আরম্ভকারীর মান। (এবং যখন এই ঘটনার বিস্তারিত বিবরণ নিয়ম জন্য অনুসন্ধান SetFunctionNameমধ্যে স্পেসিফিকেশন - এটা মনে হচ্ছে, সব জায়গা।)
নামকরণ functionএক্সপ্রেশন
তৃতীয় রূপটি একটি নামযুক্ত ফাংশন এক্সপ্রেশন ("NFE"):
var z = function w() {
console.log('zw')
};
এটি তৈরি করে ফাংশনটির একটি সঠিক নাম রয়েছে ( wএই ক্ষেত্রে)। সমস্ত এক্সপ্রেশনগুলির মতো, কোডটি ধাপে ধাপে কার্যকর করার সময় এটিকে মূল্যায়ন করা হয়। ক্রিয়াকলাপটির নামটি স্কোপের সাথে যুক্ত হয় না যেখানে অভিব্যক্তিটি উপস্থিত হয়; নাম হয় ফাংশন নিজেই মধ্যে সুযোগ:
var z = function w() {
console.log(typeof w); // "function"
};
console.log(typeof w); // "undefined"
নোট করুন যে এনএফইগুলি প্রায়শই জাভাস্ক্রিপ্ট প্রয়োগের জন্য বাগের উত্স হয়ে থাকে। উদাহরণস্বরূপ, আইই 8 এবং এর আগে, এনএফই সম্পূর্ণরূপে ভুলভাবে পরিচালনা করে , দুটি ভিন্ন সময়ে দুটি পৃথক ফাংশন তৈরি করে। সাফারির প্রাথমিক সংস্করণগুলিতেও সমস্যা ছিল। সুসংবাদটি হ'ল ব্রাউজারগুলির বর্তমান সংস্করণগুলিতে (আই 9 এবং আপ, বর্তমান সাফারি) আর সেই সমস্যাগুলি নেই। (তবে এই লেখার মতো, দুঃখের বিষয়, আইই 8 ব্যাপকভাবে ব্যবহারে রয়ে গেছে, এবং তাই ওয়েবে সাধারণভাবে কোড সহ এনএফই ব্যবহার করা এখনও সমস্যাযুক্ত))
অ্যাকসেসর ফাংশন ইনিশিয়ালাইজার (ES5 +)
কখনও কখনও ফাংশনগুলি বৃহত্তর নজরে না গিয়ে লুকিয়ে থাকতে পারে; এটি এক্সেসর ফাংশনগুলির ক্ষেত্রে । এখানে একটি উদাহরণ:
var obj = {
value: 0,
get f() {
return this.value;
},
set f(v) {
this.value = v;
}
};
console.log(obj.f); // 0
console.log(typeof obj.f); // "number"
মনে রাখবেন যে আমি যখন ফাংশনটি ব্যবহার করেছি তখন আমি ব্যবহার করিনি ()! কারণ এটি কোনও সম্পত্তির জন্য একটি এক্সেসর ফাংশন । আমরা সম্পত্তিটি স্বাভাবিক উপায়ে সেট করি এবং সেট করি তবে পর্দার আড়ালে ফাংশনটি বলা হয়।
এছাড়াও আপনি সঙ্গে অ্যাকসেসর ফাংশন তৈরি করতে পারেন Object.defineProperty, Object.defineProperties, এবং স্বল্প-পরিচিত দ্বিতীয় যুক্তি Object.create।
তীর ফাংশন এক্সপ্রেশন (ES2015 +)
ES2015 আমাদের তীর ফাংশন নিয়ে আসে । একটি উদাহরণ এখানে:
var a = [1, 2, 3];
var b = a.map(n => n * 2);
console.log(b.join(", ")); // 2, 4, 6
কলটিতে n => n * 2লুকিয়ে থাকা জিনিসটি দেখুন map()? এটি একটি ফাংশন।
তীর ফাংশন সম্পর্কে কয়েকটি জিনিস:
তাদের নিজস্ব নেই this। পরিবর্তে, তারা যে প্রসঙ্গে সংজ্ঞায়িত হয়েছে তার প্রসঙ্গটি বন্ধ করে দেয় this। (এগুলিও বন্ধ হয়ে যায় argumentsএবং যেখানে প্রাসঙ্গিক হয় super।) এর অর্থ thisহ'ল তাদের thisতৈরি করা জায়গাগুলির মতোই তাদের অভ্যন্তরে রয়েছে এবং পরিবর্তন করা যায় না।
আপনি উপরের সাথে লক্ষ্য করেছেন, আপনি কীওয়ার্ডটি ব্যবহার করবেন না function; পরিবর্তে, আপনি ব্যবহার =>।
n => n * 2উদাহরণটি তাদের মধ্যে একজন ফর্ম। যদি ফাংশনটি পাস করার জন্য আপনার একাধিক যুক্তি থাকে তবে আপনি প্যারেন্স ব্যবহার করেন:
var a = [1, 2, 3];
var b = a.map((n, i) => n * i);
console.log(b.join(", ")); // 0, 2, 6
(মনে রাখবেন যে Array#mapপ্রথম আর্গুমেন্ট হিসাবে এন্ট্রি এবং দ্বিতীয় হিসাবে সূচকটি পাস করে)
উভয় ক্ষেত্রেই, ফাংশনটির মূল অংশটি কেবল একটি অভিব্যক্তি; ফাংশনের রিটার্ন মানটি স্বয়ংক্রিয়ভাবে সেই অভিব্যক্তির ফলাফল হবে (আপনি কোনও স্পষ্ট ব্যবহার করবেন না return)।
আপনি যদি সাধারণ হিসাবে কেবল একটি একক অভিব্যক্তি, ব্যবহার {}এবং একটি সুস্পষ্টর return(যদি আপনার কোনও মান ফেরত দেওয়ার প্রয়োজন হয়) এর চেয়ে আরও বেশি করে করছেন :
var a = [
{first: "Joe", last: "Bloggs"},
{first: "Albert", last: "Bloggs"},
{first: "Mary", last: "Albright"}
];
a = a.sort((a, b) => {
var rv = a.last.localeCompare(b.last);
if (rv === 0) {
rv = a.first.localeCompare(b.first);
}
return rv;
});
console.log(JSON.stringify(a));
সংস্করণ ছাড়াই অভিব্যক্তি শরীর বা সংক্ষিপ্ত শরীরের{ ... } সাথে একটি তীর ফাংশন বলা হয় । (এছাড়াও: একটি সংক্ষিপ্ত তীর ফাংশন)) শরীরকে সংজ্ঞায়িত করা একটি হ'ল একটি ফাংশন বডি সহ একটি তীর ফাংশন । (এছাড়াও: একটি ভার্বোস তীর ফাংশন।){ ... }
অবজেক্ট ইনিশিয়ালাইজারে পদ্ধতি ঘোষণা (ES2015 +)
ES2015 এমন একটি সম্পত্তি ঘোষণার জন্য একটি সংক্ষিপ্ত রূপকে অনুমতি দেয় যা কোনও পদ্ধতি সংজ্ঞা বলে একটি ফাংশন উল্লেখ করে ; এটি দেখতে এরকম দেখাচ্ছে:
var o = {
foo() {
}
};
ES5 এবং এর আগের সমতুল্য হবে:
var o = {
foo: function foo() {
}
};
পার্থক্যটি (ভার্বোসিটি ব্যতীত) হ'ল কোনও পদ্ধতি ব্যবহার করতে পারে superতবে একটি ফাংশন পারে না। সুতরাং উদাহরণস্বরূপ, যদি আপনার কাছে এমন কোনও অবজেক্ট থাকে যা valueOfপদ্ধতি সিনট্যাক্স ব্যবহার করে সংজ্ঞায়িত (বলে) দেয় super.valueOf()তবে মানটি Object.prototype.valueOfফিরে আসার জন্য এটি ব্যবহার করতে পারে (সম্ভবত এটির সাথে অন্য কিছু করার আগে), তবে এর Object.prototype.valueOf.call(this)পরিবর্তে ES5 সংস্করণটি করতে হবে।
যে মানে হল যে পদ্ধতি, বস্তুর উপর সংজ্ঞায়িত করা হয় একটি রেফারেন্স রয়েছে তাই যদি যে বস্তুর সাময়িক (উদাহরণস্বরূপ, আপনি তা পার করছি Object.assignউৎস বস্তুর এক হিসাবে), পদ্ধতি সিনট্যাক্স পারে মানে যে বস্তুর বজায় রাখা হয় স্মৃতিতে যখন অন্যথায় এটি আবর্জনা সংগ্রহ করা যেত (জাভাস্ক্রিপ্ট ইঞ্জিন যদি সেই পরিস্থিতিটি সনাক্ত না করে এবং কোনও পদ্ধতি ব্যবহার না করে তবে এটি পরিচালনা করে super)।
class(ES2015 +) এর মধ্যে নির্মাতা এবং পদ্ধতি ঘোষণা
ES2015 আমাদের কাছে classসিনট্যাক্স এনেছে , ঘোষিত কনস্ট্রাক্টর এবং পদ্ধতিগুলি সহ:
class Person {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
getFullName() {
return this.firstName + " " + this.lastName;
}
}
উপরে দুটি ফাংশন ঘোষণা রয়েছে: একটি কনস্ট্রাক্টরের জন্য, যা নামটি পায় Personএবং একটির জন্য getFullName, যা নির্ধারিত একটি ফাংশন Person.prototype।
