أنواع البيانات الأساسية

بهيك شكل، كل الملفات المُحوَّلة رح تكون بمجلد dest وما رح تختلط مع الـ Source Code.

كيف تحدد نوع متغير

لتحديد النوع (Type) لمتغير، نستخدم علامة : بعد اسم المتغير:

const score: number = 10;

any vs unknown

any

any بيقبل أي نوع، string أو number أو boolean أو array، حرفياً أي شيء:

let age: any = 25;
age = "عشرين"; // ما في error

المشكلة: TypeScript ما رح تخبرك لو كنت تستخدم المتغير بطريقة خاطئة.

let age: any = "عشرين";

if (age > 18) { // ما في error، بس المنطق غلط!
  console.log("كبير");
}

هذا أخطر شيء ممكن تساويه، TypeScript بتصمت وما بتحذرك.

unknown

unknown بيقبل أي نوع كمان، لكنه أأمن من any. TypeScript بتلزمك تتأكد من النوع قبل الاستخدام:

let age: unknown = 25;

if (typeof age === "number") {
  if (age > 18) {
    console.log("كبير");
  }
}

هذا الـ Type Narrowing، التحقق من النوع عن طريق typeof قبل الاستخدام.

الفرق الأساسي:

Primitive Types

الأنواع الأساسية في TypeScript:

const score: number = 10;
const isAdmin: boolean = true;
const firstName: string = "John";
const nothing: undefined = undefined;
const empty: null = null;

هذه الأنواع بتحميك من إنك تحط قيمة غلط بالمتغير:

let count: number = 5;
count = true; // Error: Type 'boolean' is not assignable to type 'number'

void vs never

void

void للـ Functions اللي ما بترجع قيمة:

function printMessage(): void {
  console.log("مرحباً!");
  // ما في return
}

إذا حاولت ترجع قيمة من Function نوعها void:

Type 'string' is not assignable to type 'void'

never

never للـ Functions اللي بترمي Exception ودايماً ما بتكمل تنفيذها:

function throwError(): never {
  throw new Error("صار خطأ!");
}

الفرق:

ملاحظة: الـ Function اللي ما بترجع شيء دايماً بترجع undefined ضمنياً، لذلك never ما تستخدمها إلا إذا كان في throw جوا الدالة.

Arrays

في طريقتين لتحديد نوع Array:

الطريقة الأولى، باستخدام Array<T>:

const numbers: Array<number> = [1, 2, 3, 4];

الطريقة الثانية، باستخدام T[]:

const languages: string[] = ["JavaScript", "TypeScript"];

الطريقة الثانية أبسط وأوضح، وهي المُفضَّلة.

أمثلة:

const flags: boolean[] = [true, false, true];
const anything: any[] = [1, "hello", true];

Objects

لو حطيت نوع object بشكل عام، TypeScript ما رح تساعدك كثير:

const config: object = { theme: "dark", redirect: true };
config.theme; // Error: Property 'theme' does not exist on type 'object'

الصح إنك ترسم شكل الـ Object بالضبط:

const config: { theme: string; redirect: boolean } = {
  theme: "dark",
  redirect: true,
};

هيك TypeScript بتعرف شو Properties الموجودة وبتساعدك عليها. وإذا حاولت تضيف Property غير موجودة بالـ Type:

Object literal may only specify known properties, and 'age' does not exist in type '{ theme: string; redirect: boolean }'

Tuples

Tuple هو Array بحجم ثابت، وكل عنصر له نوع محدد:

const tick: [string, number] = ["task-1", 1];

لو بدك Tuple من ثلاثة عناصر، مثلاً String وNumber وBoolean:

const record: [string, number, boolean] = ["user", 1, true];

كل اللي غطّيناه اليوم يُستخدم بنسبة 80-90% من شغلك اليومي بـ TypeScript. تدرّب عليها كويس لأنه الدرس الجاي رح نطلع لمستوى أعلى.