29 أسئلة وأجوبة مقابلة AngularJS الأكثر شيوعًا [للمبتدئين وذوي الخبرة]

AngularJS هو أحد أكثر أطر عمل الويب شيوعًا في المشهد التكنولوجي الحديث. على الرغم من أن AngularJS كان في البداية أحد مشاريع Google ، إلا أنه أصبح لاحقًا إطار عمل مفتوح المصدر. AngularJS هو إطار عمل JavaScript Model-View-Controller من جانب العميل يستخدم بشكل أساسي لبناء تطبيقات الويب الديناميكية ، وخاصة تطبيقات الصفحة الواحدة.

نظرًا لأن AngularJS يعتمد بالكامل على HTML و JavaScript ، فإنه يسمح لك باستخدام HTML كلغة نموذج. فهو لا يغير فقط HTML الثابت إلى HTML الديناميكي ولكنه يساعد أيضًا في توسيع قدرات HTML عن طريق إضافة سمات مضمنة. لم تكتفِ بذلك ، تعمل AngularJS أيضًا على توسيع قدرة HTML على إنشاء سمات مخصصة باستخدام JavaScript. أفضل ما في AngularJS هو أن ميزات ربط البيانات وحقن التبعية تساعد في التخلص من الحاجة إلى كتابة تعليمات برمجية زائدة عن الحاجة.

أصبحت شعبية AngularJS واسعة الانتشار لدرجة أن الطلب على مهارات AngularJS في الصناعة آخذ في الازدياد. ومع ذلك ، إذا كنت ترغب في الحصول على وظيفة تتطلب مهارات AngularJS ، فيجب عليك أولاً كسر مقابلة AngularJS. لمساعدتك في الحصول على مقابلة AngularJS ، قمنا بإنشاء قائمة شاملة بأسئلة وأجوبة مقابلة AngularJS.

هنا يذهب!

أهم أسئلة وأجوبة مقابلة AngularJS

1. ما هو AngularJS؟ ما هي السمات الرئيسية لبرنامج AngularJS؟

AngularJS هو إطار عمل JavaScript تم تطويره بواسطة Google. يتم استخدامه لإنشاء تطبيقات ويب ديناميكية وقابلة للتوسيع. يعتمد على نمط MVC (وحدة التحكم في عرض النموذج) مع HTML كلغة القالب. كما ذكرنا في المقدمة ، يعمل AngularJS على JavaScript و HTML عادي ، مما يعني أنك لا تحتاج إلى الاعتماد على التبعيات الخارجية الأخرى لاستخدامه. يساعد AngularJS في ربط كائنات JavaScript بعناصر واجهة مستخدم HTML.

الميزات الأساسية لـ AngularJS هي:

• قالب
• مجال
• مراقب
• خدمات
• نموذج
• رأي
• ربط البيانات
• المرشحات

تعرف على المزيد حول: Angular 7.0 - ما الجديد في صورتها الرمزية؟

2. تحديد النطاق في AngularJS.

في AngularJS ، يعد Scope نموذجًا للتطبيق يعمل كحلقة وصل بين الغراء بين وحدة التحكم في التطبيق والعرض. تم تصميم النطاق لمراقبة التعبيرات ونشر الأحداث. عادة ، يتم تنظيم النطاقات في هيكل هرمي يكرر بنية DOM (نموذج كائن المستند) للتطبيق. يمكنه مشاهدة التعبيرات ونشر الأحداث.

3. تحديد ربط البيانات في AngularJS.

في AngularJS ، يشير ربط البيانات إلى العملية التي تتم فيها مزامنة البيانات بين النموذج ومكونات العرض تلقائيًا. يساعد ربط البيانات في تبسيط عملية تحديد التطبيقات التفاعلية دون القلق بشأن دفع البيانات أو سحبها بين العرض / القالب والمكون. هناك أربعة نماذج لربط البيانات:

• ربط الحدث
• ربط الملكية
• سلسلة الاستيفاء
• ثنائي الاتجاه ربط البيانات

4. تحديد التعبير الزاوي. ما هو الفرق بين تعبيرات Angular وتعبيرات JavaScript؟

التعبيرات الزاوية هي مقتطفات من التعليمات البرمجية يتم وضعها في الربط (يشبه إلى حد كبير نمط JavaScript) ، مثل:

{{زاوية}}

تساعد التعبيرات الزاويّة في ربط بيانات التطبيق بـ HTML.

الاختلاف الأساسي بين تعبيرات JavaScript والتعبيرات الزاويّة هو:

• بينما يتم تقييم تعبيرات JavaScript مقابل نافذة عامة ، يتم تقييم التعبيرات الزاويّة مقابل كائن النطاق.
• يتسامح تقييم التعبيرات الزاويّة مع القيم الفارغة وغير المعرّفة ، ولكن في JavaScript ، عادةً ما تنتج الخصائص غير المعرّفة TypeError أو ReferenceError.
• على عكس JavaScript ، لا تسمح التعبيرات الزاويّة باستخدام الحلقات أو الشروط الشرطية أو الاستثناءات.
• بينما يدعم AngularJS المرشحات ، فإن JavaScript لا يدعمها.

5. قم بتسمية IDEs الشائعة المستخدمة لتطوير تطبيقات AngularJS.

فيما يلي IDEs الأكثر استخدامًا (بيئة التطوير المتكاملة) لـ AngularJS:

• Eclipse - هذا أحد IDEs المفضل لمطوري Java / JavaScript. وهو يدعم ملحقات AngularJS.
• Visual Studio - هذا هو Microsoft IDE مصمم لتطوير تطبيقات الويب بسهولة وسرعة.
• WebStorm - هذا بلا شك أحد أقوى IDEs لتطوير JavaScript الحديث. يسمح بدمج التبعيات بسهولة باستخدام Angular CLI.
• Aptana - هذا إصدار مخصص ومفتوح المصدر من Eclipse. يأتي محملاً بأحدث الأدوات ومعايير الويب المطلوبة لتطوير الويب.
• Sublime Text - هذا هو IDE الموصى به بشدة لـ HTML و CSS وجافا سكريبت. وبطبيعة الحال ، فهو متوافق مع AngularJS.

تحقق أيضًا من: هل AngularJS هو الاختيار الصحيح لتطوير تطبيقات الجوال التالية؟

6. ما هي التوجيهات في AngularJS؟

التوجيهات في AngularJS ليست سوى سمات HTML ممتدة ببادئة "ng". هناك ثلاث توجيهات أساسية لـ AngularJS:

• ng-app - الغرض من هذا التوجيه هو تحديد عنصر HTML الذي يجب اعتباره العنصر الجذر لتطبيق Angular. بينما يطبق Angular حالة spinal للسمات المخصصة ، فإنه يستخدم مرشح camelCase للتوجيهات المقابلة التي تنفذها.
• ng-model - يساعد هذا التوجيه في ربط قيم عناصر تحكم HTML (الإدخال ، التحديد ، textarea) ببيانات التطبيق. في نموذج نانوغرام ، لا يتغير النطاق المنعكس في العرض فحسب ، بل حتى التغييرات في العرض تنعكس في النطاق.
• ng-bind - يُستخدم هذا التوجيه لربط بيانات التطبيق المشروطة بطريقة عرض HTML.

7. ما هو الغرض من مسارات AngularJS؟

يتيح لك استخدام مسارات AngularJS إنشاء عناوين URL مختلفة لمحتوى مختلف في تطبيق Angular. من خلال القيام بذلك ، يمكنك وضع إشارة مرجعية على عناوين URL لمحتواها المحدد ، ويطلق على كل عنوان URL تم وضع إشارة مرجعية عليه مسارًا في AngularJS.

8. تحديد سلسلة الاستيفاء في AngularJS.

في AngularJS ، يشير الاستيفاء للسلسلة إلى بناء جملة فريد يستخدم تعبيرات نموذجية داخل أقواس {{}} لعرض بيانات المكون. غالبًا ما يُشار إلى الاستيفاء المتسلسل باسم "تركيب الشارب". عند استخدام بناء الجملة هذا ، تحتاج أولاً إلى تضمين تعبيرات JavaScript (التي يجب تنفيذها) داخل الأقواس المزدوجة المتعرجة ثم تقوم بتضمين الإخراج النسبي في كود HTML.

9. حدد AngularJS "دورة الملخص".

تشير دورة الملخص بشكل أساسي إلى عملية ربط البيانات في AngularJS. في هذه العملية ، يتم وضع الإصدارات القديمة والجديدة من قيم نموذج النطاق مقابل بعضها البعض ومقارنتها. على الرغم من تشغيل دورة الملخص تلقائيًا ، يمكنك أيضًا استخدام "$ apply ()" لبدء العملية يدويًا.

10. ما هو الفرق بين الربط أحادي الاتجاه والتجليد في اتجاهين؟

يتم استخدام الربط أحادي الاتجاه لربط البيانات من النموذج بالعرض دون التحديث التلقائي لقالب HTML أو طريقة العرض. لذلك ، في هذا الأسلوب ، يجب عليك كتابة رمز مخصص لتحديث قالب HTML ، والذي سيعمل على تحديث طريقة العرض في كل مرة يتم ربط البيانات من نموذج إلى آخر.

على عكس ذلك ، يقوم الربط ثنائي الاتجاه بربط البيانات من النموذج بالعرض والعكس صحيح عن طريق تحديث قالب HTML تلقائيًا دون مطالبتك بكتابة أي تعليمات برمجية مخصصة.

11. تحديد وظيفة الربط. قم بتسمية أنواع وظائف الربط.

يجمع الارتباط بين التوجيهات ونطاق لإنتاج عرض حي. تُستخدم وظيفة الارتباط لتسجيل مستمعي DOM ولتحديث DOM. يتم تنفيذ هذه الوظيفة على الفور بعد استنساخ القالب.

هناك نوعان من وظيفة الربط:

• وظيفة الربط المسبق - يتم تنفيذ هذه الوظيفة قبل ربط العناصر الفرعية وهي عادةً ليست طريقة آمنة لتحويل DOM.
• وظيفة ربط ما بعد - يتم تنفيذ هذه الوظيفة بعد ربط العناصر الفرعية.

12. ما هو الحاقن في AngularJS؟

الحاقن هو محدد موقع الخدمة في AngularJS. الغرض الأساسي من الحاقن هو تلقي مثيلات الكائن التي تم تحديدها من قبل الموفرين ، واستدعاء الطرق ، ووحدات التحميل ، وأنواع إنشاء مثيل لها. يتضمن كل تطبيق Angular حاقنًا يساعد في البحث عن مثيلات الكائن من خلال أسمائها.

13. قم بتسمية أشكال التصميم المختلفة التي يضيفها ng-model إلى فئات CSS.

يضيف نموذج ng نماذج التصميم التالية إلى فئات CSS:

• ng- صالح
• ng- غير صالح
• نانوغرام البكر
• نانوغرام قذرة

14. تعريف حقن التبعية. كيف يمكن لكائن أو وظيفة الوصول إلى تبعياتها؟

حقن التبعية (DI) هو نمط تصميم برمجي يحدد كيف يمكن للكود استرداد تبعياته. يسمح للمكونات بالوصول إلى تبعياتها بدلاً من تشفيرها داخل مكون. لاسترداد العناصر المطلوب تكوينها عند تحميل وحدة نمطية في أحد التطبيقات ، تستخدم عملية "التكوين" DI.

يمكن لكائن أو وظيفة الوصول إلى تبعياته بالطرق التالية:

• يمكن إنشاء تبعية باستخدام عامل تشغيل جديد.
• يمكن البحث عن تبعية من خلال الإشارة إلى متغير عالمي.

15. قم بتسمية المكونات التي يمكن حقنها كعنصر تبعية في AngularJS.

في AngularJS ، يمكنك حقن المكونات التالية في بعضها البعض كاعتماديات:

• قيمة
• خدمة
• مصنع
• مستمر
• مزود

اعثر على إجابات لهذا السؤال أيضًا: لماذا تصبح مطورًا مكدسًا كاملًا؟

16. ما هي الخطوات المتبعة في عملية تجميع HTML؟

تتضمن عملية تجميع HTML الخطوات التالية:

• أولاً ، يتم تحليل HTML في DOM باستخدام واجهة برمجة تطبيقات المتصفح القياسية.
• في الخطوة التالية ، يتم استخدام استدعاء التابع $ compile () لأداء ترجمة DOM. تتجاوز الطريقة DOM لمطابقة التوجيهات.
• تتضمن الخطوة الأخيرة ربط القالب بنطاق عن طريق استدعاء وظيفة الربط التي تم إرجاعها من الخطوة السابقة.

17. ما هي الخدمة في AngularJS؟

الخدمات هي وظائف JavaScript مصممة لأداء مهام محددة. على سبيل المثال ، $ https: يتم استخدام الوظيفة لإجراء مكالمة AJAX للحصول على بيانات الخادم بينما يتم استخدام وظيفة التوجيه $ لتحديد معلومات التوجيه. هناك العديد من هذه الخدمات التي يمكنها أداء مهام محددة.

18. تحديد التوجيه في AngularJS. قم بتسمية الأنواع المختلفة من التوجيهات.

في AngularJS ، التوجيه هو سلوك أو وظيفة يتم تشغيلها أثناء عملية الترجمة عند مصادفة بنيات HTML معينة. التوجيهات هي علامات على عناصر DOM (مثل العناصر والسمات و CSS وما إلى ذلك). يمكنك أيضًا استخدامها لإنشاء علامات HTML مخصصة تعمل كعناصر واجهة مستخدم جديدة ومخصصة.

الأنواع الأربعة الأساسية للتوجيهات هي:

• توجيهات العنصر
• توجيهات السمة
• توجيهات التعليق
• توجيهات فئة CSS

19. التفريق بين الشرح والديكور في AngularJS.

في Angular ، التعليقات التوضيحية هي مجموعة البيانات الوصفية الوحيدة للفصل الذي يستخدم مكتبة Reflect Metadata لإنشاء مصفوفة "التعليقات التوضيحية". من ناحية أخرى ، فإن المصممين هم أنماط تصميم تُستخدم لفصل الزخرفة أو تعديل فئة دون تغيير كود المصدر الأصلي للتطبيق.

20. تحديد وحدات التحكم.

أدوات التحكم هي وظائف JavaScript مرتبطة بنطاق معين. هدفهم الأساسي هو توفير البيانات والمنطق لواجهة مستخدم HTML. فهم الممثلون الرئيسيون في إطار عمل AngularJS الذي يتحكم في كيفية تدفق البيانات من الخادم إلى واجهة مستخدم HTML. علاوة على ذلك ، تحمل وحدات التحكم أيضًا وظائف للعمل على البيانات وتحديد طريقة العرض التي يجب تحديثها لعرض البيانات المحدثة المستندة إلى النموذج.

21. كيف يتم الاحتفاظ بالسجلات في AngularJS؟

للاحتفاظ بالسجلات ، يتم استخدام خدمة السجل $ في AngularJS. الغرض الأساسي من خدمة $ log هو المساعدة في تصحيح الأخطاء واستكشاف الأخطاء وإصلاحها من خلال الطرق المذكورة أدناه:

• log () - تُستخدم لكتابة رسالة سجل في وحدة التحكم.
• info () - تُستخدم لكتابة رسالة معلومات.
• warn () - تستخدم لكتابة رسالة تحذير.
• خطأ () - يُستخدم لكتابة رسالة خطأ.
• debug () - يتم استخدامه لكتابة رسالة تصحيح.

22. تحديد rootcope $ في AngularJS. كيف تختلف عن سكوب؟

في AngularJS ، يعد كل من $ rootcope و $ range كائنات تُستخدم عمومًا لمشاركة البيانات من وحدة التحكم لعرضها. ومع ذلك ، فإن الاثنين مختلفان تمامًا. تتمثل نقطة الاختلاف الرئيسية بين $ rootcope و $ range في أنه في حين أن الأول متاح عالميًا عبر جميع وحدات التحكم ، فإن نطاق $ متاح فقط في وحدات التحكم التي أنشأته مع وحدات تحكم الأطفال الخاصة بهم.

23. قم بتسمية بعض المتصفحات التي يدعمها AngularJS.

فيما يلي بعض المتصفحات التي يدعمها AngularJS:

• موزيلا فايرفوكس
• جوجل كروم
• حافة Microsft
• IE موبايل
• Safari (iOS)
• IE 10،11

24. كيف يمكنك تمكين وضع HTML5 في Angular 1.x؟

لتمكين وضع HTML5 في Angular 1.x ، يجب عليك تشغيل الكود الوارد أدناه:

angular.module ('myApp'، [])

.config (الوظيفة ($ routeProvider، $ locationProvider) {

$ routeProvider

.متي('/'، {

templateUrl: "جزئي / home.html"،

تحكم: mainController

})

// استخدم واجهة برمجة تطبيقات سجل HTML5

locationProvider.html5Mode $ (صحيح)؛

}) ؛

25. قم بتسمية أدوات التحقق المضمنة في AngularJS.

يدعم AngularJS جميع سمات HTML5 القياسية للتحقق من صحة المدخلات. فيما يلي بعض أدوات التحقق المضمنة في AngularJS:

• دقيقة
• الأعلى
• مطلوب
• اكتب = ”number” أو type = ”email”

26. كيفية إجراء مكالمة AJAX باستخدام AngularJS؟

يمكنك استخدام https: خدمة في AngularJS لإجراء مكالمة AJAX لقراءة البيانات من الخادم. يتطلب AngularJS أن تكون البيانات بتنسيق JSON. ينشئ الخادم استدعاء قاعدة بيانات لاسترداد السجلات المطلوبة. بمجرد أن تصبح البيانات جاهزة ، يمكن استخدام خدمة https: $ لاسترداد البيانات من الخادم ، مثل:

وظيفة studentController ($ نطاق ، $ https :) {

var url = "data.txt" ؛

$ https: .get (url) .success (function (response) {

range.students = استجابة ؛

}) ؛

}

27. ما هو التطبع في AngularJS؟

في AngularJS ، يشير التدويل إلى الطريقة المستخدمة لعرض المعلومات الخاصة بالموقع على موقع الويب. على سبيل المثال ، يجب استيعاب موقع الويب الذي يعرض محتوى باللغة الإنجليزية في الولايات المتحدة والدنماركية في فرنسا وفقًا للموقع.

تقدم AngularJS دعم تدويل يحمل في ثناياه عوامل لثلاثة أنواع من المرشحات:

• تاريخ
• أعداد
• عملة

28. وصف خطوات عملية إقلاع AngularJS.

عند تحميل صفحة في مستعرض ، تبدأ عملية تمهيد AngularJS. والخطوات المتضمنة هي كما يلي:

• يتم تحميل ملف مستند HTML وتقييمه بواسطة المستعرض. ثم يتم تحميل ملف AngularJS JavaScript ، ويتم إنشاء كائن عام.
• في الخطوة التالية ، يتم تنفيذ ملف JavaScript المسؤول عن تسجيل وظائف وحدة التحكم.
• يقوم AngularJS بمسح HTML للعثور على تطبيقات AngularJS وطرق العرض. عندما ينجح في العثور على عرض ، فإنه يربط ذلك العرض المعين بوظيفة التحكم المقابلة.
• أخيرًا ، ينفذ AngularJS وظائف وحدة التحكم ويعرض المشاهدات مع البيانات من النموذج الذي تم ملؤه بواسطة وحدة التحكم ، وتكون الصفحة جاهزة لعرضها بواسطة المستخدم.

29. ما الغرض الذي تخدمه المرشحات في AngularJS؟

تُستخدم المرشحات لتنسيق قيمة التعبير وعرضها على المستخدم. في AngularJS ، تتم إضافة عوامل التصفية إلى القوالب والتوجيهات ووحدات التحكم والخدمات. يمكنك أيضًا إنشاء عوامل تصفية مخصصة. باستخدام عوامل التصفية ، يمكنك تنظيم البيانات بطريقة يتم فيها عرض قيمة البيانات فقط عندما تفي بمعيار معين. تتم إضافة عوامل التصفية إلى التعبيرات الزاويّة باستخدام "|" حرف متبوعًا بفلتر

خاتمة

إذن ، إليك 29 من الأسئلة والأجوبة الأكثر شيوعًا حول مقابلة AngularJS والتي ستساعدك على كسر الجمود مع AngularJS.

إذا كنت مهتمًا بمعرفة المزيد حول ، AngularJS ، تطوير المكدس الكامل ، تحقق من دبلوم PG الخاص بـ upGrad & IIIT-B في تطوير البرامج كاملة المكدس المصمم للمهنيين العاملين ويقدم أكثر من 500 ساعة من التدريب الصارم ، وأكثر من 9 مشاريع و المهام ، وحالة خريجي IIIT-B ، ومشاريع التخرج العملية العملية والمساعدة في العمل مع الشركات الكبرى.

تعلم سعيد!