برنامه نویسی

درک عملکردهای پیکان: نحو، ویژگی ها و موارد استفاده

  1. معرفی
  2. ویژگی های یک تابع فلش
  3. تغییرات نحوی برای اعلان توابع پیکان

  4. تابع پیکان و کلمه کلیدی “این”؟؟

  5. سایر ویژگی های توابع پیکان

معرفی
توابع بخش اساسی جاوا اسکریپت هستند زیرا توسعه دهندگان را قادر می سازند تا وظایف پیچیده را به واحدهای کوچکتر و قابل مدیریت تقسیم کنند. دو نحو اصلی برای تعریف توابع در جاوا اسکریپت استفاده می شود. اینها نحو تابع منظم و نحو تابع پیکان هستند.

تابع منظم از زمان پیدایش آن بخشی از جاوا اسکریپت بوده است. با این حال، تابع پیکان در ECMAScript 2015 (ES6) معرفی شد و روش مختصرتری برای تعریف توابع در مقایسه با عبارات تابع معمولی ارائه می‌کند. همچنین دارای ویژگی هایی است که آن را از عملکردهای معمولی متمایز می کند.

در این مقاله، در مورد نحوه عملکرد توابع فلش، از جمله مزایا و موارد استفاده آنها صحبت خواهیم کرد. ما همچنین تغییرات نحوی در توابع پیکان و نحوه کار آنها با اتصالات در جاوا اسکریپت را مورد بحث قرار خواهیم داد.

ویژگی های یک تابع فلش
هنگام اعلان یک تابع با نحو تابع معمولی، باید داشته باشید؛

function addition(num1, num2){
    sum = num1+num2;
    return sum
   }
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

با استفاده از سینتکس فلش، تابع را می توان به صورت زیر نوشت؛

const addition = (num1 , num2) => {
    sum = num1 +  num2
     return sum
    }

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

از این مثال می توان به برخی از ویژگی های کلیدی توابع پیکان اشاره کرد.

  1. پایان اعلام: به جای استفاده از کلمه کلیدی تابع، از the استفاده کردیم پایان کلمه کلیدی برای اعلام تابع فلش. این تضمین می کند که مرجع تابع نمی تواند دوباره تخصیص داده شود.
    شما همچنین می توانید استفاده کنید بود یا اجازه دهید کلمه کلیدی بسته به مورد استفاده خاص شما.

  2. مولفه های: درست مانند توابع معمولی، پارامترهای توابع فلش در داخل پرانتز () اعلام می شوند. در این مثال، num1 و num2 پارامترهای مشخص شده در داخل پرانتز (num1، num2) هستند.

  3. علامت پیکان (=>).: نماد پیکان لیست پارامترها را از بدنه تابع جدا می کند. از علامت مساوی (=) به دنبال علامت بزرگتر از (>) استفاده می کند که یک فلش را تشکیل می دهد. نماد پیکان نشان می دهد که از پارامترها برای تعریف تابع استفاده می شود.

  4. عملکرد بدنه: بدنه تابع حاوی کدی است که هنگام فراخوانی تابع اجرا می شود. در پرانتزهای مجعد {} محصور شده است. به عنوان مثال، در کد، بدنه تابع مجموع num1 و num2 را محاسبه می کند و با استفاده از دستور return نتیجه را برمی گرداند.

const addition = (num1 , num2) => {
    sum = num1 +  num2
     return sum
    }

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

اگر بدنه تابع فقط یک عبارت بازگشتی داشته باشد، حتی می توانید یک عبارت تابع کوتاهتر داشته باشید.

const addition = (num1 , num2 ) => {num1 +  num2}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

این به عنوان شناخته شده است بازگشت ضمنی. به این معنی است که مقدار عبارت به طور خودکار بدون استفاده از علامت بازگردانده می شود برگشت کلمه کلیدی

تغییرات نحوی برای اعلان توابع پیکان

توابع پیکان را می توان با استفاده از نحو مختلف تعریف کرد. این بستگی به نوع عملکرد و زمینه ای دارد که در آن استفاده می شود. در اینجا چند نمونه آورده شده است.

توابع پیکان با پارامترها:
درست مانند قطعه کد قبلی، می توانید یک تابع فلش را با پارامترها اعلام کنید

const addition = (num1 , num2 ) => {
    const sum = num1 +  num2
     return sum
   }
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

اگر تابع فقط یک پارامتر داشته باشد، می توانید پرانتز را حذف کنید. مثلا،

const displayNum = num1  => {
    const Num= num1
     return Num
   }
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

توابع پیکان با پارامترهای پیش فرض:
پارامترهای پیش‌فرض به شما اجازه می‌دهند تا مقادیر پیش‌فرض را به پارامترهای تابع اختصاص دهید در صورتی که هیچ آرگومانی در هنگام فراخوانی تابع ارسال نشود.
توابع arrow از پارامترهای پیش فرض مانند توابع معمولی پشتیبانی می کنند. مثلا؛


const multiply = (a, b= 1) => {
    return a * b;
  };

  console.log(multiply(5));
  console.log(multiply(5, 2))
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در کد قبلی، ما یک تابع “ضرب” ایجاد کردیم که دو پارامتر a و b را می گیرد و b دارای مقدار پیش فرض 1 است.
به این معنی که اگر مقدار b ارائه نشده باشد، تابع به صورت 5*1 اجرا می شود. با این حال، اگر مقداری برای b ارائه شود، به عنوان مثال، 2، از مقدار ارائه شده استفاده می کند. این به صورت 5*2 اجرا می شود.

اعلان توابع پیکان بدون پارامتر:
اگر تابعی هیچ پارامتری را دریافت نمی کند، می توانید از پرانتز خالی استفاده کنید.

const greeting = () => {
     console.log('Hello World');  
}
greeting();
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

عملکرد پیکان به عنوان عبارات
شما همچنین می توانید یک تابع فلش ایجاد کنید و از آن به عنوان یک عبارت استفاده کنید. مثلا،

let score = 83;

let remark= (score < 50) ?
  () => console.log('pass') :
  () => console.log('Fail');

remark();
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

این ممکن است کمی گیج کننده باشد، بنابراین اجازه دهید کد را تجزیه کنیم.

  • در خط 1 یک متغیر به نام score اعلام می کنیم و به آن مقدار 83 اختصاص می دهیم. این متغیر نشان دهنده امتیازی است که به تابع می دهیم.

  • در خطوط 2-5 ما از یک عملگر سه تایی برای اختصاص یک مقدار به متغیر remark استفاده می کنیم.
    اپراتور سه تایی بررسی می کند که آیا امتیاز کمتر از 50 باشد. اگر شرط برقرار باشد، یک تابع پیکان () => console.log(“Pass”) را به متغیر remark اختصاص می دهد. در غیر این صورت، یک تابع پیکان () => console.log(“Fail”) را به اظهار نظر اختصاص می دهد.

در نهایت تابع remark را فراخوانی می کنیم که بر اساس مقدار امتیاز اجرا می شود. در این حالت، از آنجایی که امتیاز 83 است (که بیشتر از 50 است)، به کنسول “pass” وارد می شود.

تابع پیکان و کلمه کلیدی “این”.

در توابع منظم، مقدار متغیر “this” با نحوه فراخوانی تابع یا شیئی که با آن فراخوانی می شود تعیین می شود. این به این دلیل است که توابع منظم “this” اتصال خود را دارند و بسته به زمینه ای که در آن فراخوانی می شود می توانند تغییر کنند. مثلا

عملکرد منظم

const student = {
  name: 'Grace',
  age: 12,
  year: 2,
  studentProfile: function() {
    return 'Hi, my name is ' + this.name + ' and I am in year ' + this.year + '.';
  }
};

student.studentProfile();
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در قطعه کد، یک شی به نام “student” را با ویژگی ها تعریف کردیم نام، سن، و سال. همچنین یک عملکرد درونی به نام دارد نمایه دانشجو.
_studentProfile _با استفاده از دستور تابع معمولی تعریف شده است. از این رو، از کلمه کلیدی “this” برای اشاره به شیء مورد استفاده که در این مورد شی دانش آموز است استفاده می کند. بنابراین خروجی خواهد بود

Hi, my name is Grace and I am in year 2

با این حال، در توابع پیکان، کلمه کلیدی “this” ارزش خود را از محدوده (واژه‌ای) پیرامونی که در آن تعریف شده‌اند به ارث می‌برد نه از نحوه فراخوانی آن. این بدان معنی است که مقدار “this” بسته به زمینه ای که تابع در آن اجرا می شود می تواند تغییر کند. برای مثال

تابع پیکان

const student = {
    name: 'Grace',
    age: 12,
    year: 2,
    studentProfile: () => {
      return `Hi, my name is ${this.name} and I am in year ${this.year}.`;
    }
  };

    student.studentProfile();
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

همانطور که اشاره کردیم، توابع فلش زمینه “this” خود را ندارند. در عوض، آنها مقدار “this” را از محدوده اطراف به ارث می برند، که در این مورد، دامنه جهانی است. از این رو، این اسم و امسال تابع arrow به ویژگی های شی دانشجو اشاره نمی کند. در عوض، آنها به خصوصیات شی سراسری (به عنوان مثال، یک پنجره در یک محیط مرورگر) اشاره می کنند.
در نتیجه، هنگام اجرای این قطعه کد، خروجی به صورت زیر خواهد بود.

Hi, my name is undefined and I am in year undefined.

برای استفاده صحیح از “thisدر این سناریو از یک تابع معمولی به جای تابع فلش استفاده می کنیم.

const student = {
  name: 'Grace',
  age: 12,
  year: 2,
  studentProfile: function() {
    setTimeout(() => {
      console.log(Hi, my name is ${this.name} and I am in year ${this.year}.);
    }, 1000);
  }
};

student.studentProfile();
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

در این مثال، نمایه دانشجو تابع به عنوان یک تابع منظم تعریف شده است و ما از یک شی سراسری استفاده کردیم، setTimeout() با یک تابع فلش به عنوان پاسخ تماس. بنابراین، تابع arrow مقدار “this” را از محیط اطراف به ارث می برد نمایه دانشجو تابع. اکنون این به درستی ثبت می شود:

Hi, my name is Grace and I am in year 2

سایر ویژگی های توابع Arrow.

اگرچه توابع فلش مزایای زیادی را ارائه می دهند، اما برخی از ویژگی ها را نیز دارند که می تواند محدودیت در نظر گرفته شود. این ویژگی ها می توانند بر نحوه اجرای عملکرد شما تأثیر بگذارند، بنابراین مهم است که قبل از استفاده از توابع فلش، از آنها آگاه باشید.

  • فراخوانی توابع فلش با کلمه کلیدی جدید a را پرتاب می کند TypeError. آنها همچنین به کلمه کلیدی new.target دسترسی ندارند. بنابراین نمی توان از آنها به عنوان سازنده استفاده کرد.

  • توابع پیکان اتصالی به آن ندارند این، استدلال ها، یا فوق العاده کلید واژه ها. از این رو، آنها با روش های شی که نیاز به دسترسی به ویژگی های شی از طریق این کلمات کلیدی دارند، کار نمی کنند.

  • Arrow را نمی توان برای فراخوانی متدهای کلاس والد استفاده کرد زیرا آنها به کلمه کلیدی _super_که برای این منظور استفاده می شود دسترسی ندارند.

  • توابع پیکان از استفاده از بازده کلمه کلیدی در بدن آنها نمی تواند به طور مستقیم به عنوان توابع مولد ایجاد شود.

نتیجه
توابع پیکان مخصوصاً برای ایجاد عبارات تابع مختصر مفید هستند. با این حال، هنگام کار با ویژگی هایی که با توابع پیکان سازگار نیستند، بهتر است از توابع معمولی یا ساختارهای دیگر استفاده کنید. با درک و به کارگیری نقاط قوت و محدودیت های توابع پیکان، می توانید انتخاب هایی داشته باشید که به بهبود عملکرد کد شما کمک کند.

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

همچنین ببینید
بستن
دکمه بازگشت به بالا