أسئلة وأجوبة مقابلة JavaScript المتداولة
نشرت: 2023-01-13يزيد وجود JavaScript في محفظتك من فرص الحصول على دور مطور برامج. بعد قولي هذا ، دعنا نتحقق من أسئلة مقابلة JavaScript المتداولة.
تعد JavaScript واحدة من أكثر اللغات استخدامًا في تطوير الويب. يتم استخدامه لتطوير أي نوع من التطبيقات تقريبًا الآن.
قبل القفز إلى أسئلة المقابلة ، دعنا نرى مزايا تعلم JavaScript.
JavaScript هي لغة برمجة خفيفة الوزن أو مفسرة أو مجمعة في الوقت المناسب. إنها إحدى اللغات الأساسية لشبكة الويب العالمية. أنت تعرف اللغتين الأساسيتين الأخريين في شبكة الاتصالات العالمية. من الأفضل أن تبحث عنها إذا لم تفعل.
تم إنشاء JavaScript بشكل أساسي للويب. لكنها ليست فقط للويب الآن. بمساعدة بيئات مثل Node و Deno وما إلى ذلك ، يمكننا تشغيلها على أي منصة تقريبًا.
دعنا نتحقق من بعض مزاياها.
مزايا JavaScript
- من السهل أن تبدأ. يمكنك تعلمها حتى بدون أي معرفة بالترميز.
- مجتمع كبير من حوله. ستحصل على كل المساعدة التي تريدها إذا كنت عالقًا في أي مكان.
- هناك الكثير من المكتبات / أطر العمل التي يتم إنشاؤها باستخدام JavaScript ، مما يساعد على تطوير التطبيقات بشكل أسرع.
- يمكننا تطوير تطبيقات للواجهة الأمامية والخلفية و android و iOS وما إلى ذلك باستخدام JavaScript. يمكننا إنشاء أي نوع من التطبيقات تقريبًا باستخدامه. لكنها أكثر قوة في تطوير الويب.
ما هي أنواع البيانات في جافا سكريبت؟
تُستخدم أنواع البيانات لتخزين أنواع مختلفة من البيانات. تختلف أنواع البيانات من لغة برمجة إلى أخرى. في JavaScript ، لدينا 8 أنواع من البيانات. دعونا نراهم واحدا تلو الآخر.
- رقم
- سلسلة
- قيمة منطقية
- غير معرف
- باطل
- BigInt
- رمز
- هدف
تسمى جميع أنواع البيانات باستثناء الكائن القيم الأولية. وهي غير قابلة للتغيير.
ما هي الطرق المضمنة في JavaScript؟
تختلف الطرق المضمنة في JavaScript باختلاف نوع البيانات. يمكننا الوصول إلى هذه الأساليب المضمنة باستخدام نوع البيانات المعني. دعنا نرى بعض الطرق المضمنة لأنواع البيانات المختلفة وهياكل البيانات.
- رقم
- للتصليح
- إلى سلسلة
- ...
- سلسلة
- toLowerCase
- ابدا ب
- مخطط
- ...
- مجموعة مصفوفة
- منقي
- خريطة
- لكل
- ...
هناك الكثير من الطرق المضمنة لكل نوع من أنواع البيانات. يمكنك التحقق من المراجع لجميع الطرق المضمنة لأنواع البيانات المختلفة وهياكل البيانات.
كيفية إنشاء مصفوفة في JavaScript؟
المصفوفات هي إحدى هياكل البيانات الأساسية في JavaScript. يمكن أن تحتوي المصفوفات على أي نوع من البيانات فيها لأن JavaScript ديناميكي. دعونا نرى كيفية إنشاء المصفوفات في JavaScript.
يمكننا إنشاء مصفوفة باستخدام الأقواس المربعة []
. من السهل والسريع إنشاء الأشياء
// Empty array const arr = []; // Array with some random values const randomArr = [1, "One", true]; console.log(arr, randomArr);
يمكننا إنشاء مصفوفة باستخدام Array
constructor. نادرًا ما يستخدم الأشخاص المُنشئ لإنشاء مصفوفات في المشروعات العامة.
// Empty array const arr = new Array(); // Array with some random values const randomArr = new Array(1, "One", true); console.log(arr, randomArr);
مصفوفات JavaScript قابلة للتغيير ، أي يمكننا تعديلها كما نريد بعد إنشائها.
كيف تصنع كائنًا في JavaScript؟
بجانب المصفوفة ، فإن الكائن هو بنية بيانات أساسية أخرى في JavaScript. تستخدم الكائنات تخزين أزواج المفتاح والقيمة. يجب أن يكون المفتاح قيمة ثابتة ، بينما يمكن أن تكون القيمة أي شيء. دعونا نرى كيفية إنشاء كائنات في JavaScript.
يمكننا إنشاء كائنات باستخدام الأقواس المتعرجة {}
. من السهل والسريع إنشاء الأشياء.
// Empty object const object = {}; // Object with some random values const randomObject = { 1: 2, one: "Two", true: false }; console.log(object, randomObject);
يمكننا إنشاء كائنات باستخدام مُنشئ Object
. نادرا ما يستخدم الناس هذا في المشاريع العامة.
// Empty object const object = new Object(); // Object with some random values const randomObject = new Object(); randomObject[1] = 2; randomObject["one"] = "Two"; randomObject[true] = false; console.log(object, randomObject);
كائنات JavaScript قابلة للتغيير ، أي يمكننا تعديلها بعد الإنشاء ، كما ترى في المثال الثاني.
كيف تصحح كود جافا سكريبت؟
رمز التصحيح ليس مباشرًا. وهي تختلف من لغة برمجة إلى أخرى ، ومن مشروع إلى آخر ، وما إلى ذلك. دعنا نرى الأشياء الشائعة المستخدمة لتصحيح أخطاء JavaScript.
# 1. تسجيل
يمكننا استخدام عبارات console.log
في أماكن متعددة في الكود الخاص بنا لتحديد الخطأ. سيتوقف الرمز عن تشغيل الأسطر التالية من التعليمات البرمجية عندما يكون هناك خطأ في السطر السابق.
يعد التسجيل أحد أساليب التصحيح القديمة ، وهو فعال إلى حد كبير للمشاريع الصغيرة. إنها تقنية تصحيح أخطاء شائعة لأي لغة برمجة.
# 2. ادوات المطورين
يستخدم JavaScript في الغالب لتطوير تطبيقات الويب. لذلك ، تحتوي جميع المتصفحات تقريبًا على أدوات للمطورين تساعد الآن في تصحيح شفرة JavaScript.
واحدة من أكثر طرق التصحيح استخدامًا هي تعيين نقاط التوقف في أدوات المطور. توقف نقاط التوقف تنفيذ JavaScript وتعطي جميع المعلومات حول التنفيذ في الوقت الحالي.
يمكننا تعيين نقاط توقف متعددة حول المكان الذي نحصل فيه على أخطاء ومعرفة سببها. إنها الطريقة الأكثر فعالية لتصحيح أخطاء تطبيقات الويب JavaScript.
# 3. IDEs
يمكننا استخدام IDEs لتصحيح أخطاء JavaScript. يدعم VS Code التصحيح بنقاط التوقف. قد تختلف ميزة التصحيح بناءً على IDE الذي تستخدمه. ولكن ، ستتمتع معظم IDEs بهذه الميزة.
كيفية إضافة كود JavaScript في ملف HTML؟
يمكننا إضافة ملف JavaScript HTML باستخدام علامة script
. يمكنك التحقق من المثال أدناه.
<!DOCTYPE html> <html lang="en"> <head> <title>Geekflare</title> </head> <body> <h1>Geekflare</h1> <script> // JavaScript code goes here console.log("This is JavaScript code"); </script> </body> </html>
ما هي ملفات تعريف الارتباط؟
ملفات تعريف الارتباط هي أزواج ذات قيمة أساسية تُستخدم لتخزين المعلومات الصغيرة. يمكن أن تكون المعلومات أي شيء. يمكننا ضبط وقت انتهاء صلاحية ملفات تعريف الارتباط ، والتي سيتم حذفها بعد وقت انتهاء صلاحيتها. تستخدم هذه على نطاق واسع لتخزين معلومات المستخدمين.
لن يتم مسح ملفات تعريف الارتباط حتى إذا قمنا بتحديث الصفحة حتى نحذفها أو تنتهي صلاحيتها. يمكنك التحقق من ملفات تعريف الارتباط لأي تطبيق ويب / صفحة ويب في أي متصفح عن طريق فتح أدوات المطور.
كيف تقرأ ملف تعريف الارتباط؟
يمكننا قراءة ملف تعريف الارتباط في JavaScript باستخدام document.cookie
. سيعيد جميع ملفات تعريف الارتباط التي أنشأناها.
console.log("All cookies", document.cookie);
سيعيد سلسلة فارغة إذا لم يكن هناك ملفات تعريف الارتباط.
كيفية إنشاء وحذف ملف تعريف الارتباط؟
يمكننا إنشاء ملفات تعريف الارتباط عن طريق تعيين زوج القيمة الرئيسية على document.cookie
. دعونا نرى مثالا.
document.cookie = "one=One;";
في الصيغة أعلاه ، مفتاح ملف تعريف الارتباط one
ومفتاح ملف تعريف الارتباط One
هو قيمته. يمكننا إضافة المزيد من السمات إلى ملف تعريف الارتباط مثل المجال ، المسار ، انتهاء الصلاحية ، إلخ .. ؛ يجب فصل كل منهم بفاصلة منقوطة (؛) . جميع السمات اختيارية.
دعونا نرى مثالا مع السمات.
document.cookie = "one=One;expires=Jan 31 2023;path=/;";
في الكود أعلاه ، أضفنا تاريخ انتهاء الصلاحية ومسارًا إلى ملف تعريف الارتباط. إذا لم يتم تقديم تاريخ انتهاء الصلاحية ، فسيتم حذف ملف تعريف الارتباط بعد الجلسة. سيكون المسار الافتراضي هو مسار الملف. يجب أن يكون تنسيق تاريخ انتهاء الصلاحية بتوقيت جرينتش.
دعونا نرى كيفية إنشاء ملفات تعريف ارتباط متعددة.
document.cookie = "one=One;expires=Jan 31 2023;path=/;"; document.cookie = "two=Two;expires=Jan 31 2023;path=/;"; document.cookie = "three=Three;expires=Jan 31 2023;path=/;";
لن يتم الكتابة فوق ملفات تعريف الارتباط إذا كان المفتاح أو المسار مختلفًا أثناء تعيين ملفات تعريف ارتباط متعددة. إذا كان المفتاح والمسار متماثلين ، فسيحل محل ملف تعريف الارتباط السابق. تحقق من المثال أدناه ، والذي سيحل محل ملف تعريف الارتباط السابق.
document.cookie = "one=One;expires=Jan 31 2023;path=/;"; document.cookie = "one=Two;path=/;";
لقد أزلنا تاريخ انتهاء الصلاحية من ملف تعريف الارتباط وقمنا بتغيير القيمة.
استخدم تاريخ انتهاء الصلاحية تاريخًا مستقبليًا عندما تختبر الرمز حتى يعمل بشكل صحيح. إذا احتفظت بنفس التاريخ 31 يناير 2023 حتى بعد 31 يناير 2023 ، فلن يتم إنشاء ملفات تعريف الارتباط.
لقد رأينا كيفية إنشاء ملفات تعريف الارتباط وتحديثها. دعونا نرى كيفية حذف ملفات تعريف الارتباط.
يعد حذف ملفات تعريف الارتباط أمرًا سهلاً. ما عليك سوى تغيير تاريخ انتهاء صلاحية ملف تعريف الارتباط إلى أي تاريخ سابق. تحقق من المثال أدناه.
// Creating cookies document.cookie = "one=One;expires=Jan 31 2023;path=/;"; document.cookie = "two=Two;expires=Jan 31 2023;path=/;"; document.cookie = "three=Three;expires=Jan 31 2023;path=/;"; // Deleting the last cookie document.cookie = "three=Three;expires=Jan 1 2023;path=/;";
لن تجد ملف تعريف الارتباط الأخير في ملفات تعريف الارتباط لأنه تم حذفه في السطر الأخير من الكود. هذا كل شيء في البرنامج التعليمي min ملفات تعريف الارتباط.
ما هي أطر عمل جافا سكريبت المختلفة؟
هناك الكثير من أطر عمل جافا سكريبت هناك. React ، Vue ، Angular ، إلخ .. لتطوير واجهة المستخدم. Express ، Koa ، Nest ، إلخ ، للتطوير من جانب الخادم. NextJS ، Gatsby ، إلخ ، لإنشاء موقع ثابت. React Native و Ionic وما إلى ذلك لتطوير تطبيقات الأجهزة المحمولة. لقد ذكرنا بعض أطر عمل JavaScript هنا. يمكنك العثور على المزيد من الأطر التي ستستغرق الكثير من الوقت لاستكشافها. استكشف عندما تحتاج إليها.
الإغلاق في JavaScript
الإغلاق هو وظيفة مجمعة مع نطاقها المعجمي وبيئتها المعجمية الأصلية. مع عمليات الإغلاق ، يمكننا الوصول إلى بيانات النطاق الخارجي. يتم تشكيل الإغلاق عند إنشاء الوظائف.
function outer() { const a = 1; function inner() { // We can access all the data from the outer function scope here // The data will be available even if we execute this function outside the outer function // as inners' closure formed while creating it console.log("Accessing a inside inner", a); } return inner; } const innerFn = outer(); innerFn();
تُستخدم عمليات الإغلاق على نطاق واسع في تطبيقات JavaScript. ربما تكون قد استخدمتها من قبل دون أن تدرك أنها مغلقة. هناك الكثير من المعلومات حول عمليات الإغلاق أكثر من ذلك. تأكد من أنك قد تعلمت هذا المفهوم تمامًا.
الرفع في JavaScript
الرفع هو عملية في JavaScript حيث ينتقل إعلان المتغيرات والوظائف والفئات إلى أعلى النطاق قبل تنفيذ الكود.
// Accessing `name` before declaring console.log(name); // Declaring and initializing the `name` var name = "Geekflare";
إذا قمت بتشغيل الكود أعلاه ، فلن ترى أي خطأ. ولكن في معظم اللغات ، سوف تحصل على الخطأ. سيتم إلغاء undefined
الإخراج لأن الرفع ينقل الإعلانات فقط إلى الأعلى ، ولن يؤدي إلى تهيئته حتى السطر رقم 3.
قم بتغيير var
let
أو const
كما يلي ، وتشغيل الكود مرة أخرى.
// Accessing `name` before declaring console.log(name); // Declaring and initializing the `name` const name = "Geekflare";
الآن ، ستحصل على الخطأ المرجعي الذي يفيد بأنه لا يمكننا الوصول إلى المتغير قبل تهيئته.
ReferenceError: Cannot access 'name' before initialization
لذلك ، هنا يتم تقديم let
و const
في ES6 ، والتي لا يمكن الوصول إليها قبل التهيئة ، كما يوحي الخطأ. هذا لأن المتغيرات المُعلنة بـ let
أو const
ستكون في Temporal Dead Zone (TDZ) حتى يتم تهيئة السطر. لا يمكننا الوصول إلى المتغيرات من TDZ.
الكاري في جافا سكريبت
Currying هي تقنية لتحويل الوظائف التي تحتوي على العديد من المعلمات إلى عدد أقل من المعلمات باستخدام العديد من العناصر القابلة للاستدعاء. بواسطته ، يمكننا تحويل وظيفة قابلة للاستدعاء إضافة (أ ، ب ، ج ، د) لإضافة (أ) (ب) (ج) (د) قابل للاستدعاء. دعونا نرى مثالاً على كيفية القيام بذلك.
function getCurryCallback(callback) { return function (a) { return function (b) { return function (c) { return function (d) { return callback(a, b, c, d); }; }; }; }; } function add(a, b, c, d) { return a + b + c + d; } const curriedAdd = getCurryCallback(add); // Calling the curriedAdd console.log(curriedAdd(1)(2)(3)(4));
يمكننا تعميم دالة getCurryCallback
التي ستُستخدم لوظائف مختلفة للتحويل إلى كائنات كاريكاتورية. يمكنك الرجوع إلى معلومات JavaScript لمزيد من التفاصيل حول ذلك.
الفرق بين المستند والنافذة
window
هي أعلى كائن في المتصفح. يحتوي على جميع المعلومات حول نافذة المتصفح ، مثل السجل والموقع والملاح وما إلى ذلك .. ؛ إنه متاح عالميًا في JavaScript. يمكننا استخدامه مباشرة في الكود الخاص بنا دون أي واردات. يمكننا الوصول إلى خصائص وأساليب كائن window
بدون window.
document
هو جزء من كائن window
. يتم تحويل كل HTML الذي تم تحميله على صفحة الويب إلى كائن المستند. يشير كائن المستند إلى عنصر HTMLDocument الخاص ، والذي سيكون له خصائص وطرق مختلفة مثل جميع عناصر HTML.
تمثل window
الكائن نافذة المتصفح ويمثل document
مستند HTML الذي تم تحميله في نافذة المتصفح تلك.
الفرق بين جانب العميل وجانب الخادم
يشير جانب العميل إلى المستخدم النهائي الذي يستخدم التطبيق. يشير جانب الخادم إلى خادم الويب حيث يتم نشر التطبيق.
في مصطلحات الواجهة الأمامية ، يمكننا أن نقول المتصفح على أجهزة كمبيوتر المستخدمين كجانب العميل والخدمات السحابية كجانب الخادم.
الفرق بين innerHTML و innerText
كل من innerHTML
و innerText
هي خصائص عناصر HTML. يمكننا تغيير محتويات عنصر HTML باستخدام هذه الخصائص.
يمكننا تعيين سلسلة HTML إلى innerHTML
وهي خاصية تُعرض مثل HTML العادي. تحقق من المثال أدناه.
const titleEl = document.getElementById("title"); titleEl.innerHTML = '<span style="color:orange;">Geekflare</span>';
أضف عنصرًا واحدًا مع title
المعرف إلى HTML الخاص بك وأضف البرنامج النصي أعلاه إلى ملف JavaScript. قم بتشغيل الكود وانظر الإخراج. سوف Geekflare
باللون البرتقالي. وإذا قمت بفحص العنصر ، فسيكون داخل علامة span
. لذا فإن لغة HTML الداخلية تأخذ سلسلة HTML innerHTML
HTML عادي.
innerText
النص الداخلي على الجانب الآخر سلسلة عادية ويجعلها كما هي. لن يعرض أي HTML مثل innerHTML
. قم بتغيير innerHTML
إلى innerText
في الكود أعلاه وتحقق من الإخراج.
const titleEl = document.getElementById("title"); titleEl.innerText = '<span style="color:orange;">Geekflare</span>';
الآن ، سترى السلسلة الدقيقة التي قدمناها على صفحة الويب.
الفرق بين Let و var
تُستخدم الكلمات الأساسية let
و var
لإنشاء متغيرات في JavaScript. يتم تقديم الكلمة الرئيسية let
في ES6.
let
هو نطاق الكتلة و var
هو نطاق الوظيفة.
{ let a = 2; console.log("Inside block", a); } console.log("Outside block", a);
قم بتشغيل الكود أعلاه. ستحصل على خطأ في السطر الأخير حيث لا يمكننا الوصول let a
خارج الكتلة لأنه محجوب بالنطاق. الآن ، قم بتغييره إلى var
وقم بتشغيله مرة أخرى.
{ var a = 2; console.log("Inside block", a); } console.log("Outside block", a);
لن تحصل على أي خطأ حيث يمكننا الوصول a
متغير خارج الكتلة أيضًا. الآن ، دعنا نستبدل الكتلة بوظيفة.
function sample() { var a = 2; console.log("Inside function", a); } sample(); console.log("Outside function", a);
ستحصل على خطأ مرجعي إذا قمت بتشغيل الكود أعلاه لأننا لا نستطيع الوصول إلى var a
خارج الوظيفة لأنها مرتبطة بنطاق الوظيفة.
يمكننا إعادة تعريف المتغيرات باستخدام var
لكن لا يمكننا إعادة تعريف المتغيرات باستخدام let
keyword. دعونا نرى مثالا.
var a = "Geekflare"; var a = "Chandan"; console.log(a);
let a = "Geekflare"; let a = "Chandan"; console.log(a);
لن يؤدي الجزء الأول من التعليمات البرمجية إلى أي a
وسيتم تغيير القيمة إلى أحدث قيمة مخصصة. سوف يتسبب الجزء الثاني من الكود في حدوث خطأ حيث لا يمكننا إعادة تعريف المتغيرات باستخدام let
.
الفرق بين تخزين الجلسة والتخزين المحلي
يتم استخدام تخزين الجلسة والتخزين المحلي لتخزين المعلومات على أجهزة الكمبيوتر الخاصة بالمستخدمين والتي يمكن الوصول إليها بدون الإنترنت. يمكننا تخزين أزواج القيمة الرئيسية في كل من تخزين الجلسة والتخزين المحلي. سيتم تحويل كل من المفتاح والقيمة إلى سلاسل إذا قمت بتوفير أي نوع بيانات أو بنية بيانات أخرى.
سيتم مسح تخزين الجلسة بعد انتهاء الجلسة (عند إغلاق المتصفح). لن يتم مسح تخزين الموقع حتى نقوم بمسحها.
يمكننا الوصول إلى مساحة تخزين الجلسة وتحديثها وحذفها وتخزين الموقع باستخدام كائنات sessionStorage
و localStorage
على التوالي.
ما هو NaN في JavaScript؟
يتم اختصار NaN
على أنه Not-a-Number . إنه يمثل أن شيئًا ما ليس رقمًا قانونيًا / صالحًا في JavaScript. هناك بعض الحالات التي نحصل فيها على NaN
مثل 0/0
، undefined * 2
، 1 + undefined
، null * undefined
، إلخ .. ،
ما هو النطاق المعجمي؟
يشير النطاق المعجمي إلى الوصول إلى المتغيرات من نطاق الوالدين. لنفترض أن لدينا دالة ذات وظيفتين داخليتين. يمكن للوظيفة الأعمق الوصول إلى متغيرات نطاق وظيفتها الرئيسية. وبالمثل ، يمكن لوظيفة المستوى الثاني الوصول إلى نطاق الوظيفة الأبعد. دعونا نراه في مثال.
function outermost() { let a = 1; console.log(a); function middle() { let b = 2; // `a` are accessible here console.log(a, b); function innermost() { let c = 3; // both `a` and `b` are accessible here console.log(a, b, c); } innermost(); } middle(); } outermost();
يستخدم JavaScript سلسلة نطاق للعثور على المتغير عندما نصل إليه في مكان ما في الكود. أولاً ، سيتحقق من المتغير في النطاق الحالي ، ثم النطاق الأصلي حتى النطاق العام.
ما الذي تم تمريره بالقيمة وتمريره بالمرجع؟
إن تمرير القيمة والتمرير حسب المرجع طريقتان لتمرير الوسيطات إلى دالة في JavaScript.
تمرير القيمة: يقوم بإنشاء نسخة من البيانات الأصلية ويمررها إلى الوظيفة. لذلك ، عندما نجري أي تغييرات في الوظيفة ، فلن يؤثر ذلك على البيانات الأصلية. تحقق من المثال أدناه.
function sample(a) { // changing the value of `a` a = 5; console.log("Inside function", a); } let a = 3; sample(a); console.log("Outside function", a);
سترى أن القيمة الأصلية لـ a
لم تتغير رغم أننا قمنا بتغييرها داخل الوظيفة.
تمرير بالإشارة: يمرر مرجع البيانات إلى الوظيفة. لذلك ، عندما نجري أي تغييرات في الوظيفة ، فإنها ستغير أيضًا البيانات الأصلية.
function sample(arr) { // adding a new value to the array arr.push(3); console.log("Inside function", arr); } let arr = [1, 2]; sample(arr); console.log("Outside function", arr);
سترى أن القيمة الأصلية لـ arr
تتغير عندما نغيرها داخل الوظيفة.
ملاحظة: يتم تمرير جميع أنواع البيانات الأولية بالقيمة ، ويتم تمرير غير البدائية عن طريق المرجع.
ما هو الحفظ؟
Memoization هي تقنية تخزن القيم المحسوبة في ذاكرات التخزين المؤقت وتستخدمها عندما نحتاج إليها مرة أخرى دون حسابها مرة أخرى. سيؤدي ذلك إلى تسريع تنفيذ الكود إذا كانت العمليات الحسابية ثقيلة للغاية. هناك مقايضة تخزين وهي ليست مشكلة كبيرة مقارنة بالوقت.
const memo = {}; function add(a, b) { const key = `${a}-${b}`; // checking whether we computed the value already or not if (memo[key]) { console.log("Not computing again"); return memo[key]; } // adding the newly computed value to cache // here cache is a simple global object memo[key] = a + b; return memo[key]; } console.log(add(1, 2)); console.log(add(2, 3)); console.log(add(1, 2));
إنه مثال بسيط يوضح الحفظ. هنا ، إضافة رقمين ليست عملية حسابية صعبة. إنها فقط للعرض التوضيحي.
ما هي بقية المعلمة؟
تُستخدم المعلمة rest لتجميع جميع المعلمات المتبقية في الوظيفة. لنفترض أن لدينا دالة تقبل وسيطتين على الأقل ويمكنها قبول أي عدد من المعلمات كحد أقصى. نظرًا لأنه ليس لدينا الحد الأقصى لعدد الوسائط ، يمكننا جمع أول معلمتين باستخدام المتغيرات العادية وجميع المعلمات الأخرى باستخدام المعامل الباقي باستخدام عامل التشغيل الباقي .
function sample(a, b, ...rest) { console.log("Rest parameter", rest); } sample(1, 2, 3, 4, 5);
سيكون المعامل rest مصفوفة من الوسيطات الثلاثة الأخيرة في المثال أعلاه. باستخدام هذا ، يمكننا الحصول على أي عدد من المعلمات لوظيفة ما.
يمكن أن تحتوي وظيفة واحدة على معلمة راحة واحدة فقط. ويجب أن تكون المعلمة المتبقية هي الأخيرة في ترتيب المعلمات.
ما هو تدمير الكائن؟
يتم استخدام إتلاف الكائنات للوصول إلى المتغيرات من الكائن وتعيينها إلى متغيرات لها نفس أسماء مفاتيح الكائنات. دعونا نرى مثالا.
const object = { a: 1, b: 2, c: 3 }; // Object destructuring const { a, b, c } = object; // Now, a, b, c will be used as normal variables console.log(a, b, c);
يمكننا تغيير متغيرات المتغيرات المدمرة في نفس السطر على النحو التالي.
const object = { a: 1, b: 2, c: 3 }; // Changing the names of `a` and `b` const { a: changedA, b: changedB, c } = object; // Now, changedA, changedB, c will be used as normal variables console.log(changedA, changedB, c);
ما هو تدمير المصفوفة؟
يتم استخدام إتلاف الصفيف للوصول إلى المتغيرات من المصفوفة وتعيينها إلى المتغيرات. دعونا نرى مثالا.
const array = [1, 2, 3]; // Array destructuring // It's based on the index of the array const [a, b, c] = array; // Now, we can use a, b, c as normal variables console.log(a, b, c);
ما هي التقاط الحدث وحدث فقاعات؟
يعد التقاط الأحداث وإفراج الأحداث طريقتين لنشر الأحداث في HTML DOM. لنفترض أن هناك عنصرين HTML ، أحدهما داخل الآخر. ويحدث حدث على العنصر الداخلي. الآن ، سيقرر وضع انتشار الحدث ترتيب تنفيذ هذه الأحداث.
حدث فقاعي: يقوم بتشغيل معالج الحدث على العنصر أولاً ، ثم عنصره ، ثم ينتقل إلى أعلى عنصر. هذا هو السلوك الافتراضي لجميع الأحداث.
التقاط الحدث: نحتاج إلى تحديد الحدث الذي نحتاجه لاستخدام هذا النوع من انتشار الحدث. يمكننا تحديده أثناء إضافة مستمع الحدث. سيتم تنفيذ الأحداث بالترتيب التالي إذا تم تمكين التقاط الحدث.
- تبدأ الأحداث في التنفيذ من أعلى عنصر حتى العنصر الهدف إلى أسفل.
- سيتم تنفيذ الحدث على العنصر الهدف مرة أخرى.
- سيحدث انتشار حدث الفقاعة مرة أخرى حتى يرتفع العنصر الأعلى.
يمكننا إيقاف انتشار الحدث باستدعاء event.stopPropogation
طريقة في معالج الحدث.
ما هي الوعود في JavaScript؟
يتم استخدام Promise
الكائن للعمليات غير المتزامنة التي ستكتمل في المستقبل بحالة نجاح أو فشل.
يمكن أن يكون Promise
في إحدى الحالات التالية.
-
pending
- عندما تكون العملية لا تزال جارية. -
fulfilled
- عند اكتمال العملية بنجاح. ستكون لدينا نتائج (إن وجدت) في حالة النجاح. -
rejected
- عند اكتمال العملية بفشل. سيكون لدينا سبب (خطأ) سبب فشلها.
دعونا نرى مثالين على حالات النجاح والفشل.
// Promise which will complete successfully const successPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve({ message: "Completed successfully" }); }, 300); }); successPromise .then((data) => { console.log(data); }) .catch((error) => { console.log(error); }); // Promise which will complete with failure state const failurePromise = new Promise((resolve, reject) => { setTimeout(() => { reject(new Error("Failing the promise for testing")); }, 300); }); failurePromise .then((data) => { console.log(data); }) .catch((error) => { console.log(error); });
يمكنك الحصول على أكثر من واحد then
التسلسل إذا لزم الأمر. سيتم قبول البيانات التي then
إرجاعها مسبقًا في معاودة الاتصال التالية.
اشرح الأنواع المختلفة للنطاق في JavaScript
هناك نوعان من النطاق في JavaScript. النطاق العالمي والنطاق المحلي .
ربما تكون قد سمعت عن نطاق الوظيفة ونطاق الكتلة أيضًا. وهي نطاقات محلية لـ var
و let
، const
على التوالي.
ما هي وظائف الاستدعاء الذاتي؟
وظائف الاستدعاء الذاتي هي وظائف غير معروفة سيتم تنفيذها مباشرة بعد الإنشاء. دعونا نرى بعض الأمثلة.
// Without any parameters (function sayHello() { console.log("Hello, World!"); })(); // With parameters (function add(a, b) { console.log("Sum", a + b); })(1, 2);
يمكننا حتى تمرير الحجج إلى دوال الاستدعاء الذاتي كما رأيت في المثال.
ما هي وظائف السهم؟
وظيفة السهم هي السكر النحوي إلى الوظيفة الطبيعية مع بعض التغييرات. تتصرف مثل الوظائف العادية في حالات الاستخدام العامة. تكون وظائف الأسهم في متناول اليد عندما يكون لدينا عمليات رد نداء. دعونا نرى تركيبها.
// arrow functions will return by default if it doesn't have any brackets let add = (a, b) => a + b; console.log(add(1, 2));
توجد بعض الاختلافات بين وظائف السهم والوظائف العادية.
- لا تملك دالات الأسهم
this
الربط الخاص بها. تشيرthis
الكلمة الأساسية الموجودة داخل وظيفة السهم إلى نطاقها الأصليthis
. - لا يمكن استخدام دالات الأسهم كوظائف منشئ
ما هي عمليات الاسترجاعات؟
رد الاتصال هو وظيفة يتم تمريرها إلى وظيفة أخرى يتم استدعاؤها داخل تلك الوظيفة. يعد استخدام عمليات الاسترجاعات أمرًا شائعًا في JavaScript. دعونا نرى مثالا.
function sample(a, b, callback) { const result = a + b; callback(result); } function finished(result) { console.log("Finished with", result); } sample(1, 2, finished);
يتم تمرير الوظيفة finished
على أنها رد اتصال sample
. يتم استدعاء الوظيفة finished
مع النتيجة بعد تنفيذ بعض الإجراءات. سترى استخدام عمليات الاسترجاعات في الغالب في عمليات غير متزامنة مثل الوعود و setTimeout وما إلى ذلك .. ،
ما هي أنواع الأخطاء المختلفة؟
دعنا نتحقق من بعض الأخطاء في JavaScript.
ReferenceError : سيحدث هذا الخطأ إذا كان المتغير الذي نصل إليه متاحًا.
TypeError: سيقوم JavaScript بإلقاء هذا الخطأ إذا كان الخطأ لا يتطابق مع أنواع أخرى من الأخطاء. سيحدث أيضًا عندما نحاول تنفيذ إجراء غير متوافق مع البيانات.
خطأ في بناء الجملة : سيحدث هذا الخطأ إذا كانت صيغة JavaScript غير صحيحة.
هناك بعض أنواع الأخطاء الأخرى أيضًا. لكن هذه هي أنواع الأخطاء الشائعة في JavaScript.
ما هي نطاقات المتغيرات المختلفة في JavaScript؟
هناك نوعان من نطاقات المتغيرات في JavaScript. المتغيرات المُعلنة باستخدام الكلمة المفتاحية var
سيكون لها نطاق وظيفي ، والمتغيرات المُعلنة باستخدام let
و const
سيكون لها نطاق الكتلة .
راجع السؤال السابع عشر لمزيد من التفاصيل حول نطاق هذه المتغيرات.
ما هي أحرف الهروب في جافا سكريبت؟
الشرطة المائلة للخلف هي حرف الهروب في JavaScript. يتم استخدامه لطباعة بعض الأحرف الخاصة التي لا يمكننا طباعتها بشكل عام. لنفترض أننا نريد طباعة apostrophe (')
داخل سلسلة لا يمكننا القيام بها بشكل طبيعي لأن السلسلة ستنتهي عند الفاصلة العليا الثانية. في هذه الحالة ، سنستخدم حرف الهروب لتجنب إنهاء السلسلة عند تلك النقطة.
const message = 'Hi, I\'m Geekflare'; console.log(message);
يمكننا تحقيق الناتج أعلاه بدون استخدام حرف escape عن طريق استبدال الفاصلات العليا المفردة الخارجية بفاصلات عليا مزدوجة. لكنها مجرد مثال على كيفية استخدام شخصية الهروب. هناك أحرف أخرى نحتاج بالتأكيد إلى حرف إلغاء لها مثل \n
، \t
، \\
إلخ .. ،
ما هو BOM و DOM؟
نموذج كائن المستعرض (BOM): تحتوي جميع المتصفحات على قائمة مكونات الصنف تمثل نافذة المتصفح الحالية. يحتوي على كائن النافذة العلوي لدينا والذي يتم استخدامه لمعالجة نافذة المتصفح.
نموذج كائن المستند (DOM): تُنشئ المتصفحات DOM عندما يتم تحميل HTML في هيكل الشجرة. يمكننا معالجة عناصر HTML باستخدام DOM API.
ما هو كائن الشاشة؟
كائن الشاشة هو أحد خصائص كائن النافذة العامة. يحتوي على خصائص مختلفة للشاشة التي تظهر عليها نافذة المتصفح الحالية. بعض الخصائص هي العرض والارتفاع والاتجاه وعمق البكسل وما إلى ذلك.
استنتاج
قد تكون هناك أسئلة متابعة لجميع الأسئلة المذكورة أعلاه. لذلك ، تحتاج إلى إعداد المفاهيم حول جميع الأسئلة المذكورة أعلاه.
يمكنك أيضًا استكشاف بعض أسئلة وأجوبة Java الشائعة.
تعلم سعيد