در این مقاله ، ما چندین روش برای تعریف یک بلوک از عملکرد JavaScript را بررسی می کنیم.
انتخاب روشی برای اعلام عملکرد JavaScript می تواند برای مبتدیان گیج کننده باشد و چندین گزینه نحو مختلف وجود دارد. هر یک دارای مزایا ، معایب و استفاده های مناسب است که می تواند شما را مجذوب خود کند.
1. عملکردهای جاوا اسکریپت منظم
اولین و بارزترین روش برای اعلام عملکرد در JavaScript استفاده از a است function
اعلام. تابعی به نام multiply()
، که دو پارامتر را می گیرد x
و y
، آنها را چند برابر می کند و مقدار را می توان با دستور زیر پیاده سازی کرد:
function multiply(x,y) {
return x * y;
}
console.log( multiply(2, 2) );
توابع تعریف شده به این روش (اعلان تابع) هستند بلند شده به بالای دامنه فعلی بروید. console.log()
می تواند قبل از عملکرد قرار گیرد و هنوز هم کار می کند.
2. عبارات عملکرد جاوا اسکریپت
همان عملکرد را می توان به عنوان عبارتی نوشت که صریحاً یک متغیر را تنظیم می کند:
const multiply = function(x,y) {
return x * y;
}
console.log( multiply(2, 2) );
عملکرد این است نه بلند شده ، بنابراین فقط پس از تعریف می توان از آن استفاده کرد.
3. تعاریف متغیر متد شی
عملکردها مانند هر نوع مقدار دیگری در JavaScript رفتار می شوند ، بنابراین می توانید یکی را در یک شی دیگر تعریف کنید. مثلا:
const mathLib = {
PI: 3.14,
multiply: function(x, y) {
return x * y;
},
divide: function(x, y) {
return x / y;
}
}
console.log( mathLib.multiply(2, 2) );
باز هم می توان این روش شی object را فقط پس از تعریف فراخوانی کرد.
4. توابع پیکان ES2015
توابع پیکان نیازی به function
کلمه کلیدی اما فقط به یک متغیر اختصاص داده می شود یا به صورت ناشناس مورد استفاده قرار می گیرد (مانند پاسخگویی یا کنترل کننده رویداد) پارامترهای محصور در براکت های گرد (( )
) یک پیکان دنبال می کند (=>
) برای نشان دادن یک تابع در بلوک کد بعدی:
const multiply = (x, y) => { return x * y; };
console.log( multiply(2, 2) );
از آنجا که فقط یک عبارت داریم ، return
ضمنی است و می توان براکت ها را برای عملکرد یکسان با یک نحو کوتاهتر حذف کرد:
const multiply = (x, y) => x * y;
در مواردی که عملکرد یک پارامتر دارد ، می توان آن براکت ها را نیز حذف کرد:
const square = x => x ** 2;
اگرچه هنوز برای یک پارامتر براکت لازم است:
const estimatePI = () => 22 / 7;
توابع پیکان به طور خودکار اختصاص می یابد this
به مقدار در دامنه بیرونی فوری بنابراین نیازی به استفاده نیست .bind(this)
.
5. توابع پسوند jQuery
جی کوئری یک کتابخانه JavaScript است ، بنابراین ایجاد توابع تقریباً مشابه است. با این حال ، با افزودن روش های سفارشی خود ، می توانید قابلیت jQuery را افزایش دهید. jQuery.fn.extend()
روش نمونه اولیه jQuery را گسترش می دهد ($.fn
) شی object بنابراین عملکردهای جدید می توانند به اصلی زنجیر شوند jQuery()
تابع.
به عنوان مثال ، کد زیر جدید را تعریف می کند check
و uncheck
روش های جی کوئری برای تغییر زمینه های ورودی کادر تأیید:
jQuery.fn.extend({
check: function() {
return this.each(function() {
this.checked = true;
});
},
uncheck: function() {
return this.each(function() {
this.checked = false;
});
}
});
$( "input[type="checkbox"]" ).check();
عملکردی نگه داشتن آن
نحو عملکرد اغلب مورد اولویت شخصی است ، اما سعی کنید اطمینان حاصل کنید که کد شما خوانا است. ممکن است استفاده از a بهتر باشد function
بیانیه از اینکه خود را در عرض چند هفته با یک مخلوط تیر و براکت های هوشمندانه اما غیرقابل خواندن اشتباه بگیرید.