WEBVTT

00:00:01.342 --> 00:00:05.959
עכשיו שאתם מבינים את היסודות של Javascript, אני רוצה ללמד אתכם דרך מגניבה להשתמש ב-Javascript

00:00:05.959 --> 00:00:09.546
משהו שנקרא "תכנות-מונחה-עצמים" (OOP - "object-oriented programming")

00:00:09.546 --> 00:00:12.570
אבל קודם אנחנו צריכים להבין למה זה שימושי

00:00:12.570 --> 00:00:17.668
אז יצרתי תוכנה שתהיה טובה יותר ברגע שנשתמש בתכנות מונחה עצמים

00:00:17.668 --> 00:00:25.138
זו תוכנית די מגניבה מלכתחילה. למעלה, יש לי שני משתנים ששומרים אובייקטים פשוטים (object literal) בתוכם

00:00:25.138 --> 00:00:30.448
object literal זה סוג של אובייקט שכבר למדנו עליו, שאנו יוצרים עם שימוש בסוגריים מסולסלים

00:00:30.448 --> 00:00:34.409
ובתוכם אנו שמים את שמות המאפיינים והערכים שלהם.

00:00:34.409 --> 00:00:39.241
אז יש לנו שני משתנים שהם אובייקטים, וכאן למטה יש את הפונקציה drawWinston

00:00:39.241 --> 00:00:41.129
שמצפה לפרמטר יחיד

00:00:41.129 --> 00:00:47.882
ואז הפונקציה מציירת את הפרמטר שהועבר - היא מציירת תמונה המבוססת על מאפייני ה-X וה-Y של האובייקט

00:00:47.882 --> 00:00:53.107
וכותרת שמבוססת על מאפייני הגיל והכינוי שלו.

00:00:53.107 --> 00:00:58.164
וכאן בסוף למטה, אנחנו קוראים ל-drawWinston על שני האובייקטים, teen ו-adult,

00:00:58.164 --> 00:01:01.012
וזה מה שגורם להדפסות להופיע.

00:01:01.012 --> 00:01:06.366
נחמד. אם נסתכל כאן על האובייקטים,

00:01:06.366 --> 00:01:11.410
שימו לב שהם ממש דומים אחד לשני.

00:01:11.410 --> 00:01:17.842
לשניהם יש את אותם סוגי מאפיינים, ושניהם יכולים להיות מועברים לפונקציה drawWinston

00:01:17.842 --> 00:01:24.072
למעשה, אם תחשבו על זה, הם שניהם מתארים סוג של ווינסטון

00:01:24.072 --> 00:01:28.796
נוכל לחשוב שיש מעין סוג של ווינסטון מופשט בעולם

00:01:28.796 --> 00:01:36.460
ולכל ווינסטון יש את אותו סט של מאפיינים, כמו כינוי וגיל, ומיקום X ו-Y

00:01:36.460 --> 00:01:42.162
מה שעשינו כאן, זה יצרנו שני מופעים של ווינסטון

00:01:42.162 --> 00:01:48.465
כך שכל אחד מתאר ווינסטון ספציפי. אחד מהם הוא ווינסטון מתבגר, והשני הוא ווינסטון בוגר.

00:01:48.465 --> 00:01:54.762
אבל שניהם מאוד דומים, יש להם הרבה מאפיינים דומים.

00:01:54.762 --> 00:02:01.295
אם תחשבו על זה, הרבה דברים בעולם עובדים בצורה כזאת, שיש לנו סוגי מידע מופשטים כמו בני אדם או אנשים

00:02:01.295 --> 00:02:05.958
וכולנו פשוט מופעים ספציפיים של הסוג המופשט, עם המאפיינים הייחודיים שלנו.

00:02:05.958 --> 00:02:14.948
אנחנו יכולים להשתמש בשיטות של תכנות מונחה עצמים ב-Javascript, כך שמשתני ווינסטון האלו

00:02:14.948 --> 00:02:21.834
יהיו ממש מופעים של אובייקט ווינסטון מופשט, כך שהם ידעו שיש להם מאפיינים משותפים.

00:02:21.834 --> 00:02:27.974
כדי לעשות זאת, דבר ראשון עלינו לתאר את הטיפוס המופשט הזה של ווינסטון

00:02:27.974 --> 00:02:30.900
נעשה זאת על ידי כך שניצור משתנה

00:02:30.900 --> 00:02:38.934
נשמור את הטיפוס הזה בתוך משתנה. נרשום: var Winston, עם אות W גדולה - נרצה תמיד להתחיל את שמות טיפוסי האובייקטים שלנו עם אות גדולה -

00:02:38.934 --> 00:02:42.196
ונרשום שזה שווה לפונקציה.

00:02:42.196 --> 00:02:47.030
הפונקציה זו היא פונקציה מיוחדת שנקראת פונקציית בנאי (constructor)

00:02:47.030 --> 00:02:52.042
כי זה מה שהולך להיקרא כל פעם שנרצה ליצור מופע חדש של ווינסטון.

00:02:52.042 --> 00:02:57.860
אז אנחנו רוצים ליצור את teenageWinston, אז נקרא לפונקציה הזו, ואם נרצה ליצור adultWinston, גם אז נקרא לפונקציה הזו.

00:02:57.860 --> 00:03:06.417
זה אומר שהפונקציה הזו צריכה לקבל את הפרמטרים שהיא צריכה לדעת עליהם בשביל ליצור אובייקט ווינסטון שלם

00:03:06.417 --> 00:03:11.324
במקרה הזה, היא צריכה לדעת כינוי, גיל, מיקום X, ומיקום Y.

00:03:11.324 --> 00:03:15.063
אחרי שקיבלנו את הפרמטרים האלו אנחנו צריכים לעשות איתם משהו

00:03:15.063 --> 00:03:21.483
אז אנחנו צריכים לחבר את המידע הזה לאובייקט של ווינסטון.

00:03:21.483 --> 00:03:28.672
אז נשתמש במילה חדשה בשפה - "this". המילה this מתייחסת למופע הנוכחי של האובייקט.

00:03:28.672 --> 00:03:34.921
אז נרשום this.nickname, כלומר מאפיין הכינוי של האובייקט הזה שווה

00:03:34.921 --> 00:03:38.419
למה שמעובר לפונקציית הבנאי, אוקיי?

00:03:38.419 --> 00:03:45.728
ו-this.age שווה לגיל שמועבר, this.x שווה ל-x שמועבר, ו-this.y

00:03:45.728 --> 00:03:48.385
שווה ל-y שמועבר.

00:03:48.385 --> 00:03:57.500
אז עכשיו יש לנו את הטיפוס המופשט שנקרא ווינסטון, ויש לו פונקציית בנאי שאנחנו יכולים להשתמש בה כדי ליצור ווינסטון חדש.

00:03:57.500 --> 00:04:00.327
בואו ננסה להשתמש בה!

00:04:00.327 --> 00:04:05.245
ניצור את winstonTeen שוב, אבל הפעם נרשום winstonTeen שווה

00:04:05.245 --> 00:04:10.376
ובמקום סוגריים מסולסלים נרשום new Winston

00:04:10.376 --> 00:04:13.950
מה שאומר שאנחנו מנסים ליצור מופע חדש של ווינסטון

00:04:13.950 --> 00:04:22.305
ואז נעביר את המידע שצריך - "Winsteen", 15, 20, 50, אוקיי?

00:04:22.305 --> 00:04:27.502
ועכשיו נוכל למחוק את הקוד הישן כי אנחנו לא צריכים אותו יותר.

00:04:27.502 --> 00:04:31.082
בסדר? זה יצר ווינסטון חדש בשם Winsteen.

00:04:31.082 --> 00:04:35.722
ונוכל לרשום גם winstonAdult = new Winston

00:04:35.722 --> 00:04:39.960
והכינוי שלו יהיה "Mr. Winst-a-lot"

00:04:39.960 --> 00:04:47.410
והוא בן 30, והמיקום שלו הוא 229, 50. בסדר? ואז נוכל למחוק את האובייקט הפשוט

00:04:47.410 --> 00:04:50.812
טה-דה! הקוד שלנו עדיין עובד.

00:04:50.812 --> 00:04:58.094
מה שעשינו כאן זה לומר שיש סוג של אובייקט מופשט, סוג של מידע, שהוא Winston

00:04:58.094 --> 00:05:05.272
ואנחנו יכולים ליצור מופעים חדשים של ווינסטון שיש להם מאפיינים ייחודיים להם

00:05:05.272 --> 00:05:08.799
אנחנו זוכרים את ערכי המאפיינים האלו בתוכם

00:05:08.799 --> 00:05:14.379
ולזכור זה ממש חשוב. כאן בפנים, יש לנו את this.nickname, this.age

00:05:14.379 --> 00:05:20.212
אם בטעות לא היינו שומרים משהו ב-this.age, עכשיו זה אומר שזה "undefined" (לא מוגדר)

00:05:20.212 --> 00:05:23.103
זה כי כאן למטה, הפונקציה drawWinston

00:05:23.103 --> 00:05:28.162
מצפה שלאובייקט שמועבר אליה יהיה מאפיין age

00:05:28.162 --> 00:05:30.894
ואם לא היינו יוצרים את this.age

00:05:30.894 --> 00:05:34.029
אז אין לו מאפיין גיל, נכון? העברנו את הגיל לפונקציית הבנאי

00:05:34.029 --> 00:05:39.363
אבל אז לא עשינו איתו כלום, אנחנו צריכים לחבר את הגיל לאובייקט באמצעות המילה this.

00:05:39.363 --> 00:05:41.444
נחזיר את השורה הזאת.

00:05:41.444 --> 00:05:46.361
אולי אתם חושבים, יופי, הקוד עכשיו עובד, וכתבת קוד יפה

00:05:46.361 --> 00:05:50.589
אבל, בסופו של דבר כל מה שעשינו זה להשיג את מה שהיה לנו קודם

00:05:50.589 --> 00:05:55.996
אבל הנה הדבר המגניב. כל הWinstonים שלנו עוברים דרך אותה פונקציית בנאי

00:05:55.996 --> 00:06:00.830
אז אם נרצה, אנחנו יכולים לשנות דברים, לשנות משהו לגבי ווינסטון

00:06:00.830 --> 00:06:06.059
כל הווינסטונים, עם שינוי רק פה. אז למשל גיל, אם נרצה לרשום פה "yrs old"

00:06:06.059 --> 00:06:12.804
נוכל פשוט לשים את זה כאן, ועכשיו בכל הווינסטונים שלנו יהיה רשום "15 yrs old" או "30 yrs old", נכון?

00:06:12.804 --> 00:06:17.281
אז לוקחים את החלק שמיוחד בכל אחד מהם, אבל אז יש להם גם דברים משותפים

00:06:17.281 --> 00:06:20.968
וזה דבר ממש מגניב לגבי תכנות מונחה עצמים, הרעיון

00:06:20.968 --> 00:06:26.632
שיש סוגי אובייקטים בעולם, ואפשר ליצור מופעים של האובייקטים האלו

00:06:26.632 --> 00:06:29.925
ושישנם דברים דומים, משותפים לכולם, כמו שלכולם יש את אותם מאפיינים

00:06:29.925 --> 00:06:35.528
וישנם דברים שונים - הערך של המאפיין הזה שונה מהערך של המאפיין הזה אצל המופע השני

00:06:35.528 --> 00:06:40.741
אנחנו יכולים לבצע עם המופעים האלו את אותם התנהגויות, לקרוא לאותם פונקציות איתם

00:06:40.741 --> 00:06:45.829
ולהתשמש בהם בצורה דומה. אז זה כמה מהדברים המגניבים לגבי תכנות מונחה עצמים

00:06:45.829 --> 00:06:48.690
אבל כפי שתראו, יש גם עוד המון אחרים.

00:06:48.690 --> 00:06:51.000
הישארנו עימנו!