رتبها

يلا نكسسر راس JavaScript Interview⚡️⚡️🚀 جاوبت على الـ 70 سؤال، حقيقي جدا استمتعت بحل الاسئلة كانت مراجعة جميلة جدا🔥👌 حاولت اشرح الاجابات بالعربي، راح ارفق صور ومراجع في كل سؤال حليته بحيث تقدرو تفهمو الاجابات بشكل اكبر
الثريد ما يسمح باكثر من 24 تغريد راح اقسمها :)
⚡️THREAD ⚡️

1. What's the difference between undefined and null??
اولا NULL هي قيمة مميزة معطاه تعني "قيمة فارغة" من نوع Object.
اما Undefined فهي نوع بحد ذاتها من البيانات يشير "قيمة غير موجودة".

2. What does the && operator do?
أحد العوامل المنطقية ويسمى "AND"، يقوم بتنفيذ العمليات المنطقية من اليسار الى اليمين مع ارجاع اخر قيمة بشرط ان تكون نواتج جميع عملية هو True.

3. What does the || operator do?
أحد العوامل المنطقية ويسمى "OR"، يقوم بتنفيذ العمليات المنطقية من اليسار الى اليمين يرجع أول قيمة منطقية صحيحة في سلسلة العوامل المنطقية أو آخر قيمة خاطئة إذا لم تجد أي قيمة منطقية صحيحة.

4. Is using the + or unary plus operator the fastest way in converting a string to a number?
صحيح، هي الاسرع، لأنه لا يقوم بأية عمليات اضافية على الرقم.

5. What is the DOM?
أحد معايير W3C، فهي لغة واجهه محايدة تسمح للبرامج (Programs) والنصوص التنفيذية (script) بالوصول والتعديل على المحتوى وهيكلة ومظهر المستند.
3 أنواع:
1-: CORE DOM نموذج لجميع أنواع المستندات
2-: XML DOM نموذج لمستندات XML
3- : HTML DOM نموذج لمستندات HTML

6. What is Event Propagation?
الية توضح كيفية انتقال الاحداث في شجرة HTML DOM حتى وصولها الى العنصر الهدف وما الذي سيحدث بعد ذلك.

7. What's Event Bubbling?
مراقبة الاحداث ابتداء من العنصر الهدف ثم العنصر الاب الذي يحمله عابرا جميع العناصر تصاعديا حتى الوصول الى window وهو العنصر الذي يحتوي جميع عناصر الـ HTML DOM.

8. What's Event Capturing?
مراقبة الاحداث ابتداء من العنصر window ثم العنصر الابن الذي يحمل جميع العناصر تنازليا حتى الوصول الى العنصر الهدف. عكس (Bubbling).

9. What's the difference between event.preventDefault() and event.stopPropagation() methods?
- يقوم stopPropagation يقوم بمقاطعه تتبع الاحداث سواء كانت Bubbling او Capturing.
- يقوم preventDefault يقوم بمنع ردود الفعل الأساسية للمتصفح وكيفية تعامله مع الاحداث.

10. How to know if the event.preventDefault() method was used in an element?
- قم بفحص احداث العنصر بواسطة أدوات المطور ( Dev Tool )
- قائمة Event Listeners ( متنصت الاحداث )
- سترى جميع متنصتات الاحداث، اضغط على الهدف وسيقوم بتوجيهك الى source وستجد استدعاء preventDefault()

11. Why does this code obj.someprop.x throw an error?
⛔️يتوقع انه سيعرض عليك كود معين لهذا السؤال، سأرفق مثالا.
الاجابة:
لأننا نحاول الوصول الى قيمة x غير معرفه undefined في خصائص Object.

12. What is event.target ?
تشير الى العنصر الذي قام بأطلاق الحدث.

13. What is event.currentTarget?
تشير الى العنصر الحالي في مراحل تتبع انتقال الاحداث Event Propagation (Bubbling أو Capturing) الوصول الى اخر عنصر.

14. What's the difference between == and ===?
== يقوم بتحويل المتغيرات الى نوع موحد قبل ان يقوم بمقارنه قيمها، لذلك فهو يقوم باخذ نوع قيمة المتغير بالاعتبار عند المقارنة.
=== يقوم بقارنة القيم النهائية مع مقارنة نوعها type.

15. Why does it return false when comparing two similar objects in JavaScript?
في JavaScript تصنف العناصر (Objects) على انها قيم متميزة تنفرد بذاتها عن الأخرى حتى اذا كانا يحملان نفس الخصائص والقيم.

16. What does the !! operator do?
تقوم بتحويل القيم الحسابية او البيانية الى عوامل منطقية ( Truthy or Falsy ) .

17. How to evaluate multiple expressions in one line?
باستخدام علامة ( , ) كما في المثال التالي

18. What is Hoisting?
هي الية رفع تحديد المتغيرات والدوال الى نطاقها الأعلى قبل مرحلة التنفيذ execution
مقطع للتوضيح:
youtube.com

19. What is Scope?
هو نطاق الذي نتمكن فيه على وصول إلى المتغيرات أو الدوال المتاحة.
ويصنف الى 3 أصناف:
1- Global Scope ( اي مكان خارج اي block {} )
2- Function Scope بداخل اي function { // function scope }
3- Block Scope بداخل اي {// block scope }

20. What are closures?

21. What are the falsy values in JavaScript?
هي القيم التي تصنف خاطئة منطقيا.
مثل:
'', 0, null, undefined, NaN, false

22. How to check if a value is falsy?
الطريقة الأولى باستخدام Boolean function
الطريقة الثانية استعمال Double exclamation Mark !!

23. What does "use strict" do?
لتحديد ذلك، انه يجب تنفيذ الأوامر البرمجية في وضع صارم، يساعدك على التقاط أصغر الأخطاء المكتوبة مما يساهم في تسريع عمليات الـ Debugging ويجبرك على كتابة اكواد ذات جودة عالية.

24. What's the value of 'this' in JavaScript?
يشير 'this' الى قيمة الـ Object اثناء تنفيذه، فتختلف قيم this اعتمادا على مكان استدعائها.
مثال على استعماله:

25. What is the prototype of an object?
الية تستعرض الخصائص المتاحة للاستخدام والتي يحظها بها كل عنصر.

26. What is an IIFE, what is the use of it?
هي Immediately Invoked Function Expression
وهي الدوال التي يتم تنفيذها مباشرة عند بعد انشائها مباشرة دون الحاجة الى استدعاءها.

27. What is the use Function.prototype.apply method?
يقوم بتحديد قيمة ( this ) في الدالة المستدعاة الى العنصر الذي تم تمريره مباشرة وفصل القيم الأخرى Arguments في مصفوفة.

28. What is the use Function.prototype.call method?
يقوم بتحديد قيمة ( this ) في الدالة المستدعاة الى العنصر الذي تم تمريره مباشرة وفصل القيم الأخرى Arguments باستعمال (,).

29. What's the difference between Function.prototype.apply and Function.prototype.call?
في كيفية فصل Arguments
- Function.prototype.apply يتم تمرير الـ Arguments منفصلة بداخل مصفوفة.
- Function.prototype.call يتم فصل الـ Arguments باستعمال ( , ) دون الحاجة الى انشاء مصفوفة.

30. What is the usage of Function.prototype.bind?
يتيح لنا انشاء نسخة جديدة من دالة من دالة معرفه وإتاحة الوصول الها عن طريق ( this ).

31. What is Functional Programming and what are the features of JavaScript that makes it a candidate as a functional language?
هي نموذج أو نمط برمجة تعريفي حول كيفية بناء تطبيقاتنا بوظائف باستخدام التعبيرات التي تحسب قيمة دون mutating أو changing arguments التي يتم تمريرها إليها.

32. What are Higher Order Functions?
نوع من الدوال Functions تقوم بإرجاع او استقبال Functions كـ Arguments.

33. Why are functions called First-class Objects?
لأنها تعامل كغيرها من القيم في لغة javascript، فيمكن ان يتم حملها في متغيرات variables ويمكن ان يتم حملها بداخل Objects بمسمى Method، ويمكن تمريرها كـ Arguments ويمكن ارجاعها كمخرجات دوال أخرى.

34. Implement the Array.prototype.map method by hand.

35. Implement the Array.prototype.filter method by hand.

36. Implement the Array.prototype.reduce method by hand.

37. What is the arguments object?
مجموعة الـ Parameters الممررة في دالة Function وتعامل بصورة مشابهه للمصفوفة فلديلها طول length ويمكن الوصول الى عناصرها باستخدام indexing مثل arguments[1]
ويمكن تحويلها الى مصفوفة حقيقية باستخدام Array.prototype.slice

38. How to create an object without a prototype?
يمكننا استخدام Object.create كما في المثال التالي:

39. Why does b in this code become a global variable when you call this function?
⛔️ يرجح انه سوف يكون هناك كود مستعرض كما هو في موضح في الصورة ادناه.
الاجابة في صورة التويتة ماتسمح مجال :)

41. What are the new features in ES6 or ECMAScript 2015?

42. What's the difference between var, let, and const keywords?
هي var
Function Scoped قيمة يتاح الوصول لها في جميع انحاء نطاق الدالة، وحتى في داخل Block Scope في الدالة.
هي Const & Let
هما Block Scoped مما يعني انه لا يمكن الوصول الى هذه المتغيرات الى في نطاق البلوك {} .

43. What are Arrow functions?
احد إضافات ES6 لتعريف دالة كمتغيرات دون استخدام الـ Keyword “function”، وهي تتيح لك كتابة دالة بشكل باستخدام syntax ابسط واسرع.

44. What are Classes?
احد إضافات ES6 لتعريف الدوال ذات نماذج محددة ( constructor function ) باستخدام syntax ابسط واكثر تنظيما لتسهيل عملية انشاء هذا النوع من الدوال.

45. What are Template Literals?
احد إضافات ES6 لانشاء نصوص استخداما backtick او ما يسمى بـ back-quote ( ` ` ) والتي تتيح العديد من الإمكانيات في كتابة النص اكثر من استعمال " "

46. What is Object Destructuring?
احد إضافات ES6 والتي تتيح لك الوصول الى قيمة العناصر بأسلوب ابسط واسرع يساعدك على كتابة كود نظيف وواضح.

What are ES6 Modules?
أسلوب جميل تتيحه ES6 في استيراد وإصدار وتقسيم أجزاء اكواد المشروع عن طريق استخدام Keywords واضحة ومباشرة export و import دون الحاجة الى كتابة أوامر برمجية معقدة المظهر.
امثلة:

48. What is the Set object and how does it work?
هي ميزة مضافة الى ES6 تمكنك من تخزين قيم غير مكررة.

49. What is a Callback function?
هي الدالة التي يتم استدعاءها عند حدث محدد في وقت معين متنصت له.

50. What are Promises?

51. What is async/await and How does it work?
هي طريقة أخرى من طرق كتابة asynchronous operations او non-blocking code.ES6 مبنية بخصائص Promises تتيح لك كتابة العمليات الغير متزامنة بشكل اكثر وضوحا مع حالات العملية.
then نجاح العملية
catch فشل العملية
finally نجاح او فشل العملية

52. What's the difference between the Spread operator and Rest operator?

53. What are Default Parameters?
أسلوب جديد في ES6 يتيح لك انشاء قيم افتراضية للمتغيرات في حال استدعاء دالة تتطلب تمرير بعض القيم. ولكن لم يتم تمرير أي قيمة فهنا يكمن دور انشاء القيمة الافتراضية للمتغير لاستكمال العملية دون أخطاء.

54. What are Wrapper Objects?
بوجود Primitive values كـ string, number, Boolean باستثناء null و undefined لها خصائص و methods بالرغم من انها ليست Objects. أنواع الـ Wrappers: String, Number, Boolean, Symbol و BigInt.
فكل نوع يمكنك من التعامل مع القيم بما يناسبها من عمليات.

55. What is the difference between Implicit and Explicit Coercion?
ا"Implicit" الطريقة التي تمكننا من تحويل نوع قيمة معينة الى شكل اخر مباشرة دون تدخل المبرمج بكتابة أوامر معينة لتحويل قيمة نوع قيمة العنصر.
ا"Explicit"الطريقة يتدخل بها المبرمج بتحويلا قيمة من نوع الى اخر.

56. What is NaN? and How to check if a value is NaN?
تعبير يفسر نوع القيمة في حال انها "ليست رقما" مما يمكننا من تحديد إمكانية تحويل الأرقام المكتوبة بصيغة نصوص الى قيم من نوع "Number" للوصول الى جميع الخصائص مثل .toFixed() وغيرها.
وتكون عملية التحقق بتمرير النص الى دالة isNaN

57. How to check if a value is an Array?
يمكننا التحقق من نوع القيم ما اذا كانت مصفوفة ام لا باستخدام الدالة Array.isArray مع تمرير القيمة عبر الدالة.

58. How to check if a number is even without using the % or modulo operator?
يمكننا استعمال أحادي المعامل AND & لتحديد ما اذا كان العدد زوجي ام لا.

59. How to check if a certain property exists in an object?
يمكننا التحقق من وجود خاصية في عنصر بثلاث طرق:
- استخدام Keyword "In".
- استخدام hasOwnProperty Methood المتاحة للـ Objects
- استخدام الـ Bracket Notion بشكل مباشر.

60. What is AJAX?
AJAX = Asynchronous JavaScript and XML مجموعة من التقنيات التكاملية لاستعراض البيانات بشكل غير متزامن.
تمكننا من ارسال واستقبال البيانات دون الحاجة الى إعادة تحميل النافذة.

61. What are the ways of making objects in JavaScript?
- باستخدام Object Literal
2- باستخدام Constructor Functions ( Classes )
3- باستخدام Object.create Method

62. What's the difference between Object.seal and Object.freeze methods?
ا"Object.freeze" تمكننا من جعل خصائص الـ Object غير قابلة للتغير ( تجميد قيمها الحالية )
ا"Object.seal" تمكننا من اتاحة إمكانية استئناف التغيير والتعديل على قيم الـ Objects

63. What's the difference between the in operator and the hasOwnProperty method in objects?

64. What are the ways to deal with Asynchronous Code in JavasScript?
- Callback
- Promises
- async/await
- مكتبات أخرى مثل async.js, bluebird, q, co

65. What's the difference between a function expression and a function declaration?
في حال قمنا باستدعاء دالة تم كتابتها كـ expression في تصنف كـ hosted function
اما في حال قمنا بتعريف دالة كـقيمة لمتغير في تصنف كـ Not Hosted
⛔️اذا صعب شرحي ممكن تشوف
youtube.com

66. How many ways can a function be invoked?
- Invocation as a function
- Invocation as a method
- Invocation as a constructor
- Invocation with the “apply” and “call” methods

67. What is memoization and what's the use it?

68. Implement a memoization helper function.

69. Why does typeof null return object? How to check if a value is null?
لانه تم تعريف قيمة null كـ object منذ ولادة JavaScript لذلك في حال انه تم تغيير نوعها الى typeof null سيستوجب ذلك العديد من المشاكل التي لا حصر لها في هذه اللغة البرمجية.

70. What does the new keyword do?
تستخدم مع الـ constructor functions ( class ) لانشاء Objects.

واخيررااا حاببب اشكررر @Alydotdev جدا على الQuiz الرائعع، وحقيقة هذي اسئلة تواجهها في حال كان الانترفيورز مختصين ومحترفين IT⚡️👌 كل اللي عليك تفهم اللغة البرمجية اللي انت مختص فيها سواء Javascript او غيرها.
وكالعادة اذا ضعت في اجابة او موضوع من اللي كتبته اسألني اعطيك مراجع🙌⚡️💛

التصنيفات

المزيد من هذا الكاتب

مواضيع ذات صلة

الأكثر اعجابا

التصنيفات

المزيد من هذا الكاتب

مواضيع ذات صلة

الأكثر اعجابا

فك الثريد