קורס React & Redux By Example שיעור כתיב המחלקות

דיונים מקורסים
#1
זה נושא דיון מלווה לערך המקורי ב- https://www.tocode.co.il/bundles/react/lessons/class-notation
#2

לא הבנתי איך המשפט הזה של " או" עובד …אמרת שזה טריק של כמו if מקוצר …מה ההגיון התכנותי של מה שכתוב

#3

למה בפונקצית רנדר לא השתמשת בחץ הרי זה לא יהיה עם bind

#4

לא הבנתי למה מגדירים את ה prop כמשתנים סטטים, הרי הם צריכים להשתנות בכל מופע …הם לא שיכים למחלקה?

#5

לא הבנתי גם מה התפקיד של הprops בconstractor?

#6

  1. ה props אולי משתנים אבל ה propTypes לא. ה propTypes זה רק סוגי ה props שאמורים לקבל. לכל האוביקטים יהיו אותם propTypes (גם אם הערכים של ה props עצמם יהיו שונים).

  2. ה constructor מקבל את ה props כי המחלקה שיורשים ממנה - React.Component צריכה לשמור אותם במשתנה פנימי (this.props). בגלל הירושה המשתנה הזה עובר גם אצלנו במחלקה. ברוב המקרים באמת לא תשתמש בו רק תעביר אותו הלאה.

  3. הפונקציה render עצמה לא צריכה bind. באופן אוטומטי ריאקט מפעיל אותה עם ה this הנכון. הדברים היחידים שצריכים bind הן הפונקציות שנקראות כתוצאה מאירוע (ה Event Handlers)

  4. ה ״או״ - אתה מתכוון ל Ternary בפונקציה render:

  render() {
    return <p>
      Hello: {this.state.hide ? "XXX" : this.props.name} 
      <button onClick={(e) => this.toggle(e)}>
        Click To Toggle</button>
    </p>
  }

?

אופרטור ה״סימן שאלה נקודותיים״ מקבל שלושה דברים והערך שהוא מחזיר תלוי בראשון. בדוגמא שלנו אם this.state.hide הוא אמת הערך של כל הביטוי יהיה מה שאחרי הסימן שאלה (כלומר ה XXX) ואם הוא שקר הערך יהיה this.props.name

#7

לא אני מתכוון למה שעשית בסירטון דקה 4:24

this.hide ||<span>hello</span>

לא הבנתי איך המשפט הזה עובד כמו if

#8

זה משתמש במנגנון שנקרא Short Circuit. הרעיון שהמחשב צריך למצוא את הערך של הביטוי, אז הוא מסתכל על המשתנה שנמצא בצד שמאל: עכשיו אם זה משהו שערכו ״אמת״ אין טעם להמשיך להסתכל על המשך ה Or כי Or של ״אמת״ ועוד משהו זה ממילא אמת, ולכן נגיד שאופרטור || מחזיר את הדבר הראשון שערכו ״אמת״ (אפשר גם לשים כמה כאלה ברצף)

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

<span>hello</span>

ומגלה כמובן שלזה יש ערך ״אמת״ ולכן מחזיר את זה.

סך הכל אם this.hide הוא ״אמת״ יוחזר מהביטוי true ובזה נסיים. אם זה ״שקר״ אז יוחזר הצד הימני של הביטוי שזה הטקסט.