0Pricing
Angular Academy · درس

إنشاء الإشارات وقراءتها

صرّحوا عن إشارات قابلة للكتابة واقرؤوا قيمها

إنشاء الإشارات وقراءتها درس مجاني في Angular Academy على CoddyKit. هذا هو الدرس 2 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Angular Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Angular Academy 4 دروس في المجموع.

إنشاء إشارة

تنشئون إشارة قابلة للكتابة باستخدام الدالة المُنشئة signal()، مع تمرير القيمة الأولية.

import { signal } from '@angular/core';

const c = signal(0); // initial value is 0

القيمة الأولية تحدد النوع

يستنتج TypeScript نوع الإشارة من القيمة الأولية. فـ signal(0) هي WritableSignal<number>.

const name = signal('Alice'); // WritableSignal<string>
const flag = signal(false);    // WritableSignal<boolean>

قراءة إشارة

استدعوا الإشارة لقراءة قيمتها الحالية. يعيد ذلك القيمة المخزنة ويسجّل تبعية إذا كنتم داخل سياق تفاعلي.

const c = signal(0);
const current = c(); // current === 0

القراءة عدة مرات

يمكنكم قراءة الإشارة كلما شئتم. ويعيد كل استدعاء أحدث قيمة في لحظة الاستدعاء.

const c = signal(10);
console.log(c()); // 10
console.log(c()); // 10

الكتابة بالنوع صراحةً

يمكنكم تحديد نوع صريح عندما لا تلتقطه القيمة الأولية بالكامل، مثل قيمة يمكن أن تكون أيضًا null.

const user = signal<string | null>(null);
console.log(user()); // null

إشارات الكائنات

يمكن للإشارة الاحتفاظ بأي قيمة، بما في ذلك الكائنات والمصفوفات.

const point = signal({ x: 0, y: 0 });
console.log(point().x); // 0

إشارات المصفوفات

تعمل المصفوفات بالطريقة نفسها. وتعید القراءة مرجع المصفوفة الحالي.

const items = signal<string[]>(['a', 'b']);
console.log(items().length); // 2

الإشارات كحقول للفئة

في المكوّنات والخدمات، عرّفوا الإشارات كحقول. وتتم تهيئتها مرة واحدة عند إنشاء النسخة.

import { Injectable, signal } from '@angular/core';

@Injectable({ providedIn: 'root' })
export class CounterStore {
  count = signal(0);
}

قراءة الإشارة في فئة المكوّن

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

export class CounterStore {
  count = signal(0);
  isZero(): boolean {
    return this.count() === 0;
  }
}

الوصول للقراءة فقط

إذا أردتم إتاحة الإشارة دون السماح للمستهلكين بتغييرها، فيمكنكم إتاحتها عبر الأسلوب asReadonly().

const internal = signal(0);
export const value = internal.asReadonly();
// value() works; value.set is not available

اصطلاحات التسمية

من الاصطلاحات الشائعة تسمية الإشارة وفق القيمة التي تحتفظ بها، مثل count وitems، لأن قراءتها تبدو كأنها أداة وصول عادية: count().

اختبار سريع: إنشاء الإشارات

اختبروا مدى إلمامكم بإنشاء الإشارات وقراءتها.

مراجعة: الإنشاء والقراءة

أصبحتم تعرفون الآن كيفية إنشاء إشارة قابلة للكتابة باستخدام signal(initialValue)، وكيف يستنتج TypeScript نوعها، وكيف تقرأونها باستدعائها. كما رأيتم asReadonly() لإتاحة الوصول للقراءة فقط. التالي: تحديث قيم الإشارات.

الأسئلة الشائعة

هل درس «إنشاء الإشارات وقراءتها» مجاني؟

نعم — نص درس «إنشاء الإشارات وقراءتها» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Angular Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Angular Academy 4 دروس في المجموع.

ماذا ستتعلم في «إنشاء الإشارات وقراءتها»؟

صرّحوا عن إشارات قابلة للكتابة واقرؤوا قيمها تتمرن على Angular Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Angular Academy؟

لا تُشترط خبرة سابقة. Angular Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 2 من أصل 4.

كم من الوقت يستغرق درس «إنشاء الإشارات وقراءتها»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Angular Academy هذا؟

نعم. كل درس في Angular Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. ما الإشارات؟
  2. إنشاء الإشارات وقراءتها
  3. تحديث الإشارات باستخدام set وupdate
  4. الإشارات في القوالب
← العودة إلى Angular Academy