يعتمد TypeScript على نفس بناء الجملة والدلالات التي يعرفها الملايين من مطوري JavaScript. يتيح TypeScript العمل مع أحدث ميزات JS التي لا تزال ناشئة ، بما في ذلك تلك المتوفرة في ECMAScript 2015 ، وتلك الموجودة حاليًا فقط في شكل جمل. ومن بين هذه الميزات ، على سبيل المثال ، الوظائف والديكورات غير المتزامنة. كل هذا يهدف إلى مساعدة المطور على إنشاء تطبيقات موثوقة وحديثة.
يتم تجميع برنامج TypeScript في كود JavaScript عادي يمكن تشغيله في أي متصفح أو في Node.js. سيتم فهم هذا الرمز بواسطة أي محرك JS يدعم معيار ECMAScript 3 أو أحدث.
تحتوي المادة ، التي ننشر ترجمتها اليوم ، على مناقشة لعشرين سؤالًا قد تسأل شخصًا سيجتاز مقابلة ، مدعياً منصب مبرمج TypeScript.
السؤال رقم 1 (1). ما هو TypeScript ولماذا يستخدمه بدلاً من JavaScript؟
بين قوسين ، بعد رقم السؤال ، يشار إلى تعقيده ، يتم تقييمه على مقياس مكون من خمس نقاط.
TypeScript (TS) عبارة عن مجموعة شاملة من JavaScript (JS) ، من بين الميزات الرئيسية منها إمكانية تعيين نوع ثابت صريح ، ودعم الفئات والواجهات. تتمثل إحدى المزايا الرئيسية لـ TS عبر JS في القدرة على إنشاء بيئة تطوير في بيئة IDE مختلفة تسمح ، في عملية إدخال الرمز ، بتحديد الأخطاء الشائعة. يمكن أن يؤدي استخدام TypeScript في المشاريع الكبيرة إلى زيادة موثوقية البرامج ، والتي يمكن نشرها في نفس الوقت في نفس البيئات التي تعمل فيها تطبيقات JS العادية.
إليك بعض التفاصيل حول TypeScript:
- يدعم TypeScript الإصدارات الحديثة من معايير ECMAScript ، ويتم تجميع الكود المكتوب باستخدامه مع الأخذ بعين الاعتبار إمكانية تنفيذه على الأنظمة الأساسية التي تدعم الإصدارات القديمة من المعايير. وهذا يعني أنه يمكن لمبرمج TS استخدام إمكانات ES2015 والمعايير الأحدث ، مثل الوحدات النمطية ، ووظائف الأسهم ، والفئات ، ومشغل الانتشار ، والتدمير ، وأداء ما يفعله في البيئات الحالية التي لا تدعم هذه المعايير بعد.
- يعد TypeScript إضافة لجافا سكريبت. الرمز المكتوب بلغة JavaScript هو رمز TypeScript صالح.
- يوسع TypeScript JavaScript مع القدرة على تعيين أنواع بشكل ثابت. نظام TS نوع واسع للغاية. وهي تتضمن الواجهات والتعدادات والأنواع الهجينة والأنواع العامة وأنواع الاتحاد وأنواع التقاطع ومعدلات الوصول والمزيد. يؤدي استخدام TypeScript أيضًا إلى تسهيل الأمور قليلاً عن طريق استخدام الاستدلال النوعي.
- يؤدي استخدام TypeScript ، مقارنة بجافا سكريبت ، إلى تحسين عملية التطوير بشكل ملحوظ. والحقيقة أن IDE ، في الوقت الحقيقي ، يتلقى معلومات النوع من مترجم TS.
- عند استخدام الوضع
null الصارم (يتم استخدام علامة المترجم - --strictNullChecks لهذا) ، لا يسمح المحول البرمجي TypeScript بتعيين قيمة null وغير undefined لمتغيرات من هذه الأنواع التي ، في هذا الوضع ، لا يسمح باستخدام هذه القيم. - لاستخدام TypeScript ، تحتاج إلى تنظيم عملية بناء المشروع ، والتي تتضمن مرحلة تجميع كود TS في JavaScript. يمكن للمترجم تضمين خريطة مصدر في ملفات JS التي أنشأها ، أو إنشاء ملفات .map منفصلة. هذا يسمح لك بتعيين نقاط التوقف وفحص قيم المتغيرات أثناء تنفيذ البرنامج ، والعمل مباشرة مع كود TypeScript.
- يعد TypeScript مشروع Microsoft مفتوح المصدر تم إصداره بموجب ترخيص Apache 2. بادئ تطوير TypeScript هو Anders Halesberg. يشارك في إنشاء Turbo Pascal و Delphi و C #.
→
المصدرالسؤال رقم 2 (1). أخبرنا عن الأنواع العامة في TypeScript.
تتيح لك الأنواع المعممة (الأدوية العامة) إنشاء مكونات أو وظائف يمكن أن تعمل مع أنواع مختلفة ، وليس مع أي واحد. فكر في مثال:
class Queue<t> { private data = []; push = (item: T) => this.data.push(item); pop = (): T => this.data.shift(); } const queue = new Queue<number>(); queue.push(0); queue.push("1");
→
المصدرالسؤال رقم 3 (2). هل يدعم TypeScript جميع مبادئ البرمجة الشيئية؟
نعم ، إنها كذلك. هناك أربعة مبادئ أساسية للبرمجة الشيئية:
- التغليف
- الوراثة
- التجريد
- تعدد الأشكال
باستخدام أدوات TypeScript البسيطة والواضح ، يمكنك تنفيذ كل هذه المبادئ.
→
المصدرالسؤال رقم 4 (2). كيف في TypeScript للتحقق من قيم المساواة فارغة وغير محددة؟
لإجراء مثل هذه الفحوصات ، يكفي استخدام البناء التالي:
if (value) { }
يكون التعبير بين قوسين
true إذا لم يكن شيئًا من القائمة التالية:
nullundefinedNaN- سطر فارغ
- 0
false
يدعم TypeScript نفس قواعد تحويل النوع مثل JavaScript.
→
المصدرالسؤال رقم 5 (2). كيفية تطبيق خصائص الفئة التي هي ثوابت في TypeScript؟
في TypeScript ، عند الإعلان عن خصائص الفئة ، لا يمكنك استخدام الكلمة الأساسية
const . عند محاولة استخدام هذه الكلمة الأساسية ، يتم عرض رسالة الخطأ التالية:
A class member cannot have the 'const' keyword . يحتوي TypeScript 2.0 على مُعدِّل
readonly يسمح لك بإنشاء خصائص فئة للقراءة فقط:
class MyClass { readonly myReadonlyProperty = 1; myMethod() { console.log(this.myReadonlyProperty); } } new MyClass().myReadonlyProperty = 5;
→
المصدرالسؤال رقم 6 (2). ما هي ملفات .map في TypeScript؟
الملفات التي تحتوي على خرائط مصدر امتداد ملحق .map ، والتي تحتوي على بيانات حول مراسلات التعليمات البرمجية المكتوبة في TypeScript إلى تعليمات JavaScript البرمجية التي تم إنشاؤها على أساسها. يمكن للعديد من المصححين العمل مع هذا الملف (على سبيل المثال ، Visual Studio وأدوات مطوري Chrome). يسمح هذا ، أثناء التصحيح ، بالعمل مع التعليمات البرمجية المصدر لبرامج TypeScript ، وليس مع مكافئات JS الخاصة بهم.
→
المصدرالسؤال رقم 7 (2). ما هي الحروف والمستوطنون في TypeScript؟
يدعم TypeScript الحروف والمستوطنين ، مما يسمح لك بالتحكم في الوصول إلى أعضاء الكائنات. أنها تعطي المطور السيطرة على قراءة وكتابة خصائص الأشياء.
class foo { private _bar:boolean = false; get bar():boolean { return this._bar; } set bar(theBar:boolean) { this._bar = theBar; } } var myBar = myFoo.bar;
→
المصدرالسؤال رقم 8 (2). هل يمكن استخدام TypeScript في تطوير الخادم ، وإذا كان الأمر كذلك ، فكيف؟
البرامج المكتوبة بـ TypeScript مناسبة ليس فقط لتطوير الواجهة الأمامية ، ولكن أيضًا لإنشاء تطبيقات الخادم. على سبيل المثال ، على TS يمكنك كتابة برامج لمنصة Node.js. هذا يعطي المبرمج أدوات إضافية للتحكم في النوع ويسمح لك باستخدام ميزات أخرى للغة. لإنشاء تطبيقات خادم على TS ، تحتاج فقط إلى إعداد العملية الصحيحة لمعالجة التعليمات البرمجية ، ومدخلاتها هي ملفات TypeScript ، والمخرجات هي ملفات JavaScript مناسبة للتنفيذ في Node.js. من أجل تنظيم مثل هذه البيئة ، يجب عليك أولاً تثبيت برنامج التحويل البرمجي TypeScript:
npm i -g typescript
يتم تعيين معلمات المترجم باستخدام ملف
tsconfig.json ، الذي يحدد ، من بين أمور أخرى ، الغرض من التجميع والمكان الذي يجب وضع ملفات JS الجاهزة فيه. بشكل عام ، هذا الملف مشابه جدًا لملفات تهيئة babel أو webpack:
{ "compilerOptions": { "target": "es5", "module": "commonjs", "declaration": true, "outDir": "build" } }
الآن ، بشرط أن يكون لدى المحول البرمجي شيء ما يجب معالجته ، تحتاج إلى تشغيله:
tsc
وأخيرًا ، مع الأخذ في الاعتبار حقيقة أن ملفات JS المناسبة للتنفيذ في بيئة Node.js موجودة في مجلد
build ، تحتاج إلى تشغيل الأمر التالي في الدليل الجذر للمشروع:
node build/index.js
→ المصدر
السؤال رقم 9 (3). أخبرنا عن المكونات الرئيسية لـ TypeScript.
يحتوي TypeScript على ثلاثة مكونات رئيسية:
- اللغة. هذا ، من وجهة نظر المطورين ، هو أهم جزء من TypeScript. "اللغة" هي بناء الجملة ، الكلمات الرئيسية ، كل ما يسمح لك بكتابة البرامج في TypeScript.
- المترجم يحتوي TypeScript على مترجم مفتوح المصدر ، وهو متعدد الأنظمة ، ومواصفات مفتوحة ، وهو مكتوب بـ TypeScript. يقوم المترجم بتحويل كود TypeScript إلى كود JavaScript. بالإضافة إلى ذلك ، إذا كان هناك خطأ ما في البرنامج ، فإنه يعرض رسائل خطأ. يسمح لك بدمج عدة ملفات TypeScript في ملف JS لمخرج واحد ويمكنه إنشاء خرائط التعليمات البرمجية.
- أدوات مساعدة. تم تصميم أدوات مساعد TypeScript لتسهيل عملية التطوير باستخدامها في IDEs المختلفة. من بينها Visual Studio ، VS Code ، Sublime ، أدوات مختلفة لإطلاق TS-code بسرعة ، وغيرها.
→
المصدرالسؤال رقم 10 (3). هل هناك أي أخطاء في كود TypeScript الذي قدمته؟ اشرح إجابتك.
هنا مقتطف الرمز:
class Point { x: number; y: number; } interface Point3d extends Point { z: number; } let point3d: Point3d = {x: 1, y: 2, z: 3};
لا توجد أخطاء في هذا الرمز. يقوم تعريف الفئة بإنشاء كيانين: هذا هو نوع البيانات المستخدم في إنشاء مثيل للفئة ووظيفة المُنشئ. نظرًا لأن الفئات تنشئ أنواع بيانات ، يمكنك استخدامها حيث يمكنك استخدام الواجهات.
→
المصدر
أحب هذا الفيلم حقًا)السؤال رقم 11 (3). أخبرنا عن استخدام أدوات تزيين العقارات في TypeScript.
يمكن استخدام الديكورات لتغيير سلوك الطبقات ، ويمكنك الاستفادة أكثر منها عند استخدامها مع أي إطار عمل. على سبيل المثال ، إذا كان إطار العمل الخاص بك يحتوي على طرق يكون الوصول إليها محدودًا (على سبيل المثال ، فهي مخصصة فقط للمسؤول) ، فسيكون من السهل كتابة مصمم لطريقة
@admin ، مما سيمنع المستخدمين غير المسؤولين من الوصول إلى الأساليب المقابلة. يمكنك إنشاء مصمم
@owner الذي يسمح لك بتعديل كائن لمالكه فقط. إليك ما قد يبدو عليه استخدام الديكور:
class CRUD { get() { } post() { } @admin delete() { } @owner put() { } }
→
المصدرالسؤال رقم 12 (3). هل يمكن لـ TypeScript استخدام وظائف مكتوبة بقوة كمعلمات؟
خذ بعين الاعتبار المثال التالي:
class Foo { save(callback: Function) : void { // var result : number = 42; // // - , number? callback(result); } } var foo = new Foo(); var callback = (result: string) : void => { alert(result); } foo.save(callback);
هل من الممكن تنظيم العمل مع رد اتصال مكتوب في طريقة
save ؟ أعد كتابة الكود لتوضيح ذلك.
في TypeScript ، يمكنك الإعلان عن نوع رد الاتصال ، ثم إعادة كتابة الرمز:
type NumberCallback = (n: number) => any; class Foo { // save(callback: NumberCallback): void { console.log(1) callback(42); } } var numCallback: NumberCallback = (result: number) : void => { console.log("numCallback: ", result.toString()); } var foo = new Foo(); foo.save(numCallback)
→
المصدرالسؤال رقم 13 (3). كيفية جعل الفئات المعلنة في وحدة نمطية يمكن الوصول إليها خارج الوحدة؟
الفصول المعلنة في وحدة متاحة داخل هذه الوحدة. في الخارج ، لا يمكن الحصول عليها.
module Vehicle { class Car { constructor ( public make: string, public model: string) { } } var audiCar = new Car("Audi", "Q7"); }
في الكود أعلاه ، سيحدث خطأ عند محاولة تهيئة متغير
fordCar . لجعل فئة معلنة في وحدة نمطية يمكن الوصول إليها خارج هذه الوحدة ، تحتاج إلى استخدام الكلمة الأساسية
export :
module Vehicle { export class Car { constructor ( public make: string, public model: string) { } } var audiCar = new Car("Audi", "Q7"); }
→
المصدرالسؤال رقم 14 (3). هل يدعم TypeScript وظيفة التحميل الزائد؟
يدعم TypeScript التحميل الزائد للوظائف ، ولكن تنفيذ هذه الآلية يختلف عما يمكن رؤيته باللغات الأخرى الموجهة للكائنات. وهم في TS يقومون بإنشاء وظيفة واحدة فقط وعدد معين من الإعلانات. عندما يتم تجميع هذه التعليمات البرمجية في JavaScript ، تظهر وظيفة واحدة محددة فقط. تعمل هذه الآلية لأنه يمكن استدعاء وظائف JS عن طريق تمريرها بعدد مختلف من المعلمات.
class Foo { myMethod(a: string); myMethod(a: number); myMethod(a: number, b: string); myMethod(a: any, b?: string) { alert(a.toString()); } }
→
المصدرالسؤال رقم 15 (4). ما هو الخطأ في الكود المقدم لك؟
إليك الرمز المعني:
interface Fetcher { getObject(done: (data: any, elapsedTime?: number) => void): void; }
من المستحسن استخدام المعلمات الاختيارية في عمليات الاسترجاعات فقط إذا كنت تفهم بدقة عواقب مثل هذه الخطوة. هذا الرمز له معنى محدد للغاية: يمكن استدعاء الاستدعاء
done باستخدام وسيطات 1 أو 2. ربما يقصد مؤلف الشفرة أن يخبرنا أن رد الاتصال قد لا ينتبه إلى معلمة الوقت
elapsedTime ، ولكن لتحقيق ذلك ، يمكنك دائمًا إنشاء رد اتصال يتطلب حججًا أقل.
→
المصدرالسؤال رقم 16 (4). كيفية تحميل منشئ الفئة في TypeScript؟
يسمح لك TypeScript بالإعلان عن العديد من متغيرات الطرق ، ولكن لا يمكن أن يكون هناك سوى تطبيق واحد ، ويجب أن يحتوي هذا التطبيق على توقيع متوافق مع جميع متغيرات الطرق المحملة. لزيادة التحميل على مُنشئ الصف ، يمكنك استخدام عدة طرق:
- يمكنك استخدام المعلمة الاختيارية:
class Box { public x: number; public y: number; public height: number; public width: number; constructor(); constructor(obj: IBox); constructor(obj?: any) { this.x = obj && obj.x || 0 this.y = obj && obj.y || 0 this.height = obj && obj.height || 0 this.width = obj && obj.width || 0; } }
- يمكنك استخدام الإعدادات الافتراضية:
class Box { public x: number; public y: number; public height: number; public width: number; constructor(obj : IBox = {x:0,y:0, height:0, width:0}) { this.x = obj.x; this.y = obj.y; this.height = obj.height; this.width = obj.width; } }
- يمكنك استخدام أحمال زائدة إضافية كوسائل مصنع ثابتة:
class Person { static fromData(data: PersonData) { let { first, last, birthday, gender = 'M' } = data return new this( `${last}, ${first}`, calculateAge(birthday), gender ) } constructor( public fullName: string, public age: number, public gender: 'M' | 'F' ) {} } interface PersonData { first: string last: string birthday: string gender?: 'M' | 'F' } let personA = new Person('Doe, John', 31, 'M') let personB = Person.fromData({ first: 'John', last: 'Doe', birthday: '10-09-1986' })
- يمكنك استخدام نوع الاتحاد:
class foo { private _name: any; constructor(name: string | number) { this._name = name; } } var f1 = new foo("bar"); var f2 = new foo(1);
→
المصدرالسؤال رقم 17 (4). ما هي الاختلافات بين الكلمات الرئيسية للواجهة والكتابة في TypeScript؟
في ما يلي أمثلة على استخدام هذه الكلمات الرئيسية:
interface X { a: number b: string } type X = { a: number b: string };
على عكس إعلان الواجهة ، الذي يمثل دائمًا نوعًا مسمىًا لكائن ، فإن استخدام الكلمة الأساسية
type يسمح لك بتحديد اسم مستعار لأي نوع من الأنواع ، بما في ذلك الأنواع البدائية وأنواع الاتحاد وأنواع التقاطع.
عند استخدام الكلمة الأساسية من
type بدلاً من الكلمة الأساسية
interface ، يتم فقد الاحتمالات التالية:
- يمكن استخدام الواجهة في تعبير
extends أو implements ، ولكن الاسم المستعار لنوع الكائن الحرفي لا يمكن. - يمكن أن تحتوي الواجهة على العديد من الإعلانات المدمجة ، وعند استخدام الكلمة الأساسية من
type لا تتوفر هذه الميزة.
→
المصدرالسؤال رقم 18 (5). أخبرنا عن الوقت الذي يستخدم فيه TypeScript الكلمة الأساسية المعلنة.
يتم استخدام الكلمة الأساسية
declare في TypeScript للإعلان عن المتغيرات ، وقد يكون مصدرها ملفًا ليس ملف TypeScript.
على سبيل المثال ، افترض أن لدينا مكتبة تسمى
myLibrary . لا يحتوي على ملف بإعلانات نوع TypeScript ، ولديه فقط مساحة اسم
myLibrary في مساحة الاسم العامة. إذا كنت ترغب في استخدام هذه المكتبة في كود TS الخاص بك ، يمكنك استخدام البناء التالي:
declare var myLibrary;
سيعين
myLibrary متغير
myLibrary إلى
any . المشكلة هنا هي أنه في وقت التطوير لن يكون لديك أي تلميحات ذكية لهذه المكتبة ، على الرغم من أنه يمكنك استخدامها في التعليمات البرمجية الخاصة بك. في هذه الحالة ، يمكنك استخدام نهج آخر يؤدي إلى نفس النتيجة. نحن نتحدث عن استخدام متغير من
any نوع:
var myLibrary: any;
في كلتا الحالتين ، عند تجميع كود TS في JavaScript ، تكون النتيجة هي نفسها ، ولكن خيار
declare يمكن قراءته بشكل أفضل. يؤدي استخدام هذه الكلمة الرئيسية إلى إنشاء ما يسمى التصريح الخارجي للمتغير (التصريح المحيط).
السؤال رقم 19 (5). ما هي تعريفات المتغيرات الخارجية في TypeScript ومتى يجب استخدامها؟
التعريف الخارجي لمتغير (تعريف محيطي) هو آلية تتيح لمحول TypeScript معرفة أن بعض التعليمات البرمجية المصدر موجودة في مكان ما خارج الملف الحالي. تساعد الإعلانات الخارجية على دمج مكتبات JavaScript من جهة خارجية في برامج TS.
تصنع هذه التصريحات في ملف تعريف النوع بالملحق .d.ts. تعلن المتغيرات أو الوحدات الخارجية على النحو التالي:
declare module Module_Name { }
يجب تضمين الملفات التي تحتوي على رمز خارجي في ملف TS باستخدامها ، كما يلي:
→
المصدرالسؤال رقم 20 (5). هل يمكنني إنشاء تصميمات إعلانات TypeScript تلقائيًا من مكتبات JS؟
لا تحتوي JavaScript دائمًا على معلومات كافية تسمح لـ TypeScript باستنتاج الأنواع تلقائيًا. لذلك ، يكاد يكون من المستحيل إنشاء تعريفات النوع تلقائيًا استنادًا إلى JavaScript. ومع ذلك ، يمكنك محاولة القيام بذلك باستخدام الأدوات التالية:
- Microsoft / dts-gen هي الأداة الرسمية التي تستخدمها Microsoft كنقطة بداية لإنشاء تعريفات النوع.
- dtsmake هي أداة تطوير واعدة لإنشاء إعلانات النوع تلقائيًا استنادًا إلى ملفات JS. يعتمد ذلك على نظام تحليل رمز Tern ، الذي يستخدمه بعض المحررين لتطبيق آلية الإكمال التلقائي عند إدخال كود JS.
→
المصدرالملخص
نأمل أن تساعدك مناقشة الأسئلة في هذه المادة على التعرف على TypeScript بشكل أفضل ، وربما الانتباه إلى ما لم تنتبه إليه من قبل ، وإذا كنت تستعد لمقابلة ، فستزيد فرصك في اجتيازها بنجاح.
أعزائي القراء! ما الأسئلة التي قد تطرحها على المحاور الذي يتقدم لوظيفة تتطلب معرفة TypeScript؟
- وما هو الخصم لهذا الرمز الترويجي ؟!
- يبدو 7٪. سوف أتحقق مما إذا كنت تريد ...
"نعم ، تحقق." في رأيي ، الخصم مبالغ فيه قليلاً!
...
- عذرا ، لقد كنت مخطئا قليلا بشأن الخصم. 10٪ على جميع الخوادم الافتراضية.