بدأنا في المقال السابق شرح طريقة إنشاء دوال خاصة بك في جافا سكريبت وسنتعلم في مقال اليوم أحد المفاهيم الأساسية حول الدوال وهي إعادة قيم من الدالة. إذ تعيد بعض الدول قيمًا هامة عند اكتمال تنفيذها، بينما لا تعيد دوال أخرى أي شيء. لذلك من المهم فهم القيم التي تعيدها الدوال وكيفية استغلالها وكيفية إعداد الدوال المخصصة التي بنيتها كي تعيد قيمًا مفيدة.
ننصحك قبل أن تبدأ العمل معنا في هذه السلسلة أن تطلع على:
- أساسيات علوم الحاسب.
- أساسيات HTML.
- أساسيات عمل CSS
- أساسيات جافا سكريبت
ما هي القيم المُعادة Return values
القيمة المعادة هي ما يحمله معناها تمامًا، أي القيم التي تُعيدها الدوال عندما يكتمل تنفيذها. ومن المؤكد أنك واجهت هذا النوع من القيم مرات عدة لكنك لم تفكر بها صراحة.
سنعيد طرح مثال من المقال السابق:
const myText = "The weather is cold"; const newString = myText.replace("cold", "warm"); console.log(newString); // Should print "The weather is warm" // the replace() string function takes a string, // replaces one substring with another, and returns // a new string with the replacement made
تُستدعى الدالة ()replace
للتعامل مع النص myText
وتُمرر لها قيمتان:
- النص الذي نريد إيجاده ('cold').
- النص الذي نستبدله به ('warm').
عندما ينتهي تنفيذ الدالة تعيد قيمة جديدة هي نص جديد بعد تنفيذ عملية الاستبدال. وتُخزّن النتيجة في الشيفرة السابقة والتي تتضمن هذه القيمة المعادة في المتغير newString
.
إن عُدت إلى توثيق الدالة ()replace
في موسوعة حسوب ستجد معلومات كافية ومفيدة من المعلومات حول القيم المعادة وسنحاول اﻹشارة عليها ما أمكن في هذا المقال.
ولا تعيد بعض الدوال أية قيم (يُيشار في توثيق هذه الدوال عادة إلى القيمة المعادة على الشكل غير محدد undefined أو لا توجد قيمة void). فلا تعيد مثلًا الدالة displayMessage
التي بنيناها في المقال السابق أية قيمة عند تنفيذها، بل تعرض فقط صندوق الرسائل على الشاشة.
تُستخدم القيم المعادة عمومًا عندما تكون الدالة خطوة متوسطة لحساب شء ما. إذ لا بد من استخدام الدالة لحساب قيمة ما تُستخدم لحساب القيمة النهائية. فبعد أن تحسب الدالة القيمة المطلوبة تعيدها ثم تُخزّن في متغيّر. بعدا يمكنك حساب هذا المتغير في حسابات أخرى.
استخدام القيمة المعادة في دوال بنيتها
كي تعيد قيمة من دالة مخصصة، استخدم التعليمة return
. لقد رأينا ذلك سابقًا في المثال. إذ ترسم الدالة 100 دائرة عشوائية ضمن العنصر <canvas>
في ملف HTML:
function draw() { ctx.clearRect(0, 0, WIDTH, HEIGHT); for (let i = 0; i < 100; i++) { ctx.beginPath(); ctx.fillStyle = "rgba(255,0,0,0.5)"; ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI); ctx.fill(); } }
وضمن كل تكرار للحلقة، تُستدعى الدالة ()random
لتوليد قيم عشوائية لإحداثيات الدائرة x و y ولنصف القطر على التتالي. تأخذ الدالة ()random
معاملًا واحدًا (عدد صحيح) وتعيد عددًا عشوائيًا صحيحًا بين 0
وهذا العدد. وسيبدو اﻷمر كالتالي:
function random(number) { return Math.floor(Math.random() * number); }
كما يمكن كتابة الدالة كالتالي:
function random(number) { const result = Math.floor(Math.random() * number); return result; }
لكن بالطبع النسخة اﻷولى أسرع وأصغر.
نعيد نتيجة الحسابات Math.floor(Math.random() * number)
كل مرة نستدعي فيها الدالة، وتظهر هذه القيمة في مكان استدعاء الدالة ومن ثم تتابع الشيفرة.
ctx.arc(random(WIDTH), random(HEIGHT), random(50), 0, 2 * Math.PI);
فلو أعادت الاستدعاءات الثلاث للدالة ()random
القيم بالترتيب 500
و 200
و 35
سيكون تنفيذ السطر في الواقع كما لو كان على الشكل:
ctx.arc(500, 200, 35, 0, 2 * Math.PI);
تُستدعى الدوال ()random
في سطر الشيفرة السابق أولًا ومن ثم توضع نتيجة تنفيذها (القيم المعادة) مكانها ثم يُنفّذ السطر.
تطبيق عملي: تابع خاص يعيد قيمة
نحاول في هذا التطبيق بناء دالة خاصة بنا تعيد قيمة، لهذا اتبع الخطوات التالية:
-
انسخ الملف إلى حاسوبك، وهي صفحة بسيطة تضم عنصر إدخال نصي
<input>
وفقرة نصية<p>
. كما يوجد عنصر<script>
لتخزين مرجع إلى كل من العنصرين السابقين في متغيرين. -
أضف دالة مفيدة ما إلى العنصر
<script>
تحت ما هو موجود:
function squared(num) { return num * num; } function cubed(num) { return num * num * num; } function factorial(num) { if (num < 0) return undefined; if (num === 0) return 1; let x = num - 1; while (x > 1) { num *= x; x--; } return num; }
لا غموض في شيفرة الدالتين ()squared
و ()cubed
اللتان تعيدان مربع ومكعب العدد الذي يُمرر إليهما، أما الدالة ()factorial
فتعيد قيمة العاملي !
للعدد الذي يُمرر إليها (العاملي هو جداء تناقصي للعدد حتى الواحد).
- أضف طريقة لطباعة معلومات عن العدد الذي تدخله في مربع اﻹدخال النصي من خلال معالج الحدث التالي تحت الدوال الموجودة:
input.addEventListener("change", () => { const num = parseFloat(input.value); if (isNaN(num)) { para.textContent = "You need to enter a number!"; } else { para.textContent = `${num} squared is ${squared(num)}. `; para.textContent += `${num} cubed is ${cubed(num)}. `; para.textContent += `${num} factorial is ${factorial(num)}. `; } });
- احفظ التغييرات على الشيفرة وحمّل الصفحة من جديد في المتصفح.
إليك بعض اﻹيضاحات حول معالج الحدث addEventListener
في الخطوة الثالثة:
-
بإضافة مترصد للحدث
change
ستُنفَّذ الدالة غير المسماة (المعامل الثاني لمترصد الحدث) في كل مرة يحدث فيها تغيير على عنصر اﻹدخال النصي، أي في كل مرة نكتب فيه قيمة جديدةً وتُرسل (مثل إدخال قيمة وإبعاد التركيز عن المربع النصي بالضغط على الزر Tab أو Return). تُخزّن القيمة الموجودة في المربع النصيinput
عند تنفيذ الدالة غير المسماة في الثابتnum
. -
تطبع عبارة
if
رسالة خطأ إن لم تكن القيمة المدخلة عددًا. إذ تتحقق العبارة الشرطية إذا ما أعادت الدالةisNaN(num)
القيمةtrue
. وما تفعله هذه الدالة هو التحقق فيما لو كانت القيمة التي تمرر إليها عددًا أم لا، وتعيدtrue
إن كانت بالفعل عددًا وfalse
إن لم يكن كذلك. -
إن أعاد الشرط القيمة
false
، ستكون القيمة عددًا، وتطبع الدالة جملة ضمن الفقرة النصية توضح قيمة مربع ومكعب وعاملي العدد المدخل. إذ تستدعي العبارة الدوال()squared
و()cubed
و()factorial
لحساب القيم الموافقة.
ملاحظة: إن كانت هناك أية مشاكل في تنفيذ هذا التمرين، وازن بين ما كتبته وبين النسخة الجاهزة من هذا التمرين على جت-هب (نفّذه مباشرة إن أردت!)، أو اطلب المساعدة.
حان دورك اﻵن لكتابة الدالة الخاصة بك في جافا سكريبت
نطلب منك اﻵن كتابة دالتين من تأليفك وأضفهما إلى المكتبة. نقترح عليك مثلًا دالة تحسب الجذر التربيعي لعدد وأخرى تحسب الجذر التكعيبي! أو محيط دائرة لها قطر معين!
إليك بعض التلميحات المفيدة اﻷخرى عن الدوال:
- ألق نظرة على أمثلة أخرى لمعالجة اﻷخطاء في دالة. ومن الجيد عمومًا التحقق من قيمة أي معامل ضروري للدالة والتحقق من وجود نوع من القيم الافتراضية التي يأخذها هذا المعامل في حال كانت قيمة هذا المعامل خاطئة فهذا سيقلل احتمال ظهور اﻷخطاء.
- فكرّ بتأليف مكتبة من الدوال. فعندما تتقدم في مسيرتك البرمجية، سترى أنك تكرر الكثير من اﻷشياء مرات ومرات. لهذا سيفيدك كثيرًا وجود مكتبة خاصة بك من الدوال التي تنفّذ وظائف متنوعة تحتاجها باستمرار. وهكذا ستتمكن من نسخها ولصقها في الشيفرة الجديدة أو تدرجها في صفحة HTML عندما تحتاجها.
الخلاصة
وهكذا نكون قد أنهينا موضوع الدوال في جافا سكريبت وهي وكما لاحظت أمر شديدة الفائدة لأي مبرمج، وعلى الرغم من وجود الكثير من النقاط الأخرى التي يمكن التحدث عنها بخصوص الداوال لكنها يفترض أن تكون قد أصبحت مفهومة بالنسبة لك.
إن وجدت أي شيء غير مفهوم، حاول مراجعة المقال مرة أخرى، ونرحب بأي تساؤل تطرحه في قسم التعليقات أسفل الصفحة.
ترجمة -وبتصرف- للمقال Function return values
أفضل التعليقات
لا توجد أية تعليقات بعد
انضم إلى النقاش
يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.