‎‎تابع پيكاني جاوااسكريپتJavaScript Arow Function -‎

‎توابع پيكاني‎(Arrow Functions)‎ در ES6 معرفي شدند .با آنها ميتوان توابعي با فرمت ‎(Syntax)‎‎كوتاه نوشت .

‎‎مثال ـ تابع ضرب دو عدد بفرمت پيكاني

‎

let myFunction = (a, b) => a * b;

‎‎مثال ـ نمونه تابع قبل از پيكاني

‎

hello = function() {
  return "Hello World!";
}

‎‎مثال ـ همان مثال قبلي با تابع پيكاني

‎

hello = () => {
  return "Hello World!";
}

‎‎آن تابع در صورتيكه شامل يك دستور باشد، ميتواند كوتاهتر شود.

‎‎مثال ـ همان مثال قبلي فرم كوتاهتر

‎

hello = () => "Hello World!";

‎

‎‎توجه ـ فرم بالا فقط براي توابع يك دستوري كار ميكند.

‎‎اگر تابع داراي پارامتر باشد، پارامترها در پرانتز قرار ميگيرد.

‎‎تابع پيكاني با پارامترArrow Function With Parameters -‎

‎‎مثال ـ تابع پيكاني با پارامتر

‎

hello = (val) => "Hello " + val;

‎‎در حقيت، اگر تابع داراي يك پارامتر باشد، ميتوان از پرانتزها مطابق روال زير صرف نظر كرد.

‎‎تابع پيكاني بدون پرانتزArrow Function Without Parentheses -‎

‎‎مثال ـ تابع پيكاني بدون پرانتز

‎

hello = val => "Hello " + val;

‎‎كي ورد‎this‎ باتابع پيكاني

‎عملكرد كي ورد‎this‎ در توابع معمولي وپيكاني متفاوت ميباشد.در تابع پيكاني بطور ‎خلاصه هيج اتصالي ندارد.

‎در توابع معمولي كي ورد‎this‎ بيانگر شئ ايست كه توسط تابع فراخوان ميشود، يا ‎يك ويندو، سند، دكمه يا ديگر موارد.

‎‎با تابع پيكاني كي ورد‎this‎ هميشه بيانگر شئ ايست كه تابع در آن تعريف ميشود .

‎‎براي مشخص شدن موضوع بدو مثال زير توجه نما ئيد، تا تفاوتها بهتر نمايان شود.

‎هر دو مثال تابعي را دو بار فراخوان ميكنند .اولين بار هنگام بارگذاري صفحه، وبار ديگر هنگامي ‎كه كاربر دكمه اي را كليك ميكند.

‎اجراي مثالها نتيجه نشان ميدهد كه براي مثال اول دو شئ مختلف‎(window and button)‎ ‎برگشت، و براي مثال دوم دوبار شئwindow برگشت ميشود . دليل برگشت شئwindow براي تابع ‎پيكاني اينست كه آن مالك تابع است.

‎‎مثال اول ـ كي ورد‎this‎ با تابع منظم

‎

// Regular Function:
hello = function() {
  document.getElementById("demo").innerHTML += this;
}

// The window object calls the function:
window.addEventListener("load", hello);

// A button object calls the function:
document.getElementById("btn").addEventListener("click", hello);

‎‎مثال دوم ـ كي ورد‎this‎ با تابع پيكاني

‎

// Arrow Function:
hello = () => {
  document.getElementById("demo").innerHTML += this;
}

// The window object calls the function:
window.addEventListener("load", hello);

// A button object calls the function:
document.getElementById("btn").addEventListener("click", hello);

‎هنگامي كه با توابع كار مي كنيد اين تفاوت ها را بخاطر داشته باشيد .گاهي اوقات رفتار توابع ‎منظم همان چيزيست كه انتظارش را داشتيد، وگر نه ميتوانيد از تابع پيكاني استفاده نمائيد.