وظائف الأسهم مقابل الوظائف العادية في JavaScript

كيف تختلف وظائف السهم عن الوظائف العادية في JS؟


الوظائف العادية هي وظائف "المدرسة القديمة" التي نستخدمها منذ بداية JavaScript:

function run() {

}

يمكن تشغيلها مباشرة:

run()

أو يمكن تخصيصها لمتغير:

const run = function run() {

}

run()

عندما تفعل ذلك ، يمكن للوظيفةأيضاكن مجهول الهوية:

const run = function () {

}

run()

الاختلاف الوحيد هو أنه الآن في تتبع المكدس الذي يظهر عند حدوث خطأ ، لن ترى اسم الوظيفة بعد الآن.

وظائف Arrow ، التي تم تقديمها في ES6 في عام 2015 ، تشبه نوعًا ما هذا الإصدار الأخير من الوظائف العادية ، لأنها لا تحمل اسمًا. أبدا.

صيغة "footprint" أصغر:

const run = () => {

}

run()

إذا كان لدينا معلمة واحدة ، فيمكننا حذف الأقواس:

const run = param => {

}

run()

وإذا كان لدينا عبارة واحدة فقط ، فيمكننا أيضًا حذف الأقواس المتعرجة:

const run = param => 'running'
run()

في هذه الحالة ، القيمة المعادة هي السلسلة'running'.

يمكن استخدام كل من وظائف السهم والوظائف العادية كطرق كائن.

يأتي الآن أكبر فرق بين هاتين الوظيفتين ، ويتعلق بكيفية ذلكthisمرتبط بطريقة ما.

ضع في اعتبارك هذا المثال:

const car = {
  brand: 'Ford',
  model: 'Fiesta',
  start: function() {
    console.log(`Started ${this.brand} ${this.model}`)
  },
  stop: () => {
    console.log(`Stopped ${this.brand} ${this.model}`)
  }
}

thisفي الstart()الطريقة تشير إلى الكائن نفسه.

ولكن فيstop()الطريقة ، وهي دالة السهم ، لا.

thisليس منضما إلى مثيل الكائن. يشير إلى ماذاthisيشير إلى النطاق الخارجي.

وهذا يعني أنوظائف الأسهم غير مناسبة لاستخدامها في أساليب الكائنعندما تريد الوصولthis.


المزيد من دروس js: