1
00:00:00,000 --> 00:00:03,840
>> [השמעת מוסיקה]

2
00:00:03,840 --> 00:00:05,770

3
00:00:05,770 --> 00:00:08,690
>> דאג LLOYD: אז עכשיו אנחנו ישנים
יתרונות בתכנות האינטרנט, נכון?

4
00:00:08,690 --> 00:00:12,140
ואנחנו כבר כיסינו כמה
שפות בקטעי וידאו אישיים.

5
00:00:12,140 --> 00:00:14,690
ועכשיו בואו נעשה עוד אחד, JavaScript.

6
00:00:14,690 --> 00:00:17,370
>> אתחיל בחדשות טובות, JavaScript
הוא תכנות מודרני

7
00:00:17,370 --> 00:00:21,410
שפה כמו PHP ש
תחביר נגזר מC,

8
00:00:21,410 --> 00:00:22,830
אז זה מקום טוב להתחיל.

9
00:00:22,830 --> 00:00:25,880
זה בערך ישן כמו PHP, כמו גם,
לאחר כ 20 שנים.

10
00:00:25,880 --> 00:00:28,600
הוא הומצא סביב
באותו הזמן כמו PHP.

11
00:00:28,600 --> 00:00:32,240
וJavaScript היא בעצם די
יסוד לחווית המשתמש

12
00:00:32,240 --> 00:00:32,740
של האינטרנט.

13
00:00:32,740 --> 00:00:34,448
למעשה, יש
שלוש שפות שאני

14
00:00:34,448 --> 00:00:38,480
הייתי אומר סוג של איפור
חוויית משתמש של אינטראקציה

15
00:00:38,480 --> 00:00:42,650
עם אתר האינטרנט, HTML,
CSS, ו- JavaScript.

16
00:00:42,650 --> 00:00:46,030
ואז עכשיו בואו נדבר
קצת על JavaScript.

17
00:00:46,030 --> 00:00:50,301
>> החדשות הרעות, אם כי, עם JavaScript הוא
כי זה קובע הרבה כללים לעצמו,

18
00:00:50,301 --> 00:00:51,300
ואז זה שובר אותם.

19
00:00:51,300 --> 00:00:54,010
וJavaScript באמת יכול להיות
סוג של מאתגר ללמוד,

20
00:00:54,010 --> 00:00:57,000
כי זה לא כמו C ו
PHP, שמאוד מובנים

21
00:00:57,000 --> 00:01:00,270
ויש כללים מאוד נוקשים
לאיך דברים יכולים לעבוד.

22
00:01:00,270 --> 00:01:03,690
JavaScript יש סוג
קיבל כל כך גמיש

23
00:01:03,690 --> 00:01:06,650
שאולי דברים לא הולכים ל
לעבוד בדרך שאנחנו מצפים מהם,

24
00:01:06,650 --> 00:01:09,830
ואולי אנחנו באמת לא יכולים ללמוד
שפת תכנות הראשונה שלנו

25
00:01:09,830 --> 00:01:10,769
כJavaScript.

26
00:01:10,769 --> 00:01:12,810
אז אולי בגלל זה לא
להגדיר את עצמו כל כללים,

27
00:01:12,810 --> 00:01:15,754
וזה לא ממש
לאכוף הרגלי קידוד טובים.

28
00:01:15,754 --> 00:01:18,170
אבל עכשיו אנחנו כבר בתקווה שפותחו
כמה הרגלים טובים קידוד,

29
00:01:18,170 --> 00:01:21,470
וכדי שנוכל להתחיל לפשיטה
לJavaScript קצת.

30
00:01:21,470 --> 00:01:25,750
>> כדי לכתוב JavaScript, דומה לפתיחה
עד קובץ C עם סיומת C נקודה

31
00:01:25,750 --> 00:01:29,770
או קובץ PHP עם סיומת דוט PHP,
כל מה שאנחנו צריכים לעשות הוא לפתוח את קובץ

32
00:01:29,770 --> 00:01:31,764
עם סיומת קובץ JS הנקודה.

33
00:01:31,764 --> 00:01:34,430
אנחנו לא צריכים שום מיוחדים
מפרידים כמו שעשינו ב- PHP.

34
00:01:34,430 --> 00:01:36,750
סוג זה של זווית
PHP סימן שאלת הסוגר

35
00:01:36,750 --> 00:01:40,300
כי אנחנו רגילים לכך, בדרך
אנחנו אומרים לנו שהדפדפן מה שיש לנו הוא

36
00:01:40,300 --> 00:01:43,502
JavaScript היא על ידי הכללה
זה בתג HTML,

37
00:01:43,502 --> 00:01:46,210
ואנו רואים קצת על
איך לעשות את זה ברגע.

38
00:01:46,210 --> 00:01:48,210
>> הדבר האחר שגורם ל
JavaScript שונה,

39
00:01:48,210 --> 00:01:50,580
אם כי, הוא שהוא פועל בצד הלקוח.

40
00:01:50,580 --> 00:01:53,430
אז זוכר עם PHP ש
אנחנו אף פעם לא באמת יכולים לראות

41
00:01:53,430 --> 00:01:57,041
PHP שהדגיש באתר.

42
00:01:57,041 --> 00:01:59,040
אם אי פעם ראינו ב
מקור של דף, אנחנו רק הייתם

43
00:01:59,040 --> 00:02:02,830
לראות HTML שהיה
נוצר על ידי PHP ש.

44
00:02:02,830 --> 00:02:04,900
אבל JavaScript פועל בצד הלקוח.

45
00:02:04,900 --> 00:02:06,710
JavaScript שלך פועל במחשב שלך.

46
00:02:06,710 --> 00:02:09,050
וזה למה שאתה יכול לעשות
דברים כמו להוסיף חוסמי.

47
00:02:09,050 --> 00:02:09,550
יָמִינָה?

48
00:02:09,550 --> 00:02:12,704
חסימת מודעה נעשתה בדרך כלל על ידי
להרוג את כל JavaScript

49
00:02:12,704 --> 00:02:14,370
הפועל באתר מסוים.

50
00:02:14,370 --> 00:02:19,000
ובגלל זה היה צריך
לרוץ בצד הלקוח מכונה שלך,

51
00:02:19,000 --> 00:02:21,910
רק אתה יכול לעצור את
JavaScript להפעלה לחלוטין.

52
00:02:21,910 --> 00:02:27,030
זה גם אומר שכאשר אתה משתמש ב
אתר הכולל JavaScript,

53
00:02:27,030 --> 00:02:32,450
אתה צריך לשלוח את מקור JavaScript
קוד כחלק מתגובת http

54
00:02:32,450 --> 00:02:34,159
ללקוח כאשר הם מבקשים את זה.

55
00:02:34,159 --> 00:02:35,950
ואז אתה אולי לא
רוצה להשתמש ב- JavaScript

56
00:02:35,950 --> 00:02:38,395
לעשות דברים באמת רגישים
כמו מידע שעובר

57
00:02:38,395 --> 00:02:41,020
על סיסמאות של המשתמשים לגבות ו
שוב, בגלל שהם למעשה

58
00:02:41,020 --> 00:02:45,610
הולך לקבל את כל קוד המקור,
לא רק html שנוצר,

59
00:02:45,610 --> 00:02:49,030
כמו שהיה קורה עם למשל PHP.

60
00:02:49,030 --> 00:02:51,620
>> אז איך אנחנו כוללים JavaScript
ב- HTML שלנו להתחיל עם?

61
00:02:51,620 --> 00:02:54,520
ובכן, דומה ל- CSS, למעשה,
הוא סוג של איך אנחנו עושים את זה כאן.

62
00:02:54,520 --> 00:02:56,190
עם CSS יש לנו תגי סגנון.

63
00:02:56,190 --> 00:03:00,760
ובתוך תגי סגנון אלה,
אנו יכולים להגדיר גיליון סגנונות CSS.

64
00:03:00,760 --> 00:03:03,450
באופן דומה עם JavaScript
אנחנו יכולים לפתוח את תגי תסריט,

65
00:03:03,450 --> 00:03:06,660
תג html אחר שעשינו לא
לדבר על בוידאו HTML שלנו,

66
00:03:06,660 --> 00:03:09,720
ולכתוב JavaScript ב
בין תגי סקריפט אלה.

67
00:03:09,720 --> 00:03:13,960
גם אם כי, כמו CSS, אנחנו
יכול לקשר במחוץ קבצי CSS

68
00:03:13,960 --> 00:03:15,900
ולמשוך אותם לתוך התכנית שלנו ככה.

69
00:03:15,900 --> 00:03:18,280
עם CSS אנחנו גם יכולים,
תסלח לי, עם JavaScript

70
00:03:18,280 --> 00:03:23,240
אנחנו יכולים גם לציין את המקור
תכונה של תג סקריפט

71
00:03:23,240 --> 00:03:25,720
לקשר בJavaScript
בנפרד, כדי שלא

72
00:03:25,720 --> 00:03:27,680
צריך לכתוב את זה ב
בין תגי תסריט, אנחנו

73
00:03:27,680 --> 00:03:29,600
יכול לקשר אותו בשימוש ב
שתג התסריט גם כן.

74
00:03:29,600 --> 00:03:33,230
ובדיוק כמו עם המקרה עם CSS בי
מומלץ שזה היה כנראה

75
00:03:33,230 --> 00:03:36,090
האינטרס שלך לכתוב
CSS שלך בקובץ נפרד במקרה

76
00:03:36,090 --> 00:03:38,500
אתה צריך לשנות את זה,
באופן דומה אנו ממליצים לעשות

77
00:03:38,500 --> 00:03:40,720
שאתה כותב
JavaScript בקבצים נפרדים

78
00:03:40,720 --> 00:03:45,460
ולהשתמש במקור תגי סקריפט
מייחס לקשור JavaScript שלך

79
00:03:45,460 --> 00:03:49,520
ל- HTML שלך, דף האינטרנט שלך.

80
00:03:49,520 --> 00:03:52,610
>> משתנים אז JavaScript, אנחנו
להתחיל לדבר על התחביר כאן.

81
00:03:52,610 --> 00:03:53,600
ונלך דרך
של מהירות מסוג זה,

82
00:03:53,600 --> 00:03:56,640
כי אנחנו כבר עשינו את זה ב- PHP, כך
זה צריך להיות די מוכר כל.

83
00:03:56,640 --> 00:03:59,490
אז משתנה ב- JavaScript הם
דומה מאוד ל- PHP משתנים.

84
00:03:59,490 --> 00:04:03,270
אין מציין סוג, ו
כשאתה מציג את משתנה,

85
00:04:03,270 --> 00:04:05,070
אתה קידומת זה עם מילת המפתח var.

86
00:04:05,070 --> 00:04:07,750
ב- PHP היינו עושה משהו
כמו זה, x סימן דולר.

87
00:04:07,750 --> 00:04:09,950
ככה אנחנו הצבענו
משתנה, אבל לא, אנחנו

88
00:04:09,950 --> 00:04:12,060
לא מזכיר את הסוג
של משתנה בכל.

89
00:04:12,060 --> 00:04:15,124
היינו אומרים משהו כמו
x סימן דולר שווה 44 ב- PHP.

90
00:04:15,124 --> 00:04:17,040
אם אנחנו עושים
אותו דבר ב- JavaScript,

91
00:04:17,040 --> 00:04:19,589
היינו אומר x var שווה 44.

92
00:04:19,589 --> 00:04:22,780
אז var הוא סוג של הדרך שלנו
של החדרת משתנה.

93
00:04:22,780 --> 00:04:26,850
זה אולי קצת יותר אינטואיטיבי
לא רק משתנה סימן דולר.

94
00:04:26,850 --> 00:04:29,080
>> שוב, כי אין
סוגי נתונים, אנחנו יכולים לעשות את זה

95
00:04:29,080 --> 00:04:34,490
עם כל סוג נתונים, מחרוזות,
כל דבר אחר יהיה כל להיות var.

96
00:04:34,490 --> 00:04:37,260
תנאי, כולנו
חברים ותיקים מC ו- PHP

97
00:04:37,260 --> 00:04:41,640
עדיין זמינים, כך שיש לנו, אם,
אחר אם, אחר, מתג ושאלה

98
00:04:41,640 --> 00:04:42,240
מעי גס סימן.

99
00:04:42,240 --> 00:04:45,890
מתג שנותר גמיש כמו שזה
היה ב- PHP, אבל כל אלה אתה

100
00:04:45,890 --> 00:04:46,930
מכיר על ידי החברה.

101
00:04:46,930 --> 00:04:49,900
ובאופן דומה עם לולאות הן
המועדפים הישנים של זמן,

102
00:04:49,900 --> 00:04:52,700
לעשות בזמן, ועדיין לרשותנו.

103
00:04:52,700 --> 00:04:55,880
אז אנחנו כבר יודעים הרבה
סוג JavaScript בסיסי של יסודות

104
00:04:55,880 --> 00:05:01,800
רק מכוח שיש לא מעט
ידע עכשיו על C ו- PHP.

105
00:05:01,800 --> 00:05:03,670
>> מה לגבי פונקציות בJavaScript?

106
00:05:03,670 --> 00:05:08,199
ובכן, דומה ל- PHP כל פונקציה היא
הציג עם מילת המפתח הפונקציה.

107
00:05:08,199 --> 00:05:10,740
אתה אומר פונקציה, ואז אתה
להתחיל להגדיר את הפונקציה שלך.

108
00:05:10,740 --> 00:05:12,531
מה זה קצת שונה
על JavaScript,

109
00:05:12,531 --> 00:05:15,700
למרות שהוא היכולת שיש לי
מה שנקרא פונקציה אנונימית.

110
00:05:15,700 --> 00:05:18,880
אז אתה יכול להגדיר פונקציות
שאין להם שם.

111
00:05:18,880 --> 00:05:21,222
זה משהו
באמת לא ראה בעבר.

112
00:05:21,222 --> 00:05:23,430
אנחנו באמת נשתמש במושג
של פונקציה אנונימית

113
00:05:23,430 --> 00:05:27,880
מעט מאוחר יותר בזה
וידאו, כי זה יהיה

114
00:05:27,880 --> 00:05:31,530
לעשות קצת יותר הגיוני בהקשר
כאשר אנו רואים אותו במצב מסוים

115
00:05:31,530 --> 00:05:33,120
כי אני כבר בעבודת כאן.

116
00:05:33,120 --> 00:05:35,710
אבל בואו רק נסתכל
על מה JavaScript פשוט

117
00:05:35,710 --> 00:05:37,850
פונקציה עשויה להיראות.

118
00:05:37,850 --> 00:05:40,610
>> אז אני כבר הלכתי קדימה ו
נפתח IDE CS50

119
00:05:40,610 --> 00:05:43,690
ואני כבר לרוץ אפאצ'י
כדי להתחיל ריצת השרת שלי.

120
00:05:43,690 --> 00:05:46,800
ויש לי קובץ זה
פתוח בשם Home.html.

121
00:05:46,800 --> 00:05:48,330
ואני להתקרב קצת כאן.

122
00:05:48,330 --> 00:05:52,090
ובעצם, אתה יכול לראות את
Home.html הוא פשוט חבורה של כפתורים.

123
00:05:52,090 --> 00:05:55,291
ואני טוען שבחלק העליון כאן
כי זה סעיף JavaScript

124
00:05:55,291 --> 00:05:55,790
חומרים.

125
00:05:55,790 --> 00:05:59,490
אז יש חבורה של כפתורים כאן,
אבל מה לחצנים אלה עושים בעצם?

126
00:05:59,490 --> 00:06:03,662
>> ובכן, אנחנו מעל הראש שלי המטען,
ויש לי Home.html אני פותח כאן.

127
00:06:03,662 --> 00:06:05,620
בהתחלה מאוד,
כאן המקום שבו אני מקשר

128
00:06:05,620 --> 00:06:07,500
בכל קבצי מקור JavaScript שלי.

129
00:06:07,500 --> 00:06:08,000
יָמִינָה?

130
00:06:08,000 --> 00:06:12,440
אז יש לי anonymous.js, clock.js,
אני משתמש בתכונת המקור

131
00:06:12,440 --> 00:06:14,440
של תג התסריט לקשר בקובץ.

132
00:06:14,440 --> 00:06:18,660
כל כך לא אני כתבתי
JavaScript ישירות לקובץ זה,

133
00:06:18,660 --> 00:06:21,790
אבל אני כבר משכתי בכל
JavaScript שכתבתי בנפרד.

134
00:06:21,790 --> 00:06:24,540
ואם אנחנו לגלול למטה כאן, זה
צריך כל נראים מוכר במקצת

135
00:06:24,540 --> 00:06:27,090
עם קצת תחביר חדש.

136
00:06:27,090 --> 00:06:32,655
יש לנו כאן תג כותרת ל
פונקציות ולאחר מכן על כפתור.

137
00:06:32,655 --> 00:06:35,530
יש לי קלט זה כפתור סוג,
וככל הנראה, כאשר אני לוחץ עליו,

138
00:06:35,530 --> 00:06:38,130
אני הולך להתקשר לכמה
לתפקד מועד התראה.

139
00:06:38,130 --> 00:06:41,792
וככה אנחנו סוג של יכולים לערבב
קצת JavaScript ו- HTML.

140
00:06:41,792 --> 00:06:44,500
הם בעצם לשחק יפים יפה
יחד, וכך ככל הנראה כאשר

141
00:06:44,500 --> 00:06:48,730
אני לוחץ על לחצן זה, אני הולך
לקרוא כמה מועד התראת פונקציה.

142
00:06:48,730 --> 00:06:53,660
ובאופן דומה יש לי הגדרת התנהגויות
לכל הכפתורים האחרים ש

143
00:06:53,660 --> 00:06:56,440
הם בדף home.html,
שנשמור חוזר

144
00:06:56,440 --> 00:06:59,172
לבמהלך הסרטון הזה.

145
00:06:59,172 --> 00:07:00,880
אבל בואו נחזור עד
כאן ותסתכל

146
00:07:00,880 --> 00:07:03,850
בclock.js, המהווה את
קובץ JavaScript ש

147
00:07:03,850 --> 00:07:07,370
כתבתי שיש פונקציה ראשונה
אנחנו הולכים להעיף מבט.

148
00:07:07,370 --> 00:07:11,630
כפי שניתן לראות, אני מתחיל JavaScript שלי
לתפקד עם הפונקציה של מילות מפתח,

149
00:07:11,630 --> 00:07:14,560
ואני נתתי אחד זה
שם, זה נקרא מועד התראה.

150
00:07:14,560 --> 00:07:18,710
בתוך משם, אני כנראה ליצור
משתנה מקומי חדש בשם תאריך הנוכחי.

151
00:07:18,710 --> 00:07:21,500
ואני הולך להקצות
שווה למועד חדש.

152
00:07:21,500 --> 00:07:24,430
ואנחנו יכולים להיכנס להרבה
פירוט על מה הוא תאריך,

153
00:07:24,430 --> 00:07:27,060
ובאמת JavaScript הוא כל כך
גדול שאנחנו לא יכולים

154
00:07:27,060 --> 00:07:28,330
לכסות את הכל בוידאו אחד.

155
00:07:28,330 --> 00:07:32,220
אבל די אם נאמר, זה הולך
לחזור אליי פריט מידע ש

156
00:07:32,220 --> 00:07:35,470
מתמצת את התאריך והשעה הנוכחיים.

157
00:07:35,470 --> 00:07:39,100
אני אחסון שבמשתנה שאני
כנראה הולך להתריע תאריך הנוכחי.

158
00:07:39,100 --> 00:07:41,300
>> ובכן, מה עושה התראה
מבט תאריך הנוכחי כמו?

159
00:07:41,300 --> 00:07:46,460
בואו נסתכל על הקובץ עצמו
לגבות מעל בחלון הדפדפן.

160
00:07:46,460 --> 00:07:49,551
אז שוב, זה הכפתור ש
קשר ל, פונקציה בשם זה.

161
00:07:49,551 --> 00:07:51,800
ואני לוחץ אותו שם ו
תראה מה זה עשה, זה התראה.

162
00:07:51,800 --> 00:07:56,140
זה צץ סוג זה תיבה לספר
שלי שהזמן הנוכחי הוא, ככל הנראה,

163
00:07:56,140 --> 00:07:59,370
זה 4 בנובמבר ב
10:43:43 בבוקר.

164
00:07:59,370 --> 00:08:02,345
ואם אני לוחץ עליו שוב, עכשיו
זה כמה שניות מאוחר יותר, נכון?

165
00:08:02,345 --> 00:08:03,720
אז זה כל פונקציה זו עושה.

166
00:08:03,720 --> 00:08:07,670
כאשר אני לוחץ על לחצן זה, זה
צץ הודעת התראה לי.

167
00:08:07,670 --> 00:08:13,806

168
00:08:13,806 --> 00:08:15,690
אז יש ממש לא
יותר מדי פונקציות

169
00:08:15,690 --> 00:08:19,110
זה שונה מPHP,
רק קצת תחביר החדש

170
00:08:19,110 --> 00:08:22,500
שמגיע עם עבודה עם JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> מערכים ב- JavaScript הם
די פשוט.

172
00:08:24,650 --> 00:08:27,200
להכריז מערך, אתה משתמש ב
תחביר סוגריים מרובעים

173
00:08:27,200 --> 00:08:30,090
שאנחנו מכירים מPHP.

174
00:08:30,090 --> 00:08:33,432
ודומה ל- PHP, אנחנו
ניתן גם לערבב סוגי נתונים.

175
00:08:33,432 --> 00:08:35,140
אז מערך זה, שניהם
מערכים אלה הייתם

176
00:08:35,140 --> 00:08:36,960
להיות JavaScript הלגיטימי לחלוטין.

177
00:08:36,960 --> 00:08:42,500
אחד שכל המספרים השלמים, ואחד ש
מתערבב סוגי נתונים שונים.

178
00:08:42,500 --> 00:08:45,020
>> מה זה משהו שונה מאוד
ב- JavaScript, אף?

179
00:08:45,020 --> 00:08:47,020
זה הרעיון של אובייקט.

180
00:08:47,020 --> 00:08:50,240
אז אולי שמעת על
תכנות מונחה עצמים.

181
00:08:50,240 --> 00:08:53,370
אנחנו לא עושים את זה הרבה בCS50,
אבל אנחנו נעשה קצת מזה

182
00:08:53,370 --> 00:08:55,670
כאן בהקשר של JavaScript.

183
00:08:55,670 --> 00:08:59,100
עכשיו יש JavaScript היכולת
להתנהג כמו תכנות מונחה עצמים

184
00:08:59,100 --> 00:09:02,615
שפה, אבל זה לא את עצמו
באופן בלעדי מונחה עצמים

185
00:09:02,615 --> 00:09:03,490
שפת תכנות.

186
00:09:03,490 --> 00:09:05,281
וזה מגיע שוב
בחזרה למה שאמרתי, זה

187
00:09:05,281 --> 00:09:10,610
יכול להיות מאוד מאתגר ללמוד
JavaScript תכנות הראשון שלך

188
00:09:10,610 --> 00:09:13,890
שפה, כי זה לא
באמת יתאים פרדיגמה מסוימת.

189
00:09:13,890 --> 00:09:16,430
>> C מצד שני הוא
שפת תכנות פונקציונלית.

190
00:09:16,430 --> 00:09:22,270
אם אנחנו רוצים, פונקציות
סוג של איש הבוס הגדול, נכון?

191
00:09:22,270 --> 00:09:24,410
הם מכתיבים את מה ש
קורה כל דבר אחר.

192
00:09:24,410 --> 00:09:26,600
אנחנו רוצים לשנות את המשתנים,
אנו קוראים פונקציות.

193
00:09:26,600 --> 00:09:28,220
אנחנו עושים דברים לפונקציות.

194
00:09:28,220 --> 00:09:31,250
אובייקטים במקום, ב
מתנגד שפת אוריינטציה,

195
00:09:31,250 --> 00:09:35,937
אובייקטי סוג של להיות הכוכב ו
פונקציות להיות סוג של משנית.

196
00:09:35,937 --> 00:09:38,270
אבל מה הוא אובייקט, מה ש
הוא הרעיון הזה של אובייקט?

197
00:09:38,270 --> 00:09:40,880
ובכן, אם זה עוזר, חושב
על זה בסוג ראשון

198
00:09:40,880 --> 00:09:44,540
כמו מבנה C או struct
שאנחנו כבר למדנו על לפני.

199
00:09:44,540 --> 00:09:47,430
ב C, מבנה מכיל
מספר תחומים,

200
00:09:47,430 --> 00:09:51,174
ואולי כעת אנו יכולים להתחיל ל
קוראים מאפייני תחומים אלה.

201
00:09:51,174 --> 00:09:53,590
אבל התכונות אף פעם לא באמת
לעמוד על שלהם, נכון?

202
00:09:53,590 --> 00:09:56,410
אם אני מגדיר את מבנה למכונית
כמו זה עם שני הבא

203
00:09:56,410 --> 00:10:00,750
שדות או נכסים, אחד
שלם לשנה של המכונית

204
00:10:00,750 --> 00:10:04,290
ועוד 10 אופי
מחרוזת למודל של המכונית,

205
00:10:04,290 --> 00:10:07,150
אני יכול לומר דבר כזה,
אני יכול להצהיר על משתנה חדש

206
00:10:07,150 --> 00:10:10,080
של הרבי המכונית struct סוג.

207
00:10:10,080 --> 00:10:13,730
ואז אני יכול לומר משהו
כמו herbie.year שווה 1,963,

208
00:10:13,730 --> 00:10:15,850
וherbie.model שווה חיפושית.

209
00:10:15,850 --> 00:10:17,000
זה בסדר.

210
00:10:17,000 --> 00:10:19,680
אני משתמש בשדות ב
הקשר של המבנה,

211
00:10:19,680 --> 00:10:22,290
אבל אני אף פעם לא יכול פשוט
אומר משהו כזה.

212
00:10:22,290 --> 00:10:22,790
יָמִינָה?

213
00:10:22,790 --> 00:10:26,836
אני לא יכול להשתמש בשם השדה
עצמאי של המבנה.

214
00:10:26,836 --> 00:10:28,210
זה סוג של דבר בסיסי.

215
00:10:28,210 --> 00:10:32,990
>> אז שדות להיות
יסוד למבני C

216
00:10:32,990 --> 00:10:39,050
דומים מאוד למאפיינים ש
יסוד לאובייקטי JavaScript.

217
00:10:39,050 --> 00:10:42,080
אבל מה שעושה אותם
מעניין במיוחד

218
00:10:42,080 --> 00:10:46,230
הוא שעצמים יכולים להיות גם מה ש
שיטות נקראות, שהם באמת

219
00:10:46,230 --> 00:10:50,730
רק מילה יפה לפונקציות ש
הם אינהרנטי לאובייקט, כמו גם.

220
00:10:50,730 --> 00:10:55,340
אז זה תפקיד שיכול להיות רק
נקרא בהקשר של אובייקט.

221
00:10:55,340 --> 00:10:59,200
רק אובייקט שהגדיר
פונקציה זו בתוך שלה,

222
00:10:59,200 --> 00:11:02,020
אם אתה חושב על
struct, הפונקציה

223
00:11:02,020 --> 00:11:05,720
מוגדר בתוך המגדירים
סוגריים מסולסלים של המבנה.

224
00:11:05,720 --> 00:11:07,980
אז זה רק אומר משהו
למבנה.

225
00:11:07,980 --> 00:11:10,960
וזה סוג של מה שאנחנו עושים
כאן עם אובייקטים ושיטות.

226
00:11:10,960 --> 00:11:13,580
זה בעצם כמו שאנחנו
הגדרת פונקציה ש

227
00:11:13,580 --> 00:11:16,670
רק הגיוני ב
אובייקט מסוים, וכדי ש

228
00:11:16,670 --> 00:11:19,440
קורא לזה שיטה של ​​האובייקט.

229
00:11:19,440 --> 00:11:23,180
ואנחנו אף פעם לא יכולים לקרוא לזה
פונקציה בלתי תלויה של האובייקט,

230
00:11:23,180 --> 00:11:29,260
בדיוק כמו שאנחנו לא יכולים להגיד שנה או מודל
עצמאי של struct בג

231
00:11:29,260 --> 00:11:32,300
>> תכנות פונקציונלי אז
פרדיגמות להיראות משהו כזה.

232
00:11:32,300 --> 00:11:35,450
פונקציה ולאחר מכן כאשר אתה עובר
באובייקט כפרמטר.

233
00:11:35,450 --> 00:11:38,650
בתכנות מונחה עצמים
שפות, זה סוג של מקבל

234
00:11:38,650 --> 00:11:43,464
התהפך, והיינו חושבים על
זה ככה, object.function.

235
00:11:43,464 --> 00:11:45,380
אז זה סוג של נקודה ש
מפעיל רומז שוב

236
00:11:45,380 --> 00:11:49,540
שזה סוג מסוים של רכוש
או תכונה של האובייקט עצמו.

237
00:11:49,540 --> 00:11:53,240
אבל זה מה שאובייקט
שפת תכנות מונחה

238
00:11:53,240 --> 00:11:57,150
אולי לעשות כדי להפוך את פונקציה
קורא לשיטה, שוב, ש

239
00:11:57,150 --> 00:12:00,260
היא רק מילה מיוחדת לפונקציה
זה טבוע באובייקט.

240
00:12:00,260 --> 00:12:03,440
זה מה ש
תחביר עשוי להיראות.

241
00:12:03,440 --> 00:12:09,360
ואז נתחיל לראות חלק מ
זה בהקשר של JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> גם אתה יכול לחשוב על אובייקט
כמו סוג של מערך אסוציאטיבי,

243
00:12:12,470 --> 00:12:14,160
שאנחנו מכירים מPHP.

244
00:12:14,160 --> 00:12:17,720
זכור מערך אסוציאטיבי מאפשר
לנו יש זוגות ערך מפתח, במקום

245
00:12:17,720 --> 00:12:23,040
שיש מדדים 0, אחת, שתיים, שלוש,
וכן הלאה כמו שאנחנו רגילים מC

246
00:12:23,040 --> 00:12:23,940
מערכים.

247
00:12:23,940 --> 00:12:27,472
מערכים אסוציאטיביים יכולים למפות
מילות, כגון בוידאו PHP,

248
00:12:27,472 --> 00:12:29,180
אנחנו מדברים על
תוספות של פיצות.

249
00:12:29,180 --> 00:12:31,180
ואז הייתה לנו מערך
פיצות בשם, ואנחנו

250
00:12:31,180 --> 00:12:36,670
הייתה לי הגבינה הייתה מפתח ו$ 8.99 היו
ערך, ולאחר מכן פפרוני היה מפתח,

251
00:12:36,670 --> 00:12:39,190
9.99 $ היה ערך, וכן הלאה.

252
00:12:39,190 --> 00:12:43,300
וכך אנו יכולים גם לחשוב על
מתנגד סוג של דומה לאסוציאטיבי

253
00:12:43,300 --> 00:12:43,840
מַעֲרָך.

254
00:12:43,840 --> 00:12:47,020
וכך תחביר זה כאן
היה ליצור אובייקט חדש

255
00:12:47,020 --> 00:12:50,950
הרבי קרא לעם שני
תכונות הפנימיים שלו.

256
00:12:50,950 --> 00:12:57,310
שנה, המקבלת את הערך 1963,
ומודל, אשר מוקצה המחרוזת

257
00:12:57,310 --> 00:12:58,140
חיפושית.

258
00:12:58,140 --> 00:13:01,770
>> ושים לב כאן שאני משתמש
גרשיים בודדים ב- JavaScript.

259
00:13:01,770 --> 00:13:05,570
אתה יכול להשתמש בגרשיים בודדים או כפולים
על מיתרים כאשר אתה מדבר.

260
00:13:05,570 --> 00:13:07,772
זה רק באופן קונבנציונלי
המקרה שרוב הפעמים

261
00:13:07,772 --> 00:13:10,230
כאשר אתה כותב JavaScript,
אתה פשוט השתמש בגרשיים בודדים.

262
00:13:10,230 --> 00:13:15,050
אבל אני יכול להשתמש במרכאות כפולות כאן, ו
זה יהיה בסדר גמור גם כן.

263
00:13:15,050 --> 00:13:17,470
>> אז זוכר איך ב
PHP היו לנו את הרעיון הזה

264
00:13:17,470 --> 00:13:22,730
של עבור כל לולאה שיאפשר לנו
ללחזר על כל ערך מפתח

265
00:13:22,730 --> 00:13:25,270
זוגות אסוציאטיביים
מערך, כי אנחנו

266
00:13:25,270 --> 00:13:29,050
לא היה לי יכולת זו כדי לחזר
דרך 0, אחת, שתיים, שלוש, ארבעה,

267
00:13:29,050 --> 00:13:30,710
וכולי?

268
00:13:30,710 --> 00:13:35,010
יש JavaScript משהו דומה מאוד,
אבל זה לא נקרא לכל לולאה,

269
00:13:35,010 --> 00:13:38,960
זה נקרא בלולאות.

270
00:13:38,960 --> 00:13:42,890
אז אם אמרתי לי ש
זה, למפתח var באובייקט,

271
00:13:42,890 --> 00:13:48,670
זה סוג של דומה לאומר
לכל דבר כמו משהו.

272
00:13:48,670 --> 00:13:53,850
אבל כל מה שאני עושה כאן הוא iterating
דרך כל המפתחות של האובייקט שלי.

273
00:13:53,850 --> 00:13:56,070
ובתוך מתולתל
הפלטה שם, הייתי

274
00:13:56,070 --> 00:14:03,410
להשתמש במקש סוגריים מרובעים אובייקט להפנות
לערך שבמיקום מרכזי.

275
00:14:03,410 --> 00:14:05,400
>> לחלופין, יש
אפילו אחר גישה.

276
00:14:05,400 --> 00:14:10,880
אם אני רק דואג רק
ערכים, אני יכול לומר במפתח של אובייקט,

277
00:14:10,880 --> 00:14:12,360
ורק להשתמש במפתח בפנים.

278
00:14:12,360 --> 00:14:17,240
אז למפתח var באובייקט, יש לי
להשתמש בסוגריים מרובעים אובייקט

279
00:14:17,240 --> 00:14:19,340
מפתח בתוך הלולאה.

280
00:14:19,340 --> 00:14:24,580
למפתח var של אובייקט, שאני יכול
רק להשתמש במפתח בתוך הלולאה,

281
00:14:24,580 --> 00:14:29,040
כי אני פשוט במיוחד
מדבר על הערכים קיימים.

282
00:14:29,040 --> 00:14:32,630
>> אז בואו אולי לקחת
מסתכל על ההבדל

283
00:14:32,630 --> 00:14:35,670
רק כדי להראות לך במהירות
ההבדל בין ארבעה

284
00:14:35,670 --> 00:14:40,730
ולשל עם מסוים מאוד
מערך, שיש לנו כאן, מערך שבוע.

285
00:14:40,730 --> 00:14:43,616
אז אני צריך למצוא מערך חדש
כי אני מלא בשבעה מיתרים,

286
00:14:43,616 --> 00:14:46,240
יום שני יום שלישי יום רביעי,
יום חמישי, שישי, שבת, יום ראשון.

287
00:14:46,240 --> 00:14:50,530
ואני רוצה לחזר עכשיו
באמצעות מערך זה,

288
00:14:50,530 --> 00:14:53,090
הדפסת מידע מסוים.

289
00:14:53,090 --> 00:14:58,780
אם אני משתמש בלולאה ל
להדפיס את המידע,

290
00:14:58,780 --> 00:15:00,710
מה אתה חושב שאני הולך לקבל?

291
00:15:00,710 --> 00:15:01,710
ובכן, בואו נסתכל.

292
00:15:01,710 --> 00:15:05,300
ולפני שאנחנו קופצים מעל
לחלון הדפדפן שלי,

293
00:15:05,300 --> 00:15:08,090
רק יודע ש
console.log הוא סוג של אחד

294
00:15:08,090 --> 00:15:10,630
דרך לעשות F הדפסה ב- JavaScript.

295
00:15:10,630 --> 00:15:12,040
אבל מה היא הקונסולה?

296
00:15:12,040 --> 00:15:14,940
ובכן, זה מה שאנחנו הולכים
ללכת תסתכל עכשיו.

297
00:15:14,940 --> 00:15:16,850
>> אוקיי, אז אנחנו שוב כאן
בחלון הדפדפן שלי,

298
00:15:16,850 --> 00:15:19,410
ואני הולך לפתוח
עד כלי הפיתוח שלי.

299
00:15:19,410 --> 00:15:22,290
שוב, אני רק להכות F12
כדי לפתוח את כלי פיתוח.

300
00:15:22,290 --> 00:15:25,670
ושים לב שכאן ב
עליון שבחרתי קונסולה.

301
00:15:25,670 --> 00:15:28,480
אז זה הרעיון
של קונסולת מפתח,

302
00:15:28,480 --> 00:15:30,500
וזה יאפשר לנו
להדפיס את המידע,

303
00:15:30,500 --> 00:15:33,000
כמו סוג של המסוף, אבל
כפי שתראה קצת יותר מאוחר,

304
00:15:33,000 --> 00:15:37,720
אנחנו יכולים גם להקליד מידע ב
כדי לקיים אינטראקציה עם דף האינטרנט שלנו.

305
00:15:37,720 --> 00:15:42,320
אני הולך להתמקד בקצת כאן,
ואני הולך עכשיו לחץ על במבחן.

306
00:15:42,320 --> 00:15:45,230
וארבעה בtest-- אני לא הולך
להראות לך את הקוד לזה עכשיו,

307
00:15:45,230 --> 00:15:47,479
אבל אתה תקבל את זה אם אתה
להוריד את קוד המקור ש

308
00:15:47,479 --> 00:15:50,380
מזוהה עם video-- זה
כי הוא פשוט בלולאה

309
00:15:50,380 --> 00:15:52,610
שראינו רק
שני לפני בשקופית.

310
00:15:52,610 --> 00:15:54,810
>> אז אני הולך קליק ש
כפתור, וכאן,

311
00:15:54,810 --> 00:15:58,440
הנה מה שהודפס ב
קונסולה, 0, אחת, שתיים, שלוש, ארבע, חמש,

312
00:15:58,440 --> 00:15:58,940
שֵׁשׁ.

313
00:15:58,940 --> 00:16:02,490
אני לא להדפיס את המידע
בתוך מקומות מערך אלה,

314
00:16:02,490 --> 00:16:05,180
כי אני משמש בלולאה.

315
00:16:05,180 --> 00:16:10,670
ובתוך הגוף של הלולאה, אני
רק הדפיס מפתח אינו מתנגדים מפתח.

316
00:16:10,670 --> 00:16:18,600
אבל אם אני עכשיו לנקות הקונסולה שלי, ואני
לעבור למבחן, וארבעה של מבחן

317
00:16:18,600 --> 00:16:22,500
אני אומר שאני משתמש לשל לולאה
במקום ולהדפיס את המפתח,

318
00:16:22,500 --> 00:16:28,079
אם אני לוחץ על זה, עכשיו אני מקבל
אלמנטים בפועל בתוך האובייקט שלי

319
00:16:28,079 --> 00:16:29,120
או המערך שלי במקרה זה.

320
00:16:29,120 --> 00:16:31,760
המערך שלי של ימי שבוע.

321
00:16:31,760 --> 00:16:33,480
אני הדפסתי יום שני,
יום שלישי יום רביעי.

322
00:16:33,480 --> 00:16:36,930
אז זה ההבדל בין
בלולאה, שמדפיסה

323
00:16:36,930 --> 00:16:43,410
רק את המפתחות אם אתה רק משתמש במפתח
בתוך הגוף של הלולאה,

324
00:16:43,410 --> 00:16:46,850
ולשל לולאה, אשר הדפסים
את הערכים אם אתה משתמש רק

325
00:16:46,850 --> 00:16:48,870
מפתח בתוך הגוף של הלולאה.

326
00:16:48,870 --> 00:16:52,380
>> בסדר, איך אנחנו עכשיו מתחילים ל
לשרשר מחרוזות ואולי לערבב

327
00:16:52,380 --> 00:16:57,220
חלק ממשתנים עם אינטרפולציה
כמו שהיינו מסוגל לעשות בPHP?

328
00:16:57,220 --> 00:16:59,410
ובכן, אנחנו די מכירים
עם זה מPHP.

329
00:16:59,410 --> 00:17:04,109
כך היינו עושה את זה באמצעות
מפעיל נקודה ללשרשר מחרוזות.

330
00:17:04,109 --> 00:17:06,260
ב- JavaScript, אם כי,
אנחנו בעצם להשתמש במשהו

331
00:17:06,260 --> 00:17:09,290
התקשרתי למרכזייה בתוספת, ש
הוא אולי אפילו קצת יותר

332
00:17:09,290 --> 00:17:10,470
אינטואיטיבי, נכון?

333
00:17:10,470 --> 00:17:12,609
אנחנו מוסיפים חבורה
יחד של מחרוזות.

334
00:17:12,609 --> 00:17:14,520
אז בואו לחזור
שוב ולראות מה זה

335
00:17:14,520 --> 00:17:18,693
יודפס אם אנחנו מנסים להדפיס
כל המידע במערך שבוע.

336
00:17:18,693 --> 00:17:20,859
בסדר, אז תחת כאן
תחת שרשור מחרוזת,

337
00:17:20,859 --> 00:17:24,822
יש לי שתי אפשרויות, בניין מחרוזת
V1 ולאחר מכן V2 בניין מחרוזת.

338
00:17:24,822 --> 00:17:26,530
ואנו רואים למה אנחנו
צריך V2 בשני.

339
00:17:26,530 --> 00:17:28,610
אבל אני הולך ללחוץ על
V1 בניין מחרוזת, ש

340
00:17:28,610 --> 00:17:30,360
הוא הקוד שהיינו
רק להעיף מבט ב,

341
00:17:30,360 --> 00:17:32,980
console.log עם כל הפלוסים.

342
00:17:32,980 --> 00:17:35,910
בואו תראו אם זה הדפסים
את מה שאנחנו מצפים.

343
00:17:35,910 --> 00:17:39,939
>> יום שני הוא יום מספר 01 של השבוע,
יום שלישי הוא יום מספר 11 של השבוע.

344
00:17:39,939 --> 00:17:41,730
ובכן, מה שאני מנסה
לעשות שם היה מקבל

345
00:17:41,730 --> 00:17:46,280
זה להדפיס את יום שני הוא יום מספר
אחד, יום שלישי הוא יום מספר שתיים.

346
00:17:46,280 --> 00:17:50,140
אבל זה נראה כאילו אני
תמיד להדפיס את אחד.

347
00:17:50,140 --> 00:17:51,260
ובכן, מדוע זה כך?

348
00:17:51,260 --> 00:17:55,600
ובכן, מתברר, לקחת מבט נוסף
בקטע הקטן הזה של קוד כאן.

349
00:17:55,600 --> 00:18:00,160
שים לב שאנו משתמשים בתוספת
מפעיל בשני הקשרים שונים.

350
00:18:00,160 --> 00:18:03,221
>> ואז הנה שבו אולי דברים
שאנחנו כבר סוג של היו אומרים,

351
00:18:03,221 --> 00:18:03,970
הו, זה כל כך גדול.

352
00:18:03,970 --> 00:18:05,910
אנחנו לא מתעסקים עם סוגי נתונים יותר.

353
00:18:05,910 --> 00:18:08,220
אבל הנה שבו למעשה
כי אנחנו מאבדים סוגי נתונים

354
00:18:08,220 --> 00:18:10,960
באמת יכול להיות קצת
של בעיה עבורנו.

355
00:18:10,960 --> 00:18:16,260
כעת, לאחר שהמפעיל בתוספת משמש ל
לשרשר מחרוזות ולהוסיף מספרים

356
00:18:16,260 --> 00:18:19,550
יחד, יש JavaScript
כדי להפוך את הניחוש הטוב ביותר שלה

357
00:18:19,550 --> 00:18:22,030
על מה אני רוצה לעשות את זה בשבילי.

358
00:18:22,030 --> 00:18:23,900
ובמקרה הזה, זה ניחש לא נכון.

359
00:18:23,900 --> 00:18:29,340
זה יום רק בשרשור, שיהיה
0, אחת, שתיים, שלוש, ארבעה, חמש, שש או,

360
00:18:29,340 --> 00:18:32,060
ואז זה פשוט בשרשור
וששרשור אז אחד.

361
00:18:32,060 --> 00:18:35,020
זה באמת לא להוסיף אותם יחד.

362
00:18:35,020 --> 00:18:37,320
וכך שפות הבאות,
PHP ו- JavaScript,

363
00:18:37,320 --> 00:18:39,196
שתקצירים משם
רעיון זה של סוגים,

364
00:18:39,196 --> 00:18:40,820
אתה לא צריך להתמודד עם זה יותר.

365
00:18:40,820 --> 00:18:43,600
אין עדיין יש להם סוגים מתחת למכסת המנוע.

366
00:18:43,600 --> 00:18:46,780
ואנחנו יכולים, במצבים
כמו זה, למנף את העובדה ש

367
00:18:46,780 --> 00:18:49,240
באומרו משהו
כמו אולי זה, ש

368
00:18:49,240 --> 00:18:53,210
הוא אומר לי JavaScript, על ידי
דרך, להתייחס לזה כמספר שלם,

369
00:18:53,210 --> 00:18:57,100
לא להתייחס אליו כמחרוזת, אפילו
למרות שאנחנו ערבוב יחד מחרוזות

370
00:18:57,100 --> 00:18:58,940
ושלמים כאן.

371
00:18:58,940 --> 00:19:02,204
>> זה רק אחד מהדברים האלה
כי זה נראה כל כך גדול בהקשר

372
00:19:02,204 --> 00:19:04,120
כי אנחנו לא צריכים
להתמודד עם סוגים יותר,

373
00:19:04,120 --> 00:19:05,828
אבל לפעמים אתה
לרוץ למצב

374
00:19:05,828 --> 00:19:09,110
בדיוק כמו זה שבו העובדה ש
אין לך שליטה על סוגים

375
00:19:09,110 --> 00:19:11,220
יכול לפעול כבומרנג עליך
אם אתה לא זהיר.

376
00:19:11,220 --> 00:19:18,285
ולכן אם אנחנו לקפוץ אחורה אל IDE, אני
הולך לנקות את הקונסולה שלי שוב,

377
00:19:18,285 --> 00:19:20,660
ואני הולך ללחוץ מחרוזת
גרסת בניין שתי, ש

378
00:19:20,660 --> 00:19:23,052
המקום שבו אני משתמש בפונקצית שint לנתח.

379
00:19:23,052 --> 00:19:25,260
עכשיו זה להדפיס את
מידע שאני מצפה.

380
00:19:25,260 --> 00:19:29,330
מספר יום אחד של יום שני, יום שלישי
הוא מספר יום שני, וכן הלאה.

381
00:19:29,330 --> 00:19:31,170
>> אז בואו נדבר על פונקציות שוב.

382
00:19:31,170 --> 00:19:34,790
הבטחתי לנו היה מדברים על עילום שם
פונקציות, ועכשיו ההקשר של

383
00:19:34,790 --> 00:19:36,360
סוף סוף הגיע.

384
00:19:36,360 --> 00:19:39,980
אז לפני שאנו עושים זאת, בואו נדבר שוב
על מערכים רק לשנייה.

385
00:19:39,980 --> 00:19:42,120
אז מערכים הם מיוחדים
מקרה של אובייקט.

386
00:19:42,120 --> 00:19:45,180
למעשה, כל דבר ב
JavaScript היא בעצם אובייקט.

387
00:19:45,180 --> 00:19:47,190
אז פונקציות
מקרה מיוחד של אובייקט,

388
00:19:47,190 --> 00:19:49,770
מספרים שלמים הם מיוחדים
מקרה של אובייקט,

389
00:19:49,770 --> 00:19:52,152
אבל במיוחד מערכים
יש מספר השיטות.

390
00:19:52,152 --> 00:19:55,110
זכור כי הם אובייקטים,
הם יכולים להיות בעלי תכונות ושיטות.

391
00:19:55,110 --> 00:19:58,600
יש להם מספר השיטות ש
יכול להיות מיושם על אובייקטים אלה.

392
00:19:58,600 --> 00:20:01,197
יש שיטה הנקראת
גודל, array.size,

393
00:20:01,197 --> 00:20:03,030
שיחזור ל
אתה כמו שאפשר לצפות

394
00:20:03,030 --> 00:20:05,120
מספר האלמנטים במערך שלך.

395
00:20:05,120 --> 00:20:08,480
array.pop, כמו סוג של
הרעיון של פקיעה מחוץ

396
00:20:08,480 --> 00:20:11,110
של ערימה, אם אתה זוכר
מוידאו הערימות שלנו,

397
00:20:11,110 --> 00:20:13,810
מסיר את האלמנט האחרון מהמערך.

398
00:20:13,810 --> 00:20:17,110
array.push מוסיף אלמנט חדש
בסופו של מערך.

399
00:20:17,110 --> 00:20:20,910
array.shift הוא סוג של
כמו DQ, זה מדביק את

400
00:20:20,910 --> 00:20:23,610
האלמנט הראשון של מערך.

401
00:20:23,610 --> 00:20:27,549
>> אבל יש גם אחר מיוחד
שיטה של ​​מערך הנקראת מפה.

402
00:20:27,549 --> 00:20:29,340
וזה סוג של
רעיון מעניין.

403
00:20:29,340 --> 00:20:30,930
אז מה הוא את הרעיון של מפה?

404
00:20:30,930 --> 00:20:33,880
אתה באמת תראה את זה
בכמה שפות אחרות,

405
00:20:33,880 --> 00:20:38,550
ואנחנו לא מדברים על
סוג של הקרטוגרפים המפה כאן,

406
00:20:38,550 --> 00:20:41,480
על פונקצית מיפוי אנחנו מדברים.

407
00:20:41,480 --> 00:20:44,110
בהקשר אנחנו
מדבר כאן, מפה

408
00:20:44,110 --> 00:20:47,950
הוא מבצע מיוחד
ניתן לבצע במערך

409
00:20:47,950 --> 00:20:51,630
ליישם פונקציה מסוימת
לכל אלמנט של מערך זה.

410
00:20:51,630 --> 00:20:55,190
וכך היינו אומר ב
מקרה זה, אולי array.map,

411
00:20:55,190 --> 00:21:00,330
ובתוכו, אנחנו עוברים
למפה היא פונקציה שאנחנו רוצים

412
00:21:00,330 --> 00:21:02,430
שאחול על כל אלמנט.

413
00:21:02,430 --> 00:21:07,299
אז זה סוג של מקביל לשימוש ב
לולאה ללחזר על כל אלמנט

414
00:21:07,299 --> 00:21:09,340
ולהחיל מסוים
לתפקד לכל אלמנט,

415
00:21:09,340 --> 00:21:14,830
רק JavaScript יש זה נבנה ב
רעיון של מיפוי שניתן ליישם.

416
00:21:14,830 --> 00:21:19,700
וזה הקשר גדול ל
לדבר על פונקציה אנונימית.

417
00:21:19,700 --> 00:21:22,370
>> אז בואו נגיד שיש לנו
מערך זה של מספרים שלמים.

418
00:21:22,370 --> 00:21:25,370
זה נקרא nums, ויש לו חמש
דברים בזה, אחת, שתיים, שלוש, ארבעה,

419
00:21:25,370 --> 00:21:26,410
חמש.

420
00:21:26,410 --> 00:21:30,620
עכשיו אני רוצה למפות כמה
פונקציה למערך זה.

421
00:21:30,620 --> 00:21:34,337
אני רוצה יש להם תפקיד להחיל
לכל אלמנט של המערך.

422
00:21:34,337 --> 00:21:37,420
ובכן, נניח שמה שאני רוצה
לעשות הוא פשוט להכפיל את כל האלמנטים.

423
00:21:37,420 --> 00:21:42,520
מה אני יכול לעשות רק הוא להשתמש בלולאה
לי var שווה 0, אני הוא פחות מ

424
00:21:42,520 --> 00:21:47,390
או שווה ל 4, אני בתוספת, בתוספת, ו
אז להכפיל כל מספר.

425
00:21:47,390 --> 00:21:49,580
אבל אני גם יכול לעשות משהו כזה.

426
00:21:49,580 --> 00:21:53,420
אני יכול לומר nums היה בעבר
אחד שתיים שלוש ארבע חמש,

427
00:21:53,420 --> 00:21:58,310
עכשיו, אם כי, אני רוצה אותך
תחול על מיפוי מערך זה

428
00:21:58,310 --> 00:22:00,400
שבו אני רוצה אותך
להכפיל כל מספר.

429
00:22:00,400 --> 00:22:02,540
וזה בדיוק
מה שקורה כאן.

430
00:22:02,540 --> 00:22:06,870
אבל שים לב למה שאני עובר
כבטיעון למפה.

431
00:22:06,870 --> 00:22:09,080
זה פונקציה אנונימית.

432
00:22:09,080 --> 00:22:11,140
ושימו לב שלא ניתנה
פונקציה זו שם,

433
00:22:11,140 --> 00:22:13,290
רק נתתי לו רשימת פרמטרים.

434
00:22:13,290 --> 00:22:16,370
ואז זה דוגמא
של פונקציה אנונימית.

435
00:22:16,370 --> 00:22:21,270
>> אנחנו בדרך כלל לא היינו קוראים לזה
פונקציה מחוץ להקשר של המפה.

436
00:22:21,270 --> 00:22:24,110
אנחנו מגדירים אותו כפרמטר
כדי למפות, ולכן אנחנו לא באמת

437
00:22:24,110 --> 00:22:27,910
צריך לזה שם אם
דבר היחיד שמעניין אותו זה המפה

438
00:22:27,910 --> 00:22:30,339
וזה מוגדר נכון
יש בתוך המפה.

439
00:22:30,339 --> 00:22:31,880
ואז זה פונקציה אנונימית.

440
00:22:31,880 --> 00:22:34,680
אנחנו לא מסוגלים
לעשות בעבר זה.

441
00:22:34,680 --> 00:22:38,400
מפה כמה שפונקציה
מקבל פרמטר אחד, num,

442
00:22:38,400 --> 00:22:41,890
ומה הפונקציה שעושה
הוא חוזר NUM פעמים 2.

443
00:22:41,890 --> 00:22:45,330
וכך אחרי זה
מיפוי יושם,

444
00:22:45,330 --> 00:22:50,090
עכשיו זה מה שנראה nums
כמו, שתיים, ארבעה, שש, שמונה, 10.

445
00:22:50,090 --> 00:22:52,090
ואנחנו נקפוץ לי
חלון דפדפן ורק

446
00:22:52,090 --> 00:22:55,240
תסתכל על זה
מהר מאוד גם כן.

447
00:22:55,240 --> 00:22:58,000
>> אז יש לי עוד כפתור כאן
בדף הבית שלי בשם כפול.

448
00:22:58,000 --> 00:23:03,570
וכשלוחץ פעמיים, וזה אומר לי
שלי לפני זה היה אחד, שתיים, שלוש, ארבעה,

449
00:23:03,570 --> 00:23:07,250
חמש אחרי שתיים, ארבעה, שש, שמונה, 10.

450
00:23:07,250 --> 00:23:11,930
ואם אני חוזר ולחץ לחיצה כפולה
שוב, שני, ארבעה, שש, שמונה, 10.

451
00:23:11,930 --> 00:23:17,400
ואז אחרי, ארבעה,
שמונה, 12, 16, ולאחר מכן 20.

452
00:23:17,400 --> 00:23:20,440
ומה אני עושה בתפקיד זה?

453
00:23:20,440 --> 00:23:25,210
ובכן, אם אנחנו פשוט לקפוץ לIDE, ו
אני מושך את הפונקציה אנונימית שלי, כאן

454
00:23:25,210 --> 00:23:28,780
על קו שבעה עד 13, אני
עושה עבודה מפוארת קצת כאן,

455
00:23:28,780 --> 00:23:32,240
אבל אני פשוט להדפיס את
מה כרגע במערך.

456
00:23:32,240 --> 00:23:36,580
אז על קו 16, 17,
ו -18, יש המפה שלי.

457
00:23:36,580 --> 00:23:40,930
זה המקום שבי אני החלת הכפלה זו
פונקציה לכל אלמנט.

458
00:23:40,930 --> 00:23:43,530
ואז קצת יותר למטה,
אני רק עושה את אותו הדבר

459
00:23:43,530 --> 00:23:46,640
אני עושה לפני, למעט עכשיו אני
להדפיס את התוכן של המערך

460
00:23:46,640 --> 00:23:48,167
אחרי כן.

461
00:23:48,167 --> 00:23:50,500
אבל כל מה שעשיתי כאן הוא
פשוט להשתמש פונקציה אנונימית

462
00:23:50,500 --> 00:23:53,640
למפות פני כל מערך.

463
00:23:53,640 --> 00:23:58,466
>> אז נושא אחד יותר גדול כדי לדבר על ב
JavaScript היא הרעיון של אירוע.

464
00:23:58,466 --> 00:24:01,590
אירוע הוא משהו שפשוט קורה
כאשר משתמש אינטראקציה עם האינטרנט שלך

465
00:24:01,590 --> 00:24:04,715
דף, אז אולי הם לוחצים משהו,
או אולי בדף סיום טעינה,

466
00:24:04,715 --> 00:24:07,200
או אולי הם כבר עברו
העכבר שלהם על משהו,

467
00:24:07,200 --> 00:24:09,290
או שהם כבר הקלידו משהו
בשדה קלט.

468
00:24:09,290 --> 00:24:14,260
כל הדברים האלה הם אירועים
המתרחשים בדף האינטרנט שלנו.

469
00:24:14,260 --> 00:24:17,460
ויש JavaScript
יכולת לתמוך במשהו

470
00:24:17,460 --> 00:24:21,760
בשם מטפל באירועים, ש
היא פונקציה של קריאה חוזרת ש

471
00:24:21,760 --> 00:24:23,329
מגיב לאירוע HTML.

472
00:24:23,329 --> 00:24:24,620
ומה פונקציה של קריאה חוזרת?

473
00:24:24,620 --> 00:24:27,328
ובכן, זה בדרך כלל רק עוד
שם לפונקציה אנונימית.

474
00:24:27,328 --> 00:24:30,170
זה פונקציה ש
מגיב לאירוע.

475
00:24:30,170 --> 00:24:34,130
וזה המקום שבו אנו מגיעים ל
רעיון של קשירת פונקציות מסוימות

476
00:24:34,130 --> 00:24:38,060
לתכונת HTML מסוימת.

477
00:24:38,060 --> 00:24:41,420
רוב האלמנטים של HTML
תמיכה בתכונה

478
00:24:41,420 --> 00:24:45,170
שלא לדבר על בhtml
וידאו למשהו כמו בקליק

479
00:24:45,170 --> 00:24:50,540
או בריחוף או בעומס,
כל האירועים הללו

480
00:24:50,540 --> 00:24:53,120
כי אז אתה יכול לכתוב פונקציות
עסקה שעם אירועים אלה

481
00:24:53,120 --> 00:24:56,090
כאשר אירועים אלה
להתרחש בדף האינטרנט שלך.

482
00:24:56,090 --> 00:24:59,170
>> ואז אולי html שלך
נראה משהו כזה.

483
00:24:59,170 --> 00:25:02,240
ויש לי שני כפתורים כאן,
כפתור אחד וכפתור שני,

484
00:25:02,240 --> 00:25:04,620
וכאן יש לי כרגע
שום דבר מוגדר,

485
00:25:04,620 --> 00:25:11,170
אבל זה מקום שבו התכונה ב
לחץ הוא כנראה חלק מתג html שלי.

486
00:25:11,170 --> 00:25:15,220
אז כנראה כאשר אני מגדיר את מה ש
קורה בתוך התכונה ש,

487
00:25:15,220 --> 00:25:18,590
זה הולך להיות קצת JavaScript
פונקציה שמגיבה לאירוע

488
00:25:18,590 --> 00:25:24,360
ככל הנראה של לחיצה על
כפתור אחד או שניים כפתור.

489
00:25:24,360 --> 00:25:28,580
>> מה סוג של מגניב על זה אנחנו
יכול לכתוב מטפל אירוע גנריות.

490
00:25:28,580 --> 00:25:32,370
והנדלר אירוע זה
ליצור אובייקט אירוע.

491
00:25:32,370 --> 00:25:37,000
ואובייקט האירוע יגיד לנו
איזו משני הכפתורים היה לוחץ.

492
00:25:37,000 --> 00:25:38,064
עכשיו איך זה עובד?

493
00:25:38,064 --> 00:25:39,730
ובכן, זה עשוי להיראות משהו כזה.

494
00:25:39,730 --> 00:25:44,860
אז נגדיר הכפתורים הראשונים שלנו
יש תגובה לקריאה החוזרת

495
00:25:44,860 --> 00:25:47,470
פונקציה שתיקרא
כאשר לוחץ על לחצן,

496
00:25:47,470 --> 00:25:49,520
אנחנו קוראים לשם התראת אירוע.

497
00:25:49,520 --> 00:25:53,320
ושים לב שבשני המקרים אנחנו
עובר בפרמטר אירוע זה.

498
00:25:53,320 --> 00:25:55,460
אז אנחנו קוראים לפונקציה זו
או כאשר פונקציה זו

499
00:25:55,460 --> 00:26:00,330
מופעל על ידי האירוע שקורה,
זה הולך ליצור אובייקט אירוע זה

500
00:26:00,330 --> 00:26:03,300
ולהעביר אותו כ
פרמטר להתריע שם.

501
00:26:03,300 --> 00:26:07,270
ושאובייקט האירוע הוא
הולך להכיל מידע

502
00:26:07,270 --> 00:26:09,800
על איזה כפתור שלחיצה עליו.

503
00:26:09,800 --> 00:26:11,580
ואיך הוא עושה את זה?

504
00:26:11,580 --> 00:26:13,654
ובכן, זה עשוי להיראות משהו כזה.

505
00:26:13,654 --> 00:26:15,570
אז עכשיו בי נפרד
קובץ JavaScript, אולי אני

506
00:26:15,570 --> 00:26:17,420
צריך למצוא את זה
שם התראת פונקציה, ש

507
00:26:17,420 --> 00:26:19,500
שוב מקבל שפרמטר אירוע.

508
00:26:19,500 --> 00:26:24,640
ואז כאן הוא המקום שבו אני מזהה
איזה כפתור הופעל,

509
00:26:24,640 --> 00:26:28,100
הדק var שווה אירוע
אלמנט מקור נקודה.

510
00:26:28,100 --> 00:26:33,150
מה היה המקור שנוצר
אובייקט אירוע זה, שהתקבל ב?

511
00:26:33,150 --> 00:26:36,390
זה היה כפתור אחד או שזה היה כפתור שניים?

512
00:26:36,390 --> 00:26:40,710
>> ואז כאן כל מה שאני עושה הוא
להדפיס את trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
ובכן, במקרה זה, בזה
הקשר, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
זה בדיוק מה שכתוב על הכפתור.

515
00:26:45,940 --> 00:26:48,830
זה פשוט כל כך קורה אם אנחנו קופצים
בחזרה לשנייה, שהיית

516
00:26:48,830 --> 00:26:51,670
להיות מה שבין תגי כפתור אלה.

517
00:26:51,670 --> 00:26:54,150
זה יהיה כפתור אחד או שניים כפתור.

518
00:26:54,150 --> 00:26:57,320
ובואו נסתכל
איך הייתם מטפל באירועים זה

519
00:26:57,320 --> 00:27:01,080
נראה אם ​​היו לנו אותו פועל בפרקטיקה.

520
00:27:01,080 --> 00:27:03,850
>> אז קודם כל, יש לך
events.js נפתח,

521
00:27:03,850 --> 00:27:06,517
שהוא קובץ JavaScript שבי
יש לי מוגדר בפונקציה זו.

522
00:27:06,517 --> 00:27:08,558
וכמו שאתה יכול לראות, זה
פחות או יותר בדיוק מה

523
00:27:08,558 --> 00:27:10,230
רק שראינו בשקופית לפני שנייה.

524
00:27:10,230 --> 00:27:14,890
ואני אלך על ל
דף הבית אנחנו כבר משתמשים.

525
00:27:14,890 --> 00:27:17,660
ויש לי כאן כפתור
אחד וכפתור שני.

526
00:27:17,660 --> 00:27:19,820
ואני לוחץ על כפתור אחד.

527
00:27:19,820 --> 00:27:23,930
אתה לוחץ על כפתור אחד, אם אתה
ניתן לראות כאן בהתראה.

528
00:27:23,930 --> 00:27:25,810
אוקיי.

529
00:27:25,810 --> 00:27:28,980
לחץ על לחצן שני,
לחץ על כפתור שני.

530
00:27:28,980 --> 00:27:32,150
>> אז יש לי שני הכפתורים
אותו קריאה לפונקציה, נכון?

531
00:27:32,150 --> 00:27:35,840
שניהם היו שם התראה
אירוע, אבל אובייקט אירוע זה

532
00:27:35,840 --> 00:27:41,900
שמקבל נוצרים כאשר אנו לוחצים על
זה אומר לנו שהכפתור היה לוחץ.

533
00:27:41,900 --> 00:27:44,650
אנחנו לא צריכים לכתוב שתי נפרדים
פונקציות או עסקה עם בעל

534
00:27:44,650 --> 00:27:46,470
להעביר כל מידע נוסף.

535
00:27:46,470 --> 00:27:48,220
אנחנו רק להסתמך על
מה יהיה JavaScript

536
00:27:48,220 --> 00:27:53,772
לעשות עבורנו, שבו הוא ליצור ש
סוג של אובייקט אירוע בשמנו.

537
00:27:53,772 --> 00:27:56,730
יש הרבה יותר לJavaScript מ
מה שמכוסים בסרט הזה,

538
00:27:56,730 --> 00:27:58,521
אבל יש אלה
יסודי צריך להביא לך

539
00:27:58,521 --> 00:28:00,690
די ארוכות דרכים
לימוד כל מה שאתה

540
00:28:00,690 --> 00:28:04,030
צריך לדעת על זה
שפה מעניינת.

541
00:28:04,030 --> 00:28:05,000
אני דאג לויד.

542
00:28:05,000 --> 00:28:07,010
זה CS50.

543
00:28:07,010 --> 00:28:09,181