জাভাস্ক্রিপ্টে যুক্তি ওভারলোডিংয়ের একাধিক দিক রয়েছে:
পরিবর্তনশীল আর্গুমেন্ট - আপনি বিভিন্ন ধরণের আর্গুমেন্ট (উভয় প্রকার এবং পরিমাণে) পাস করতে পারেন এবং ফাংশনটি এমনভাবে আচরণ করবে যা এতে যুক্ত আর্গুমেন্টের সাথে মেলে।
ডিফল্ট আর্গুমেন্ট - যদি কোনও আর্গুমেন্ট পাস না হয় তবে আপনি একটি ডিফল্ট মান নির্ধারণ করতে পারেন।
নামযুক্ত আর্গুমেন্ট - আর্গুমেন্ট অর্ডার অপ্রাসঙ্গিক হয়ে যায় এবং আপনি কোন নামটি যুক্ত করে যে ফাংশনে আপনি যেতে চান।
আর্গুমেন্ট হ্যান্ডলিংয়ের এই বিভাগগুলির প্রতিটিের নীচে একটি বিভাগ দেওয়া আছে।
পরিবর্তনশীল যুক্তি
যেহেতু জাভাস্ক্রিপ্টে আর্গুমেন্ট বা প্রয়োজনীয় myFunc()পরিমাণের তর্কগুলি পরীক্ষা করার কোনও প্রকার নেই, আপনার কেবলমাত্র একটি বাস্তবায়ন থাকতে পারে আর্গুমেন্টের ধরন, উপস্থিতি বা পরিমাণ যাচাই করে এটিতে কী আর্গুমেন্টগুলি পাস করা হয়েছিল তার সাথে খাপ খাইয়ে নিতে পারেন।
jQuery সর্বদা এটি করে। আপনি কিছু আর্গুমেন্টকে alচ্ছিক করতে পারেন বা আপনার পক্ষে কোন যুক্তি প্রেরণ করা হয় তার উপর নির্ভর করে আপনার ফাংশনে শাখা করতে পারেন।
এই ধরণের ওভারলোডগুলি বাস্তবায়িত করার জন্য, আপনি বিভিন্ন ধরণের প্রযুক্তি ব্যবহার করতে পারেন:
- ঘোষিত আর্গুমেন্টের নাম মান কিনা তা পরীক্ষা করে আপনি প্রদত্ত যে কোনও যুক্তির উপস্থিতি যাচাই করতে পারেন
undefined।
- আপনি মোট পরিমাণ বা যুক্তি দিয়ে পরীক্ষা করতে পারেন
arguments.length।
- আপনি প্রদত্ত যে কোনও যুক্তির ধরণটি পরীক্ষা করতে পারেন।
- পরিবর্তনশীল সংখ্যক আর্গুমেন্টের জন্য, আপনি
argumentsকোনও প্রদত্ত যুক্তি অ্যাক্সেসের জন্য সিউডো-অ্যারে ব্যবহার করতে পারেন arguments[i]।
এখানে কিছু উদাহরন:
আসুন jQuery এর obj.data()পদ্ধতিটি দেখুন। এটি ব্যবহারের চারটি ভিন্ন রূপকে সমর্থন করে:
obj.data("key");
obj.data("key", value);
obj.data();
obj.data(object);
প্রত্যেকে আলাদা আলাদা আচরণ শুরু করে এবং ওভারলোডিংয়ের এই গতিশীল ফর্মটি ব্যবহার না করে চারটি পৃথক ফাংশন প্রয়োজন।
এখানে ইংরেজিতে এই সমস্ত বিকল্পগুলির মধ্যে কীভাবে আলাদা করা যায় তা এখানে রয়েছে এবং তারপরে আমি কোডগুলিতে সেগুলি একত্রিত করব:
// get the data element associated with a particular key value
obj.data("key");
প্রথম আর্গুমেন্টটি .data()যদি একটি স্ট্রিং হয় এবং দ্বিতীয় যুক্তিটি হয় undefined, তবে কলার অবশ্যই এই ফর্মটি ব্যবহার করছেন।
// set the value associated with a particular key
obj.data("key", value);
দ্বিতীয় যুক্তি যদি অপরিজ্ঞাত না হয় তবে একটি নির্দিষ্ট কীটির মান নির্ধারণ করুন।
// get all keys/values
obj.data();
যদি কোনও আর্গুমেন্ট পাস করা হয় না, তবে প্রত্যাবর্তিত অবজেক্টে সমস্ত কী / মানটি ফিরিয়ে দিন।
// set all keys/values from the passed in object
obj.data(object);
যদি প্রথম আর্গুমেন্টের ধরণটি একটি সরল বস্তু হয়, তবে সেই বস্তু থেকে সমস্ত কী / মান সেট করুন।
জাভাস্ক্রিপ্ট লজিকের এক সেটে থাকা সমস্তকে কীভাবে আপনি একত্রিত করতে পারেন তা এখানে:
// method declaration for .data()
data: function(key, value) {
if (arguments.length === 0) {
// .data()
// no args passed, return all keys/values in an object
} else if (typeof key === "string") {
// first arg is a string, look at type of second arg
if (typeof value !== "undefined") {
// .data("key", value)
// set the value for a particular key
} else {
// .data("key")
// retrieve a value for a key
}
} else if (typeof key === "object") {
// .data(object)
// set all key/value pairs from this object
} else {
// unsupported arguments passed
}
},
এই কৌশলটির মূল বিষয়টি হ'ল এটি নিশ্চিত করা যে আপনি যে সমস্ত আর্গুমেন্ট গ্রহণ করতে চান তা অনন্যভাবে চিহ্নিতযোগ্য এবং কলারটি কোন ফর্মটি ব্যবহার করছে তা নিয়ে কোনও বিভ্রান্তি নেই। এটির জন্য সাধারণত আর্গুমেন্টগুলিকে যথাযথভাবে অর্ডার করা এবং আর্গুমেন্টগুলির ধরণ এবং অবস্থানের মধ্যে যথেষ্ট স্বাতন্ত্র্য রয়েছে তা নিশ্চিত করা দরকার যা আপনি সর্বদা বলতে পারবেন যে কোন ফর্মটি ব্যবহৃত হচ্ছে।
উদাহরণস্বরূপ, যদি আপনার এমন কোনও ফাংশন থাকে যা তিনটি স্ট্রিং আর্গুমেন্ট গ্রহণ করে:
obj.query("firstArg", "secondArg", "thirdArg");
আপনি সহজেই তৃতীয় তর্কটি optionচ্ছিক করতে পারেন এবং আপনি সহজেই সেই শর্তটি সনাক্ত করতে পারেন তবে আপনি কেবল দ্বিতীয় যুক্তি optionচ্ছিক করতে পারবেন না কারণ এই কলারটির মধ্যে কোনটি পাস হবে তা আপনি বলতে পারবেন না কারণ দ্বিতীয়টি সনাক্ত করার কোনও উপায় নেই বলে চিহ্নিত করার উপায় নেই আর্গুমেন্টকে দ্বিতীয় যুক্তি বা দ্বিতীয় যুক্তি বাদ দেওয়া হয়েছিল তাই দ্বিতীয় যুক্তির স্পটটিতে আসলে তৃতীয় যুক্তিই রয়েছে:
obj.query("firstArg", "secondArg");
obj.query("firstArg", "thirdArg");
যেহেতু তিনটি আর্গুমেন্ট একই ধরণের, আপনি বিভিন্ন যুক্তির মধ্যে পার্থক্য বলতে পারবেন না যাতে আপনি জানেন না যে ফোনকারী কী কী উদ্দেশ্য নিয়েছিল। এই কলিং স্টাইলের সাহায্যে কেবল তৃতীয় যুক্তিই optionচ্ছিক হতে পারে। যদি আপনি দ্বিতীয় যুক্তিটি বাদ দিতে চান, এটি nullপরিবর্তে (বা অন্য কিছু সনাক্তকারী মান) হিসাবে পাস করতে হবে এবং আপনার কোড এটি সনাক্ত করতে পারে:
obj.query("firstArg", null, "thirdArg");
এখানে Quচ্ছিক আর্গুমেন্টগুলির jQuery উদাহরণ। উভয় যুক্তিই optionচ্ছিক এবং পাস না হলে ডিফল্ট মান গ্রহণ করে:
clone: function( dataAndEvents, deepDataAndEvents ) {
dataAndEvents = dataAndEvents == null ? false : dataAndEvents;
deepDataAndEvents = deepDataAndEvents == null ? dataAndEvents : deepDataAndEvents;
return this.map( function () {
return jQuery.clone( this, dataAndEvents, deepDataAndEvents );
});
},
এখানে একটি jQuery উদাহরণ রয়েছে যেখানে আর্গুমেন্টটি অনুপস্থিত বা তিনটি বিভিন্ন ধরণের যে কোনও একটি আপনাকে চারটি আলাদা ওভারলোড দেয়:
html: function( value ) {
if ( value === undefined ) {
return this[0] && this[0].nodeType === 1 ?
this[0].innerHTML.replace(rinlinejQuery, "") :
null;
// See if we can take a shortcut and just use innerHTML
} else if ( typeof value === "string" && !rnoInnerhtml.test( value ) &&
(jQuery.support.leadingWhitespace || !rleadingWhitespace.test( value )) &&
!wrapMap[ (rtagName.exec( value ) || ["", ""])[1].toLowerCase() ] ) {
value = value.replace(rxhtmlTag, "<$1></$2>");
try {
for ( var i = 0, l = this.length; i < l; i++ ) {
// Remove element nodes and prevent memory leaks
if ( this[i].nodeType === 1 ) {
jQuery.cleanData( this[i].getElementsByTagName("*") );
this[i].innerHTML = value;
}
}
// If using innerHTML throws an exception, use the fallback method
} catch(e) {
this.empty().append( value );
}
} else if ( jQuery.isFunction( value ) ) {
this.each(function(i){
var self = jQuery( this );
self.html( value.call(this, i, self.html()) );
});
} else {
this.empty().append( value );
}
return this;
},
নাম যুক্তি
অন্যান্য ভাষাগুলি (পাইথনের মতো) কেবল কিছু আর্গুমেন্ট পাস করার এবং আর্গুমেন্টগুলিকে যে ক্রমে পাস করা হয়েছে তার চেয়ে আলাদা করে দেওয়ার উপায় হিসাবে একটি নামকৃত তর্কগুলি পাস করার অনুমতি দেয় J জাভাস্ক্রিপ্ট নামক যুক্তির বৈশিষ্ট্যটিকে সরাসরি সমর্থন করে না support একটি নকশার প্যাটার্ন যা সাধারণত তার জায়গায় ব্যবহৃত হয় তা হল বৈশিষ্ট্য / মানগুলির মানচিত্র পাস করা pass এটি বৈশিষ্ট্য এবং মানগুলির সাথে বা ES6 এবং এর উপরের কোনও বস্তুটি পাস করার মাধ্যমে করা যেতে পারে, আপনি আসলে কোনও মানচিত্র অবজেক্টটি নিজেই পাস করতে পারেন।
এখানে একটি সহজ ES5 উদাহরণ রয়েছে:
jQuery এর $.ajax()ব্যবহারের এমন একটি রূপ গ্রহণ করে যেখানে আপনি কেবল এটি একটি একক প্যারামিটারটি পাস করেন যা বৈশিষ্ট্য এবং মানগুলির সাথে নিয়মিত জাভাস্ক্রিপ্ট অবজেক্ট। আপনি কোন বৈশিষ্ট্যগুলি এটি পাস করেন তা নির্ধারণ করে যে কোন আর্গুমেন্ট / অপশনগুলি আজাক্স কলটিতে পাস করা হচ্ছে। কিছু প্রয়োজন হতে পারে, অনেক alচ্ছিক। যেহেতু এগুলি কোনও বস্তুর বৈশিষ্ট্য, তাই কোনও নির্দিষ্ট আদেশ নেই। প্রকৃতপক্ষে, 30 টিরও বেশি আলাদা বৈশিষ্ট্য রয়েছে যা সেই বস্তুটিতে পাস হতে পারে, কেবলমাত্র একটি (ইউআরএল) প্রয়োজন।
এখানে একটি উদাহরণ:
$.ajax({url: "http://www.example.com/somepath", data: myArgs, dataType: "json"}).then(function(result) {
// process result here
});
এর ভিতর $.ajax()বাস্তবায়ন, তারপর শুধু জিজ্ঞাসাবাদ বৈশিষ্ট্যাবলী ইনকামিং বস্তুর উপর গৃহীত হয় যা করতে পারেন এবং নামে আর্গুমেন্ট হিসাবে যারা ব্যবহার করেন। এটি হয় for (prop in obj)বা দিয়ে সমস্ত বৈশিষ্ট্যগুলি একটি অ্যারের সাথে পেয়ে Object.keys(obj)এবং তারপরে সেই অ্যারেটি পুনরায় করা যায়।
এই কৌশলটি জাভাস্ক্রিপ্টে খুব সাধারণভাবে ব্যবহৃত হয় যখন প্রচুর সংখ্যক যুক্তি এবং / অথবা অনেকগুলি যুক্তি optionচ্ছিক হয়। দ্রষ্টব্য: এটি একটি ন্যূনতম বৈধ সেট আর্গুমেন্ট উপস্থিত রয়েছে তা নিশ্চিত করার জন্য এবং অপর্যাপ্ত যুক্তি পাস করা হলে কলারকে কিছু ডিবাগ প্রতিক্রিয়া জানাতে (সম্ভবত একটি সহায়ক ত্রুটির বার্তা সহ একটি ব্যতিক্রম ছুঁড়ে ফেলে) এটি বাস্তবায়নকারী কার্যকে আরও গুরুত্ব দেয় this ।
ES6 পরিবেশে উপরোক্ত পাস করা অবজেক্টের জন্য ডিফল্ট বৈশিষ্ট্য / মান তৈরি করতে ডিস্ট্রাকচার ব্যবহার করা সম্ভব। এই রেফারেন্স নিবন্ধে এটি আরও বিশদে আলোচনা করা হয়েছে ।
এই নিবন্ধ থেকে একটি উদাহরণ এখানে:
function selectEntries({ start=0, end=-1, step=1 } = {}) {
···
};
এই জন্য ডিফল্ট বৈশিষ্ট্য ও মূল্যবোধ সৃষ্টি start, endএবং stepএকটি বস্তু প্রেরণ উপর বৈশিষ্ট্য selectEntries()ফাংশন।
ফাংশন আর্গুমেন্টের জন্য ডিফল্ট মান
ES6 এ, জাভাস্ক্রিপ্ট আর্গুমেন্টগুলির জন্য ডিফল্ট মানগুলির জন্য অন্তর্নির্মিত ভাষা সমর্থন যুক্ত করে।
উদাহরণ স্বরূপ:
function multiply(a, b = 1) {
return a*b;
}
multiply(5); // 5
এটি এমডিএন-এ কীভাবে ব্যবহার করা যেতে পারে তার আরও বিবরণ ।