PracticU

רידקס - הפעלה ראשונה של AppState - ריאקט

בלי כתוביותעם כתוביות
PracticU › קורס ריאקט - React › רידקס - הפעלה ראשונה של AppState - ריאקט
מילון מושגים:
אובייקט - יחידה בתכנות מונחה עצמים שמאגדת נתונים (תכונות) ופעולות (מתודות). נוצר בדרך כלל ממחלקה המשמשת כתבנית.
סטייט - המידע על מצבו הנוכחי של רכיב או אפליקציה בזמן נתון, שמשתנה ומשפיע על מה שמוצג.
פרמטר - ערך שמועבר לפונקציה או לפקודה כקלט, ומשפיע על אופן פעולתן ועל התוצאה שהן מחזירות.
פונקציה - קטע קוד בעל שם שמבצע משימה מוגדרת, מקבל ערכי קלט (פרמטרים) ויכול להחזיר תוצאה. מאפשרת לארגן קוד ולהשתמש בו שוב.
TypeScript - שפת תכנות המרחיבה את JavaScript בהוספת טיפוסים, ומתקמפלת ל-JavaScript רגיל.
מערך - מבנה נתונים שמאחסן אוסף ערכים מאותו סוג ברצף, שאפשר לגשת אליהם לפי מספר מיקום (אינדקס).

רידקס - הפעלה ראשונה של AppState - ריאקט
מה קורה בפעם הראשונה שקוראים ל-dispatch, כשל-Store עדיין אין אובייקט state? ההרצאה קצרה ומראה איך ה-reducer מתחיל את ה-state בעצמו.
איך זה עובד
1. הבעיה: בקריאה הראשונה ל-dispatch ה-Store שולח ל-reducer של המוצרים את ה-state ואת ה-action, אבל עדיין אין state.
2. מה נשלח: ב-Store ריק הפרמטר הראשון הוא undefined.
3. הפתרון: נותנים לפרמטר ה-state של הפונקציה ערך ברירת מחדל, אובייקט חדש מ-new ProductsState().
4. בפעמים הבאות: אם ל-Store כבר יש state, הוא נשלח ל-reducer ו-TypeScript מתעלם מערך ברירת המחדל.
5. טיפוס: כשיש ערך ברירת מחדל לא חייבים לציין את הסוג, כי הוא נגזר ממנו.
אחרי ההרצאה ה-reducer מטפל גם בהפעלה הראשונה וגם בכל ההפעלות הבאות, בלי קוד אתחול נוסף מחוץ לקובץ.
השיעור הבא בקורס: רידקס - הוספת AppState נוסף - קורס React

פרקי ההרצאה: רידקס - הפעלה ראשונה של AppState - ריאקט

  1. 00:00

    הקריאה הראשונה לסטור

  2. 00:55

    העברת undefined בפעם הראשונה

  3. 01:35

    הגדרת ערך ברירת מחדל ל-State

תמלול ההרצאה: רידקס - הפעלה ראשונה של AppState - ריאקט

הטקסט המלא של הדקות הראשונות בהרצאה «רידקס - הפעלה ראשונה של AppState - ריאקט» בקורס הווידאו של PracticU – כתוביות בעברית עם זמן התחלה לכל פסקה. כך תוכלו לקרוא ולחפש את הנושאים לפני שמתחילים ללמוד.

  1. 00:02

    הדבר הבא שכדאי לנו לבצע ושחשוב לנו להבין זה מה בעצם מתרחש בפעם הראשונה שאנחנו קוראים לסטור. כאשר אנחנו באים ועושים דיספאץ' בפעם הראשונה הראשונה, אז אנחנו אומרים לסטור, אוקיי, הנה אקשן, בואי תבצעי לי את הפעולה.

  2. 00:20

    זאת אומרת, בואי תשלחי לפרודקט רדיוסר את האובייקט אפסטייט ואת האקשן, אבל בפעם הראשונה עדיין אין לסטור אובייקט אפסטייט.

  3. 00:32

    אנחנו צריכים להתחיל אותו ליצור אובייקט כזה רק עבור הפעם הראשונה. אנחנו יכולים לבצע את הדבר הזה מחוץ לקובץ הזה, אבל אני מצאתי שזה יותר נוח פשוט לומר לקובץ הזה איכשהו, תכף נראה איך, שאם זאת הפעם הראשונה, נא לייצר אובייקט upstate חדש.

  4. 00:53

    אז איך עושים את זה? כל מה שאנחנו צריכים להבין זה שבפעם הראשונה שאנחנו אומרים לסטור דיספאץ' אין לה אובייקט אפ סטייט ראשוני, אז היא שולחת לפרודקט רדיוסר undefined בפרמטר הראשון.

  5. 01:11

    אם פונקציה מקבלת undefined, אפילו בג'אווה סקריפט או בטייפ סקריפט, אז היא יכולה להכניס למשתנה איזשהו default value. אם יש לה value שהיא קיבלה, אז היא תתעלם מה-default value.

  6. 01:27

    כל מה שאנחנו יכולים לעשות זה להגדיר לקורנט סטייט דיפולט וליו שהינו New Products State הנה האובייקט החדש אם ה-Store קוראת ל-Reducer ואין לה State להעביר אז היא מעבירה לכאן Undefined ואז טייפ סקריפט תיקח את האובייקט הזה והנה יש לנו אובייקט חדש אם ל-Store יש כבר אובייקט סטייט אז היא תשלח

  7. 01:57

    אותו וטייפ סקריפט יתעלם מהמשתנה הזה,

לקורס המלא: קורס ריאקט אונליין

ההרצאה הקודמת: רידקס - יצירת Reducer - ריאקט

ההרצאה הבאה: רידקס - הוספת AppState נוסף - קורס React

הרצאות קשורות מקורסים אחרים

  • תוכנית ראשונה באנדרואיד
  • אפליקציה ראשונה ב-Node.js
  • הרצה ראשונה של הסקריפט
  • הרצה ראשונה של Container

קורסים נוספים במסלול

  • קורס יסודות HTML - בניית אתר אינטרנט פשוט
  • קורס CSS 3 - בדגש על Flex & Grid
  • קורס Javascript כולל JQuery
  • קורס ג'אווה סקריפט מעשי - JavaScript
  • קורס TypeScript
  • קורס NodeJS