1
00:00:00,000 --> 00:00:03,840
>> [MUSIC CHƠI]

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

3
00:00:05,770 --> 00:00:08,690
>> DOUG LLOYD: Vì vậy, bây giờ chúng tôi cũ
ưu tại lập trình web, phải không?

4
00:00:08,690 --> 00:00:12,140
Và chúng tôi đã bao phủ nhiều
ngôn ngữ trong các video cá nhân.

5
00:00:12,140 --> 00:00:14,690
Và bây giờ chúng ta hãy làm một nhiều hơn, JavaScript.

6
00:00:14,690 --> 00:00:17,370
>> Đầu tiên là tin tức tốt, JavaScript
là một chương trình hiện đại

7
00:00:17,370 --> 00:00:21,410
ngôn ngữ giống như PHP mà
cú pháp có nguồn gốc từ C,

8
00:00:21,410 --> 00:00:22,830
vì vậy đó là một nơi tốt để bắt đầu.

9
00:00:22,830 --> 00:00:25,880
Đó là về như cũ như PHP, cũng như,
đã được khoảng 20 năm.

10
00:00:25,880 --> 00:00:28,600
Nó được phát minh khoảng
cùng một lúc như PHP.

11
00:00:28,600 --> 00:00:32,240
Và JavaScript thực sự là khá
cơ bản cho người dùng kinh nghiệm

12
00:00:32,240 --> 00:00:32,740
của web.

13
00:00:32,740 --> 00:00:34,448
Trong thực tế, có
ba ngôn ngữ mà tôi

14
00:00:34,448 --> 00:00:38,480
sẽ nói loại, tạo nên
trải nghiệm người dùng tương tác

15
00:00:38,480 --> 00:00:42,650
với các trang web, html,
css, và JavaScript.

16
00:00:42,650 --> 00:00:46,030
Và vì vậy bây giờ chúng ta hãy nói một
chút chút về JavaScript.

17
00:00:46,030 --> 00:00:50,301
>> Tin xấu, mặc dù, với JavaScript
mà nó đặt ra rất nhiều quy tắc cho chính nó,

18
00:00:50,301 --> 00:00:51,300
và sau đó nó phá vỡ chúng.

19
00:00:51,300 --> 00:00:54,010
Và JavaScript có thể thực sự
loại thách thức để học hỏi,

20
00:00:54,010 --> 00:00:57,000
bởi vì nó không giống như C và
PHP, mà rất có cấu trúc

21
00:00:57,000 --> 00:01:00,270
và có những quy định rất cứng nhắc
để làm thế nào điều này có thể làm việc.

22
00:01:00,270 --> 00:01:03,690
JavaScript có loại
của nhận được rất linh hoạt

23
00:01:03,690 --> 00:01:06,650
rằng có lẽ mọi việc không đến
làm việc theo cách chúng ta mong đợi,

24
00:01:06,650 --> 00:01:09,830
và có lẽ chúng ta thực sự không thể học
ngôn ngữ lập trình đầu tiên của chúng tôi

25
00:01:09,830 --> 00:01:10,769
như một JavaScript.

26
00:01:10,769 --> 00:01:12,810
Vì vậy, có lẽ vì nó không
đề ra các quy tắc,

27
00:01:12,810 --> 00:01:15,754
và nó không thực sự
thực thi các thói quen mã hóa tốt.

28
00:01:15,754 --> 00:01:18,170
Nhưng bây giờ chúng tôi đã hy vọng phát triển
một số thói quen tốt mã hóa,

29
00:01:18,170 --> 00:01:21,470
và vì vậy chúng tôi có thể bắt đầu thâm nhập
JavaScript vào một chút.

30
00:01:21,470 --> 00:01:25,750
>> Để viết JavaScript, tương tự như mở
lên một tập tin C với một dấu chấm C mở rộng

31
00:01:25,750 --> 00:01:29,770
hoặc một tập tin PHP với một phần mở rộng dot PHP,
tất cả chúng ta cần phải làm là mở một tập tin

32
00:01:29,770 --> 00:01:31,764
với js dot mở rộng tập tin.

33
00:01:31,764 --> 00:01:34,430
Chúng tôi không cần phải có bất kỳ đặc biệt
các dấu phân cách như chúng ta đã làm trong PHP.

34
00:01:34,430 --> 00:01:36,750
Đó là loại góc
khung dấu hỏi PHP

35
00:01:36,750 --> 00:01:40,300
mà chúng ta đang sử dụng để từ đó, con đường
chúng ta nói cho trình duyệt của chúng tôi rằng những gì chúng ta có là

36
00:01:40,300 --> 00:01:43,502
JavaScript là bằng cách bao gồm
nó trong một thẻ html,

37
00:01:43,502 --> 00:01:46,210
và chúng ta sẽ thấy một chút về
làm thế nào để làm điều đó chỉ trong một khoảnh khắc.

38
00:01:46,210 --> 00:01:48,210
>> Những điều khác mà làm
JavaScript khác nhau,

39
00:01:48,210 --> 00:01:50,580
mặc dù, là nó chạy phía khách hàng.

40
00:01:50,580 --> 00:01:53,430
Vì vậy, nhớ lại với PHP
chúng ta có thể không bao giờ thực sự nhìn thấy

41
00:01:53,430 --> 00:01:57,041
PHP mà nhấn mạnh một website.

42
00:01:57,041 --> 00:01:59,040
Nếu chúng ta từng xem các
nguồn của trang, chúng tôi chỉ sẽ

43
00:01:59,040 --> 00:02:02,830
xem html đó là
tạo bởi PHP.

44
00:02:02,830 --> 00:02:04,900
Nhưng JavaScript chạy phía khách hàng.

45
00:02:04,900 --> 00:02:06,710
JavaScript của bạn chạy trên máy tính của bạn.

46
00:02:06,710 --> 00:02:09,050
Và đó là lý do tại sao bạn có thể làm
điều thích thêm blockers.

47
00:02:09,050 --> 00:02:09,550
Bên phải?

48
00:02:09,550 --> 00:02:12,704
Chặn quảng cáo thường được thực hiện bởi
giết chết tất cả các JavaScript

49
00:02:12,704 --> 00:02:14,370
đang chạy trên một trang web cụ thể.

50
00:02:14,370 --> 00:02:19,000
Và bởi vì nó sẽ phải
chạy về phía máy khách hàng của bạn,

51
00:02:19,000 --> 00:02:21,910
bạn chỉ có thể dừng
JavaScript để chạy hoàn toàn.

52
00:02:21,910 --> 00:02:27,030
Điều đó cũng có nghĩa là khi bạn sử dụng
một trang web chứa JavaScript,

53
00:02:27,030 --> 00:02:32,450
bạn phải gửi các mã nguồn JavaScript
mã như một phần của phản ứng http của bạn

54
00:02:32,450 --> 00:02:34,159
cho khách hàng khi họ yêu cầu.

55
00:02:34,159 --> 00:02:35,950
Và do đó, bạn có thể không
muốn sử dụng JavaScript

56
00:02:35,950 --> 00:02:38,395
để làm những việc thực sự nhạy cảm
như chuyển thông tin

57
00:02:38,395 --> 00:02:41,020
về mật khẩu của người sử dụng sao lưu và
ra, bởi vì họ đang thực sự

58
00:02:41,020 --> 00:02:45,610
sẽ nhận được tất cả các mã nguồn,
không chỉ là html được tạo ra,

59
00:02:45,610 --> 00:02:49,030
như sẽ là trường hợp với nói PHP.

60
00:02:49,030 --> 00:02:51,620
>> Vì vậy, làm thế nào chúng tôi bao gồm JavaScript
trong html của chúng tôi để bắt đầu?

61
00:02:51,620 --> 00:02:54,520
Vâng, tương tự như CSS, trên thực tế,
là loại như thế nào chúng tôi làm điều đó ở đây.

62
00:02:54,520 --> 00:02:56,190
Với CSS chúng ta có thẻ style.

63
00:02:56,190 --> 00:03:00,760
Và bên trong những thẻ phong cách,
chúng ta có thể xác định một phong cách trang CSS.

64
00:03:00,760 --> 00:03:03,450
Tương tự như vậy với JavaScript
chúng ta có thể mở thẻ script,

65
00:03:03,450 --> 00:03:06,660
một thẻ html chúng tôi đã không
nói về trong video html của chúng tôi,

66
00:03:06,660 --> 00:03:09,720
và viết trong JavaScript
giữa các thẻ script.

67
00:03:09,720 --> 00:03:13,960
Ngoài ra mặc dù, như CSS, chúng tôi
có thể liên kết ở bên ngoài file CSS

68
00:03:13,960 --> 00:03:15,900
và kéo chúng vào chương trình của chúng tôi theo cách đó.

69
00:03:15,900 --> 00:03:18,280
Với CSS chúng ta cũng có thể,
tha cho tôi, với JavaScript

70
00:03:18,280 --> 00:03:23,240
chúng ta cũng có thể xác định nguồn gốc
thuộc tính của thẻ script

71
00:03:23,240 --> 00:03:25,720
để liên kết trong JavaScript
riêng biệt, do đó bạn không

72
00:03:25,720 --> 00:03:27,680
phải viết nó trong
giữa các thẻ script, chúng tôi

73
00:03:27,680 --> 00:03:29,600
có thể liên kết nó trong sử dụng
mà thẻ script là tốt.

74
00:03:29,600 --> 00:03:33,230
Và cũng giống như với trường hợp với CSS nơi
chúng tôi đề nghị rằng nó có thể là

75
00:03:33,230 --> 00:03:36,090
lợi ích tốt nhất của bạn để viết
CSS của bạn vào một tập tin riêng biệt trong trường hợp

76
00:03:36,090 --> 00:03:38,500
bạn cần phải thay đổi nó,
tương tự làm chúng tôi đề nghị

77
00:03:38,500 --> 00:03:40,720
mà bạn viết của bạn
JavaScript trong các tập tin riêng biệt

78
00:03:40,720 --> 00:03:45,460
và sử dụng các nguồn thẻ script
thuộc tính để buộc JavaScript

79
00:03:45,460 --> 00:03:49,520
vào html của bạn, trang web của bạn.

80
00:03:49,520 --> 00:03:52,610
>> Vì vậy, các biến JavaScript, chúng ta sẽ
bắt đầu nói về cú pháp ở đây.

81
00:03:52,610 --> 00:03:53,600
Và chúng ta sẽ đi qua
loại này một cách nhanh chóng,

82
00:03:53,600 --> 00:03:56,640
bởi vì chúng tôi đã làm điều này trong PHP, vì vậy
tất cả điều này nên được khá quen thuộc.

83
00:03:56,640 --> 00:03:59,490
Vì vậy, các biến trong JavaScript
rất giống như PHP biến.

84
00:03:59,490 --> 00:04:03,270
Không có loại specifier, và
khi bạn giới thiệu một biến,

85
00:04:03,270 --> 00:04:05,070
bạn có tiền tố nó với các từ khóa var.

86
00:04:05,070 --> 00:04:07,750
Trong PHP, chúng tôi sẽ làm điều gì đó
như thế này, ký hiệu đô la x.

87
00:04:07,750 --> 00:04:09,950
Đó là cách chúng ta chỉ
một biến, nhưng không có, chúng tôi

88
00:04:09,950 --> 00:04:12,060
không đề cập đến các loại
của biến ở tất cả.

89
00:04:12,060 --> 00:04:15,124
Chúng tôi sẽ nói điều gì đó như
Đôla dấu x bằng 44 trong PHP.

90
00:04:15,124 --> 00:04:17,040
Nếu chúng tôi đã làm việc
điều tương tự trong JavaScript,

91
00:04:17,040 --> 00:04:19,589
chúng ta sẽ nói var x = 44.

92
00:04:19,589 --> 00:04:22,780
Vì vậy, var là loại cách của chúng tôi
giới thiệu một biến.

93
00:04:22,780 --> 00:04:26,850
Đó có lẽ trực quan hơn một chút
hơn là chỉ biến dấu đô la.

94
00:04:26,850 --> 00:04:29,080
>> Một lần nữa, vì không có
các kiểu dữ liệu, chúng ta có thể làm điều này

95
00:04:29,080 --> 00:04:34,490
với bất kỳ kiểu dữ liệu, dây,
bất cứ điều gì khác tất cả sẽ là var.

96
00:04:34,490 --> 00:04:37,260
Điều kiện, tất cả chúng tôi
những người bạn cũ từ C và PHP

97
00:04:37,260 --> 00:04:41,640
vẫn có sẵn, vì vậy chúng tôi có nếu,
else if, khác, chuyển đổi và câu hỏi

98
00:04:41,640 --> 00:04:42,240
dấu chấm.

99
00:04:42,240 --> 00:04:45,890
Switch còn lại linh hoạt như nó
là trong PHP, nhưng tất cả các bạn

100
00:04:45,890 --> 00:04:46,930
quen thuộc với bây giờ.

101
00:04:46,930 --> 00:04:49,900
Và tương tự như vậy với các vòng lặp là
các mục yêu thích cũ của thời gian,

102
00:04:49,900 --> 00:04:52,700
làm trong khi, và vẫn có sẵn cho chúng tôi.

103
00:04:52,700 --> 00:04:55,880
Vì vậy, chúng tôi đã biết rất nhiều các
cơ bản JavaScript loại nguyên tắc cơ bản

104
00:04:55,880 --> 00:05:01,800
chỉ bởi đức hạnh của việc có khá một chút
kiến thức hiện nay về C và PHP.

105
00:05:01,800 --> 00:05:03,670
>> Gì về hàm trong JavaScript?

106
00:05:03,670 --> 00:05:08,199
Vâng, giống như PHP mỗi chức năng là
giới thiệu với các từ khóa chức năng.

107
00:05:08,199 --> 00:05:10,740
Bạn nói rằng chức năng, và sau đó bạn
bắt đầu xác định chức năng của bạn.

108
00:05:10,740 --> 00:05:12,531
Một chút khác biệt là những gì
về JavaScript,

109
00:05:12,531 --> 00:05:15,700
mặc dù là khả năng có
những gì được gọi là một chức năng vô danh.

110
00:05:15,700 --> 00:05:18,880
Vì vậy, bạn có thể định nghĩa các chức năng
rằng không có một cái tên.

111
00:05:18,880 --> 00:05:21,222
Đây là một cái gì đó chúng tôi
thực sự đã không nhìn thấy trước.

112
00:05:21,222 --> 00:05:23,430
Chúng tôi sẽ thực sự sử dụng các khái niệm
của một chức năng ẩn danh

113
00:05:23,430 --> 00:05:27,880
Một lát sau, trong này
video, bởi vì nó sẽ thấy

114
00:05:27,880 --> 00:05:31,530
có ý nghĩa nhiều hơn một chút trong bối cảnh
khi chúng ta nhìn thấy nó trong một tình huống cụ thể

115
00:05:31,530 --> 00:05:33,120
mà tôi đã chuẩn ở đây.

116
00:05:33,120 --> 00:05:35,710
Nhưng chúng ta hãy có một cái nhìn
vào những gì một JavaScript đơn giản

117
00:05:35,710 --> 00:05:37,850
chức năng có thể trông như thế nào.

118
00:05:37,850 --> 00:05:40,610
>> Vì vậy, tôi đã đi trước và
mở ra IDE CS50 của tôi

119
00:05:40,610 --> 00:05:43,690
và tôi đã chạy Apache
để bắt đầu máy chủ đang chạy của tôi.

120
00:05:43,690 --> 00:05:46,800
Và tôi có tập tin này
mở home.htm.

121
00:05:46,800 --> 00:05:48,330
Và tôi sẽ phóng to một chút ở đây.

122
00:05:48,330 --> 00:05:52,090
Và về cơ bản, bạn có thể xem
Home.html chỉ là một loạt các nút bấm.

123
00:05:52,090 --> 00:05:55,291
Và tôi tuyên bố ở đầu đây
rằng đây là phần JavaScript

124
00:05:55,291 --> 00:05:55,790
nguyên vật liệu.

125
00:05:55,790 --> 00:05:59,490
Vì vậy, có một loạt các nút ở đây,
nhưng những gì các nút này thực sự làm gì?

126
00:05:59,490 --> 00:06:03,662
>> Vâng, chúng ta sẽ đi qua IED của tôi,
và tôi đã home.html mở ở đây.

127
00:06:03,662 --> 00:06:05,620
Lúc đầu,
đây là nơi mà tôi đang liên kết

128
00:06:05,620 --> 00:06:07,500
trong tất cả các tập tin mã nguồn JavaScript của tôi.

129
00:06:07,500 --> 00:06:08,000
Bên phải?

130
00:06:08,000 --> 00:06:12,440
Vì vậy, tôi có anonymous.js, clock.js,
Tôi đang sử dụng các thuộc tính nguồn

131
00:06:12,440 --> 00:06:14,440
của thẻ script để liên kết trong tập tin.

132
00:06:14,440 --> 00:06:18,660
Vì vậy, tôi đã không viết bất kỳ
JavaScript trực tiếp vào tập tin này,

133
00:06:18,660 --> 00:06:21,790
nhưng tôi đã kéo theo tất cả các
JavaScript Tôi đã viết một cách riêng biệt.

134
00:06:21,790 --> 00:06:24,540
Và nếu chúng ta di chuyển xuống đây, điều này
tất cả nên trông hơi quen thuộc

135
00:06:24,540 --> 00:06:27,090
với một chút của cú pháp mới.

136
00:06:27,090 --> 00:06:32,655
Chúng tôi có ở đây tag tiêu đề cho
chức năng và sau đó một nút.

137
00:06:32,655 --> 00:06:35,530
Tôi có một đầu vào đó là một nút loại,
và dường như khi tôi nhấp vào nó,

138
00:06:35,530 --> 00:06:38,130
Tôi sẽ gọi một số
hoạt động ngày cảnh báo.

139
00:06:38,130 --> 00:06:41,792
Và đây là cách chúng ta có thể loại pha trộn lên
một chút JavaScript và html.

140
00:06:41,792 --> 00:06:44,500
Họ thực sự chơi khá độc đáo
với nhau, và như vậy rõ ràng khi

141
00:06:44,500 --> 00:06:48,730
Tôi bấm vào nút này, tôi sẽ
để gọi một số ngày chức năng cảnh báo.

142
00:06:48,730 --> 00:06:53,660
Và tương tự có định nghĩa hành vi tôi
cho tất cả các nút bấm khác

143
00:06:53,660 --> 00:06:56,440
là trên trang home.html,
mà chúng tôi sẽ tiếp tục trở lại

144
00:06:56,440 --> 00:06:59,172
để trong quá trình video này.

145
00:06:59,172 --> 00:07:00,880
Nhưng chúng ta hãy quay trở lại
ở đây và có một cái nhìn

146
00:07:00,880 --> 00:07:03,850
tại clock.js, đó là
Tập tin JavaScript mà tôi

147
00:07:03,850 --> 00:07:07,370
đã viết rằng có chức năng đầu tiên này
chúng ta sẽ có một cái nhìn tại.

148
00:07:07,370 --> 00:07:11,630
Như bạn có thể thấy, tôi bắt đầu JavaScript của tôi
hoạt động với các chức năng từ khóa,

149
00:07:11,630 --> 00:07:14,560
và tôi đã đưa ra này một một
tên, nó được gọi là ngày báo.

150
00:07:14,560 --> 00:07:18,710
Bên trong đó, tôi dường như tạo ra một
biến địa phương mới gọi là ngày hiện tại.

151
00:07:18,710 --> 00:07:21,500
Và tôi sẽ chỉ định
một bằng một ngày mới.

152
00:07:21,500 --> 00:07:24,430
Và chúng ta có thể nhận được vào rất nhiều
chi tiết như những gì một ngày là,

153
00:07:24,430 --> 00:07:27,060
và thực sự là như vậy JavaScript
lớn mà chúng ta có thể không thể

154
00:07:27,060 --> 00:07:28,330
bao gồm tất cả mọi thứ trong một video.

155
00:07:28,330 --> 00:07:32,220
Nhưng nó đủ để nói, điều này sẽ
để trở về với tôi một mục dữ liệu mà

156
00:07:32,220 --> 00:07:35,470
gói gọn ngày hiện tại và thời gian.

157
00:07:35,470 --> 00:07:39,100
Tôi đang lưu trữ trong một biến mà tôi
dường như sẽ cảnh báo ngày hiện tại.

158
00:07:39,100 --> 00:07:41,300
>> Vâng, những gì hiện cảnh báo
hiện nay như thế nào?

159
00:07:41,300 --> 00:07:46,460
Chúng ta hãy nhìn vào chính bản thân file
sao hơn trong cửa sổ trình duyệt.

160
00:07:46,460 --> 00:07:49,551
Vì vậy, một lần nữa, đây là nút mà tôi
đã gắn liền với, chức năng được đặt tên này.

161
00:07:49,551 --> 00:07:51,800
Và tôi nhấp vào nó ở đó và
hãy nhìn những gì nó đã làm, nó cảnh báo.

162
00:07:51,800 --> 00:07:56,140
Nó hiện lên loại này hộp nói
tôi rằng thời điểm hiện tại là, rõ ràng

163
00:07:56,140 --> 00:07:59,370
đó là ngày 04 tháng 11 tại
10:43:43 vào buổi sáng.

164
00:07:59,370 --> 00:08:02,345
Và nếu tôi nhấp vào nó một lần nữa, bây giờ
đó là một vài giây sau, đúng không?

165
00:08:02,345 --> 00:08:03,720
Vì vậy, đó là tất cả chức năng này không.

166
00:08:03,720 --> 00:08:07,670
Khi tôi nhấp vào nút này, nó
bật lên một thông điệp cảnh báo với tôi.

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

168
00:08:13,806 --> 00:08:15,690
Vì vậy, có thực sự không
quá nhiều chức năng

169
00:08:15,690 --> 00:08:19,110
đó là khác nhau từ PHP,
chỉ một chút cú pháp mới

170
00:08:19,110 --> 00:08:22,500
mà đi kèm với làm việc với JavaScript.

171
00:08:22,500 --> 00:08:24,650
>> Mảng trong JavaScript
khá đơn giản.

172
00:08:24,650 --> 00:08:27,200
Để khai báo một mảng, bạn sử dụng
cú pháp dấu ngoặc vuông

173
00:08:27,200 --> 00:08:30,090
mà chúng ta đã quen thuộc với từ PHP.

174
00:08:30,090 --> 00:08:33,432
Và tương tự như PHP, chúng tôi
cũng có thể kết hợp nhiều loại dữ liệu.

175
00:08:33,432 --> 00:08:35,140
Vì vậy, mảng này, cả hai
các mảng sẽ

176
00:08:35,140 --> 00:08:36,960
có JavaScript hoàn toàn hợp pháp.

177
00:08:36,960 --> 00:08:42,500
Một trong đó là tất cả các số nguyên, và một trong đó
được trộn lẫn các loại dữ liệu khác nhau.

178
00:08:42,500 --> 00:08:45,020
>> Một cái gì đó rất khác nhau là gì
trong JavaScript, mặc dù?

179
00:08:45,020 --> 00:08:47,020
Đó là quan điểm của một đối tượng.

180
00:08:47,020 --> 00:08:50,240
Vì vậy, có lẽ bạn đã nghe nói về
lập trinh Hương đôi tượng.

181
00:08:50,240 --> 00:08:53,370
Chúng tôi không làm rất nhiều của nó trong CS50,
nhưng chúng tôi sẽ làm một chút ít của nó

182
00:08:53,370 --> 00:08:55,670
ở đây trong bối cảnh của JavaScript.

183
00:08:55,670 --> 00:08:59,100
Bây giờ JavaScript có khả năng
hành xử như một lập trình hướng đối tượng

184
00:08:59,100 --> 00:09:02,615
ngôn ngữ, nhưng nó không phải là bản thân
riêng một đối tượng theo định hướng

185
00:09:02,615 --> 00:09:03,490
ngôn ngữ lập trình.

186
00:09:03,490 --> 00:09:05,281
Và điều này lại một lần nữa
trở lại lý do tại sao tôi đã nói, nó

187
00:09:05,281 --> 00:09:10,610
có thể rất khó khăn để tìm hiểu
JavaScript là lập trình đầu tiên của bạn

188
00:09:10,610 --> 00:09:13,890
ngôn ngữ, bởi vì nó không
thực sự phù hợp với một mô hình cụ thể.

189
00:09:13,890 --> 00:09:16,430
>> C trên mặt khác là một
ngôn ngữ lập trình chức năng.

190
00:09:16,430 --> 00:09:22,270
Nếu chúng ta muốn, chức năng này
sắp xếp của người đàn ông ông chủ lớn, phải không?

191
00:09:22,270 --> 00:09:24,410
Họ ra lệnh gì
xảy ra mọi thứ khác.

192
00:09:24,410 --> 00:09:26,600
Chúng tôi muốn thay đổi các biến,
chúng ta gọi hàm.

193
00:09:26,600 --> 00:09:28,220
Chúng tôi làm việc với chức năng.

194
00:09:28,220 --> 00:09:31,250
Các đối tượng thay vào đó, trong một
phản đối ngôn ngữ hướng,

195
00:09:31,250 --> 00:09:35,937
các đối tượng loại trở thành ngôi sao và
chức năng trở thành loại thứ cấp.

196
00:09:35,937 --> 00:09:38,270
Nhưng một đối tượng, là những gì những gì
là khái niệm về một đối tượng?

197
00:09:38,270 --> 00:09:40,880
Vâng, nếu nó giúp, suy nghĩ
về nó ở trước sắp xếp

198
00:09:40,880 --> 00:09:44,540
giống như một cấu trúc C hoặc một cấu trúc
mà chúng tôi đã học được về trước.

199
00:09:44,540 --> 00:09:47,430
Trong C, một cấu trúc chứa
một số lĩnh vực,

200
00:09:47,430 --> 00:09:51,174
và có lẽ bây giờ chúng ta có thể bắt đầu
gọi những lĩnh vực bất động sản.

201
00:09:51,174 --> 00:09:53,590
Nhưng các đặc tính không bao giờ thực sự
đứng trên riêng của họ, phải không?

202
00:09:53,590 --> 00:09:56,410
Nếu tôi xác định một cơ cấu cho một chiếc xe
như thế này với hai sau đây

203
00:09:56,410 --> 00:10:00,750
trường hoặc thuộc tính, một trong một
số nguyên cho năm của xe

204
00:10:00,750 --> 00:10:04,290
và một nhân vật 10
chuỗi cho mô hình của chiếc xe,

205
00:10:04,290 --> 00:10:07,150
Tôi có thể nói một cái gì đó như thế này,
Tôi có thể khai báo một biến mới

206
00:10:07,150 --> 00:10:10,080
cấu trúc kiểu xe herbie.

207
00:10:10,080 --> 00:10:13,730
Và sau đó tôi có thể nói điều gì đó
như herbie.year bằng 1,963,

208
00:10:13,730 --> 00:10:15,850
và herbie.model bằng Beetle.

209
00:10:15,850 --> 00:10:17,000
Vậy là được rồi.

210
00:10:17,000 --> 00:10:19,680
Tôi đang sử dụng các trường trong
bối cảnh của kết cấu,

211
00:10:19,680 --> 00:10:22,290
nhưng tôi có thể không bao giờ chỉ
nói một cái gì đó như thế này.

212
00:10:22,290 --> 00:10:22,790
Bên phải?

213
00:10:22,790 --> 00:10:26,836
Tôi không thể sử dụng tên trường
độc lập của cấu trúc.

214
00:10:26,836 --> 00:10:28,210
Đó là loại một điều cơ bản.

215
00:10:28,210 --> 00:10:32,990
>> Vì vậy, các lĩnh vực được
cơ bản để cấu trúc C

216
00:10:32,990 --> 00:10:39,050
rất giống với tài sản là
cơ bản cho các đối tượng JavaScript.

217
00:10:39,050 --> 00:10:42,080
Nhưng những gì làm cho họ
đặc biệt thú vị

218
00:10:42,080 --> 00:10:46,230
là đối tượng cũng có thể có những gì
được gọi là phương pháp, mà là thực sự

219
00:10:46,230 --> 00:10:50,730
chỉ một từ ưa thích cho các chức năng mà
là vốn cho các đối tượng là tốt.

220
00:10:50,730 --> 00:10:55,340
Vì vậy, nó là một chức năng mà chỉ có thể được
gọi là trong bối cảnh của một đối tượng.

221
00:10:55,340 --> 00:10:59,200
Chỉ có một đối tượng mà đã được xác định
Chức năng này bên trong của nó,

222
00:10:59,200 --> 00:11:02,020
nếu bạn nghĩ về một
cấu trúc, chức năng

223
00:11:02,020 --> 00:11:05,720
được định nghĩa bên trong những định nghĩa
niềng răng nhọn của cấu trúc.

224
00:11:05,720 --> 00:11:07,980
Vì vậy, nó chỉ có nghĩa là một cái gì đó
để cấu trúc.

225
00:11:07,980 --> 00:11:10,960
Và đó là sắp xếp của những gì chúng ta đang làm
ở đây với các đối tượng và phương pháp.

226
00:11:10,960 --> 00:11:13,580
Đó là cơ bản giống như chúng tôi
xác định một chức năng mà

227
00:11:13,580 --> 00:11:16,670
chỉ có ý nghĩa trên
đối tượng cụ thể, và vì vậy chúng tôi

228
00:11:16,670 --> 00:11:19,440
gọi đó là một phương thức của đối tượng.

229
00:11:19,440 --> 00:11:23,180
Và chúng ta không bao giờ có thể gọi đó
chức năng độc lập của các đối tượng,

230
00:11:23,180 --> 00:11:29,260
giống như chúng ta không thể nói năm hoặc mô hình
độc lập của các struct trong C.

231
00:11:29,260 --> 00:11:32,300
>> Vì vậy, lập trình chức năng
mô hình giống như thế này.

232
00:11:32,300 --> 00:11:35,450
Chức năng và sau đó khi bạn vượt qua
trong đối tượng như một tham số.

233
00:11:35,450 --> 00:11:38,650
Trong một lập trình hướng đối tượng
ngôn ngữ, loại này được

234
00:11:38,650 --> 00:11:43,464
lộn, và chúng tôi sẽ suy nghĩ về
nó như thế này, object.function.

235
00:11:43,464 --> 00:11:45,380
Vì vậy, nó loại dấu chấm đó
nhà điều hành lại ngụ ý

236
00:11:45,380 --> 00:11:49,540
rằng nó là một số loại tài sản
hoặc thuộc tính của đối tượng đó.

237
00:11:49,540 --> 00:11:53,240
Nhưng đây là những gì một đối tượng
ngôn ngữ lập trình hướng

238
00:11:53,240 --> 00:11:57,150
có thể làm để làm cho một chức năng
gọi về một phương pháp, một lần nữa, mà

239
00:11:57,150 --> 00:12:00,260
chỉ là một từ đặc biệt cho một chức năng
đó là vốn có để một đối tượng.

240
00:12:00,260 --> 00:12:03,440
Đây là những gì mà
cú pháp có thể trông như thế nào.

241
00:12:03,440 --> 00:12:09,360
Và như vậy chúng ta sẽ bắt đầu thấy một số
này trong bối cảnh của JavaScript.

242
00:12:09,360 --> 00:12:12,470
>> Bạn cũng có thể nghĩ về một đối tượng
loại giống như một mảng kết hợp,

243
00:12:12,470 --> 00:12:14,160
mà chúng ta đã quen thuộc với từ PHP.

244
00:12:14,160 --> 00:12:17,720
Ghi một mảng liên kết cho phép
chúng ta có các cặp giá trị quan trọng, thay vì

245
00:12:17,720 --> 00:12:23,040
của việc có chỉ số 0, một, hai, ba,
và như vậy giống như chúng ta đang sử dụng để từ C

246
00:12:23,040 --> 00:12:23,940
mảng.

247
00:12:23,940 --> 00:12:27,472
Mảng kết hợp có thể bản đồ
từ, như trong video PHP,

248
00:12:27,472 --> 00:12:29,180
chúng tôi đã nói về
toppings pizza.

249
00:12:29,180 --> 00:12:31,180
Và vì vậy chúng tôi đã có một mảng
gọi pizza, và chúng tôi

250
00:12:31,180 --> 00:12:36,670
có pho mát là một chìa khóa và 8,99 $ là
giá trị, và sau đó pepperoni là một chìa khóa,

251
00:12:36,670 --> 00:12:39,190
9,99 $ là một giá trị, và như vậy.

252
00:12:39,190 --> 00:12:43,300
Và như vậy chúng ta cũng có thể nghĩ về một
phản đối loại tương tự như một liên kết

253
00:12:43,300 --> 00:12:43,840
mảng.

254
00:12:43,840 --> 00:12:47,020
Và do đó, cú pháp này ở đây
sẽ tạo ra một đối tượng mới

255
00:12:47,020 --> 00:12:50,950
gọi herbie với hai
tính chất bên trong của nó.

256
00:12:50,950 --> 00:12:57,310
Năm, mà được gán giá trị năm 1963,
và mô hình, mà được gán chuỗi

257
00:12:57,310 --> 00:12:58,140
Beetle.

258
00:12:58,140 --> 00:13:01,770
>> Và hãy chú ý ở đây mà tôi đang sử dụng
dấu ngoặc đơn trong JavaScript.

259
00:13:01,770 --> 00:13:05,570
Bạn có thể sử dụng dấu ngoặc đơn hoặc kép
khi bạn đang nói về chuỗi.

260
00:13:05,570 --> 00:13:07,772
Nó chỉ là quy ước
những trường hợp đó hầu hết các lần

261
00:13:07,772 --> 00:13:10,230
khi bạn đang viết JavaScript,
bạn chỉ cần sử dụng dấu nháy đơn.

262
00:13:10,230 --> 00:13:15,050
Nhưng tôi có thể sử dụng dấu ngoặc kép ở đây, và
đó sẽ là hoàn toàn tốt đẹp là tốt.

263
00:13:15,050 --> 00:13:17,470
>> Vì vậy, hãy nhớ làm thế nào trong
PHP chúng ta có khái niệm này

264
00:13:17,470 --> 00:13:22,730
một cho mỗi vòng lặp mà sẽ cho phép chúng tôi
để lặp qua tất cả các giá trị quan trọng

265
00:13:22,730 --> 00:13:25,270
cặp của một liên kết
mảng, bởi vì chúng tôi

266
00:13:25,270 --> 00:13:29,050
không có khả năng này để lặp
qua 0, một, hai, ba, bốn,

267
00:13:29,050 --> 00:13:30,710
và như vậy?

268
00:13:30,710 --> 00:13:35,010
JavaScript có một cái gì đó rất giống nhau,
nhưng nó không được gọi là một cho mỗi vòng lặp,

269
00:13:35,010 --> 00:13:38,960
nó được gọi là một định trong vòng.

270
00:13:38,960 --> 00:13:42,890
Vì vậy, nếu tôi nói với tôi như
này, cho var quan trọng trong đối tượng,

271
00:13:42,890 --> 00:13:48,670
đó là loại tương tự để nói
cho mỗi một cái gì đó như là một cái gì đó.

272
00:13:48,670 --> 00:13:53,850
Nhưng tất cả tôi đang làm ở đây được lặp
qua tất cả các chìa khóa của đối tượng của tôi.

273
00:13:53,850 --> 00:13:56,070
Và bên trong của xoăn
niềng răng ở đó, tôi sẽ

274
00:13:56,070 --> 00:14:03,410
đối tượng sử dụng dấu ngoặc vuông chìa khóa để tham khảo
với giá trị ở vị trí chủ chốt.

275
00:14:03,410 --> 00:14:05,400
>> Ngoài ra, có
thậm chí một cách tiếp cận.

276
00:14:05,400 --> 00:14:10,880
Nếu tôi chỉ chỉ quan tâm đến
giá trị, tôi có thể nói cho chính các đối tượng,

277
00:14:10,880 --> 00:14:12,360
và chỉ cần sử dụng chìa khóa bên trong.

278
00:14:12,360 --> 00:14:17,240
Vì vậy, cho var quan trọng trong đối tượng, tôi có
sử dụng đối tượng dấu ngoặc vuông

279
00:14:17,240 --> 00:14:19,340
chìa khóa bên trong vòng lặp.

280
00:14:19,340 --> 00:14:24,580
Đối với var quan trọng của đối tượng, tôi có thể
chỉ cần sử dụng chìa khóa bên trong vòng lặp,

281
00:14:24,580 --> 00:14:29,040
bởi vì anh chỉ cụ thể
nói về các giá trị đó.

282
00:14:29,040 --> 00:14:32,630
>> Vì vậy, chúng ta hãy có lẽ phải mất một
nhìn vào sự khác biệt

283
00:14:32,630 --> 00:14:35,670
chỉ để nhanh chóng chỉ cho bạn
sự khác biệt giữa bốn

284
00:14:35,670 --> 00:14:40,730
trong và cho các với rất cụ thể
mảng, mà chúng ta có ở đây, mảng tuần.

285
00:14:40,730 --> 00:14:43,616
Vì vậy, tôi phải tìm một mảng mới
mà tôi đầy bảy dây,

286
00:14:43,616 --> 00:14:46,240
Thứ hai thứ ba thứ tư,
Thứ năm, thứ sáu, thứ bảy, chủ nhật.

287
00:14:46,240 --> 00:14:50,530
Và tôi muốn bây giờ lặp
qua mảng này,

288
00:14:50,530 --> 00:14:53,090
in ra thông tin nhất định.

289
00:14:53,090 --> 00:14:58,780
Nếu tôi sử dụng một cho trong vòng lặp
để in ra thông tin,

290
00:14:58,780 --> 00:15:00,710
điều gì làm bạn nghĩ rằng tôi sẽ nhận được?

291
00:15:00,710 --> 00:15:01,710
Vâng, chúng ta hãy có một cái nhìn.

292
00:15:01,710 --> 00:15:05,300
Và trước khi chúng tôi nhảy qua
vào cửa sổ trình duyệt của tôi,

293
00:15:05,300 --> 00:15:08,090
chỉ biết rằng
console.log là sắp xếp của một

294
00:15:08,090 --> 00:15:10,630
cách làm một F in trong JavaScript.

295
00:15:10,630 --> 00:15:12,040
Nhưng giao diện điều khiển là gì?

296
00:15:12,040 --> 00:15:14,940
Vâng, đó là những gì chúng ta đang đi
đi hãy xem ngay bây giờ.

297
00:15:14,940 --> 00:15:16,850
>> OK, vì vậy chúng tôi đang trở lại đây
trong cửa sổ trình duyệt của tôi,

298
00:15:16,850 --> 00:15:19,410
và tôi sẽ mở
lên các công cụ phát triển của tôi.

299
00:15:19,410 --> 00:15:22,290
Một lần nữa, tôi chỉ cần nhấn F12
để mở ra các công cụ phát triển.

300
00:15:22,290 --> 00:15:25,670
Và nhận thấy rằng đây tại
đầu tôi đã chọn giao diện điều khiển.

301
00:15:25,670 --> 00:15:28,480
Vì vậy, đây là khái niệm
của một giao diện điều khiển phát triển,

302
00:15:28,480 --> 00:15:30,500
và nó sẽ cho phép chúng tôi
in thông tin ra ngoài,

303
00:15:30,500 --> 00:15:33,000
loại giống như các thiết bị đầu cuối, nhưng
như bạn sẽ thấy một chút sau,

304
00:15:33,000 --> 00:15:37,720
chúng ta cũng có thể gõ thông tin trong
để tương tác với trang web của chúng tôi.

305
00:15:37,720 --> 00:15:42,320
Tôi sẽ để phóng to một chút ở đây,
và tôi sẽ bây giờ click vào để vào kiểm tra.

306
00:15:42,320 --> 00:15:45,230
Và bốn trong test-- Tôi sẽ không
hiển thị cho bạn mã số cho nó ngay bây giờ,

307
00:15:45,230 --> 00:15:47,479
nhưng bạn sẽ có được nó nếu bạn
tải về mã nguồn

308
00:15:47,479 --> 00:15:50,380
được liên kết với video-- này
Chỉ là để trong vòng lặp là

309
00:15:50,380 --> 00:15:52,610
mà chúng ta thấy chỉ là một
trước thứ hai trên slide.

310
00:15:52,610 --> 00:15:54,810
>> Vì vậy, tôi sẽ bấm vào đó
nút, và qua đây,

311
00:15:54,810 --> 00:15:58,440
đây là những gì đã in ra trong
giao diện điều khiển, 0, một, hai, ba, bốn, năm,

312
00:15:58,440 --> 00:15:58,940
sáu.

313
00:15:58,940 --> 00:16:02,490
Tôi đã không in ra thông tin
bên trong những địa điểm mảng,

314
00:16:02,490 --> 00:16:05,180
bởi vì tôi đã sử dụng một cho trong vòng lặp.

315
00:16:05,180 --> 00:16:10,670
Và bên trong thân của vòng lặp, tôi
chỉ in ra chìa khóa không phản đối quan trọng.

316
00:16:10,670 --> 00:16:18,600
Nhưng nếu bây giờ tôi xóa giao diện điều khiển của tôi, và tôi
chuyển sang cho các bài kiểm tra, và bốn thử nghiệm

317
00:16:18,600 --> 00:16:22,500
Tôi nói tôi sử dụng cho vòng lặp
thay vào đó và in ra chìa khóa,

318
00:16:22,500 --> 00:16:28,079
nếu tôi nhấp vào đó, bây giờ tôi nhận được
các yếu tố thực tế bên trong của đối tượng của tôi

319
00:16:28,079 --> 00:16:29,120
hoặc mảng của tôi trong trường hợp này.

320
00:16:29,120 --> 00:16:31,760
Mảng của tôi về các ngày trong tuần.

321
00:16:31,760 --> 00:16:33,480
Tôi in ra thứ hai,
Thứ ba thứ tư.

322
00:16:33,480 --> 00:16:36,930
Vì vậy, đó là sự khác biệt giữa
một cho trong vòng lặp, trong đó in ra

323
00:16:36,930 --> 00:16:43,410
chỉ các phím nếu bạn chỉ sử dụng phím
bên trong cơ thể của vòng lặp,

324
00:16:43,410 --> 00:16:46,850
và một cho các vòng lặp, mà bản in
ra các giá trị nếu bạn sử dụng chỉ

325
00:16:46,850 --> 00:16:48,870
chính bên trong cơ thể của vòng lặp.

326
00:16:48,870 --> 00:16:52,380
>> Tất cả các quyền, làm thế nào bây giờ chúng ta bắt đầu
nối dây và có thể trộn lên

327
00:16:52,380 --> 00:16:57,220
một số biến với nội suy
như chúng tôi có thể làm gì trong PHP?

328
00:16:57,220 --> 00:16:59,410
Vâng, chúng tôi đang khá quen thuộc
với điều này từ PHP.

329
00:16:59,410 --> 00:17:04,109
Đây là cách chúng tôi sẽ làm điều đó bằng cách sử dụng
dot điều hành để nối dây.

330
00:17:04,109 --> 00:17:06,260
Trong JavaScript, mặc dù,
chúng tôi thực sự sử dụng một cái gì đó

331
00:17:06,260 --> 00:17:09,290
được gọi là các nhà điều hành cộng, mà
là có thể nhiều hơn ngay cả một chút

332
00:17:09,290 --> 00:17:10,470
trực quan, phải không?

333
00:17:10,470 --> 00:17:12,609
Chúng tôi đang thêm một bó
các dây với nhau.

334
00:17:12,609 --> 00:17:14,520
Vì vậy, chúng ta hãy quay trở lại
trên và xem những gì này

335
00:17:14,520 --> 00:17:18,693
sẽ in nếu chúng ta đang cố gắng để in ra
tất cả các thông tin trong mảng tuần.

336
00:17:18,693 --> 00:17:20,859
Được rồi, như vậy dưới đây
dưới nối chuỗi,

337
00:17:20,859 --> 00:17:24,822
Tôi có hai lựa chọn, xây dựng chuỗi
V1 và sau đó xây dựng chuỗi V2.

338
00:17:24,822 --> 00:17:26,530
Và chúng ta sẽ thấy lý do tại sao chúng tôi
cần V2 trong một giây.

339
00:17:26,530 --> 00:17:28,610
Nhưng tôi sẽ click vào
chuỗi tòa V1, mà

340
00:17:28,610 --> 00:17:30,360
là mã chúng tôi
chỉ cần lấy một cái nhìn tại,

341
00:17:30,360 --> 00:17:32,980
các console.log với tất cả những ưu điểm.

342
00:17:32,980 --> 00:17:35,910
Hãy xem nếu bản in này
ra những gì chúng tôi mong đợi.

343
00:17:35,910 --> 00:17:39,939
>> Thứ hai là ngày thứ 01 của tuần,
Thứ ba là ngày thứ 11 của tuần.

344
00:17:39,939 --> 00:17:41,730
Vâng, những gì tôi đã cố gắng
phải làm là có được

345
00:17:41,730 --> 00:17:46,280
nó để in ra thứ hai là số lượng ngày
một, thứ ba là ngày thứ hai.

346
00:17:46,280 --> 00:17:50,140
Nhưng có vẻ như tôi là
luôn in ra một.

347
00:17:50,140 --> 00:17:51,260
Vâng, tại sao vậy?

348
00:17:51,260 --> 00:17:55,600
Vâng, nó quay ra, một cái nhìn khác
ở đoạn này ít mã ở đây.

349
00:17:55,600 --> 00:18:00,160
Chú ý rằng chúng ta đang sử dụng các cộng
nhà điều hành trong hai hoàn cảnh khác nhau.

350
00:18:00,160 --> 00:18:03,221
>> Và do đó, đây là nơi mà có lẽ mọi thứ
mà chúng tôi đã loại được nói,

351
00:18:03,221 --> 00:18:03,970
oh, nó tuyệt vời như vậy.

352
00:18:03,970 --> 00:18:05,910
Chúng tôi không đối phó với các loại dữ liệu nữa.

353
00:18:05,910 --> 00:18:08,220
Nhưng đây là nơi mà thực tế
chúng ta mất đi các kiểu dữ liệu

354
00:18:08,220 --> 00:18:10,960
thực sự có thể là một chút
của một vấn đề đối với chúng tôi.

355
00:18:10,960 --> 00:18:16,260
Bây giờ các nhà điều hành cộng được sử dụng để
ghép các chuỗi và thêm số

356
00:18:16,260 --> 00:18:19,550
với nhau, JavaScript có
để làm cho dự đoán tốt nhất của mình

357
00:18:19,550 --> 00:18:22,030
như những gì tôi muốn nó làm cho tôi.

358
00:18:22,030 --> 00:18:23,900
Và trong trường hợp này, nó đoán sai.

359
00:18:23,900 --> 00:18:29,340
Nó ngày chỉ cần kết nối, đó sẽ là
0, một, hai, ba, bốn, năm, sáu,

360
00:18:29,340 --> 00:18:32,060
và sau đó nó chỉ nối
đó và sau đó nối một.

361
00:18:32,060 --> 00:18:35,020
Nó không thực sự gắn chúng lại với nhau.

362
00:18:35,020 --> 00:18:37,320
Và do đó, những ngôn ngữ,
PHP và JavaScript,

363
00:18:37,320 --> 00:18:39,196
mà tóm tắt đi
khái niệm này của các loại,

364
00:18:39,196 --> 00:18:40,820
bạn không phải đối phó với nó nữa.

365
00:18:40,820 --> 00:18:43,600
Họ vẫn có loại dưới mui xe.

366
00:18:43,600 --> 00:18:46,780
Và chúng ta có thể, trong những tình huống
như thế này, tận dụng thực tế là

367
00:18:46,780 --> 00:18:49,240
bằng cách nói một cái gì đó
như có lẽ này, mà

368
00:18:49,240 --> 00:18:53,210
là nói JavaScript, do
cách, coi đây là một số nguyên,

369
00:18:53,210 --> 00:18:57,100
không đối xử với nó như một chuỗi, thậm chí
mặc dù chúng tôi đang trộn cùng dây

370
00:18:57,100 --> 00:18:58,940
và số nguyên ở đây.

371
00:18:58,940 --> 00:19:02,204
>> Nó chỉ là một trong những điều
rằng nó có vẻ tuyệt vời như vậy trong bối cảnh

372
00:19:02,204 --> 00:19:04,120
rằng chúng ta không cần phải
đối phó với các loại nữa,

373
00:19:04,120 --> 00:19:05,828
nhưng đôi khi bạn sẽ thấy
chạy vào một tình huống

374
00:19:05,828 --> 00:19:09,110
chính xác như thế này mà thực tế là
bạn không có quyền kiểm soát đối với các loại

375
00:19:09,110 --> 00:19:11,220
có thể backfire về bạn
nếu bạn không cẩn thận.

376
00:19:11,220 --> 00:19:18,285
Và như vậy, nếu chúng ta bật lại qua IDE, tôi
sẽ rõ ràng trong giao diện điều khiển của tôi một lần nữa,

377
00:19:18,285 --> 00:19:20,660
và tôi sẽ bấm chuỗi
xây dựng phiên bản hai, trong đó

378
00:19:20,660 --> 00:19:23,052
là nơi mà tôi sử dụng chức năng phân tích cú pháp int.

379
00:19:23,052 --> 00:19:25,260
Bây giờ nó in ra
thông tin mà tôi đang mong đợi.

380
00:19:25,260 --> 00:19:29,330
Số ngày một ngày thứ Hai, thứ Ba
là ngày thứ hai, và như vậy.

381
00:19:29,330 --> 00:19:31,170
>> Vì vậy, chúng ta hãy nói về chức năng một lần nữa.

382
00:19:31,170 --> 00:19:34,790
Tôi đã hứa với chúng tôi sẽ nói về vô danh
chức năng, và bây giờ bối cảnh cho rằng

383
00:19:34,790 --> 00:19:36,360
cuối cùng cũng đã đến.

384
00:19:36,360 --> 00:19:39,980
Vì vậy, trước khi chúng tôi làm như vậy, chúng ta hãy nói chuyện một lần nữa
về mảng cho chỉ một giây.

385
00:19:39,980 --> 00:19:42,120
Vì vậy, mảng là một đặc biệt
trường hợp của một đối tượng.

386
00:19:42,120 --> 00:19:45,180
Trong thực tế, tất cả mọi thứ trong
JavaScript thực sự là một đối tượng.

387
00:19:45,180 --> 00:19:47,190
Vì vậy, chức năng này là một
trường hợp đặc biệt của một đối tượng,

388
00:19:47,190 --> 00:19:49,770
số nguyên là một đặc biệt
trường hợp của một đối tượng,

389
00:19:49,770 --> 00:19:52,152
nhưng mảng cụ thể
có một số phương pháp.

390
00:19:52,152 --> 00:19:55,110
Ghi vì họ đang đối tượng,
họ có thể có các thuộc tính và phương pháp.

391
00:19:55,110 --> 00:19:58,600
Họ có một số phương pháp
có thể được áp dụng cho các đối tượng.

392
00:19:58,600 --> 00:20:01,197
Có một phương pháp gọi là
kích thước, array.size,

393
00:20:01,197 --> 00:20:03,030
sẽ trở về
bạn như bạn mong đợi

394
00:20:03,030 --> 00:20:05,120
số phần tử trong mảng của bạn.

395
00:20:05,120 --> 00:20:08,480
array.pop, loại giống như
khái niệm của chúng ta về popping off

396
00:20:08,480 --> 00:20:11,110
của một chồng, nếu bạn gọi lại
từ ngăn xếp của chúng tôi video,

397
00:20:11,110 --> 00:20:13,810
loại bỏ các yếu tố cuối cùng từ mảng.

398
00:20:13,810 --> 00:20:17,110
Array.push thêm một yếu tố mới
đến cuối mảng.

399
00:20:17,110 --> 00:20:20,910
array.shift là loại
như DQ, nó splices ra

400
00:20:20,910 --> 00:20:23,610
các yếu tố đầu tiên của một mảng.

401
00:20:23,610 --> 00:20:27,549
>> Nhưng cũng có một đặc biệt
phương pháp của một mảng được gọi là bản đồ.

402
00:20:27,549 --> 00:20:29,340
Và đây là loại một
khái niệm thú vị.

403
00:20:29,340 --> 00:20:30,930
Vì vậy, ý tưởng về một bản đồ là gì?

404
00:20:30,930 --> 00:20:33,880
Bạn thực sự sẽ thấy điều này
trong một số ngôn ngữ khác,

405
00:20:33,880 --> 00:20:38,550
và chúng tôi không nói về một
sắp xếp của nhà vẽ bản đồ bản đồ ở đây,

406
00:20:38,550 --> 00:20:41,480
chúng ta đang nói về một chức năng lập bản đồ.

407
00:20:41,480 --> 00:20:44,110
Trong bối cảnh chúng tôi
nói ở đây, một bản đồ

408
00:20:44,110 --> 00:20:47,950
là một hoạt động chúng tôi đặc biệt
có thể thực hiện trên một mảng

409
00:20:47,950 --> 00:20:51,630
để áp dụng một chức năng cụ thể
để mọi phần tử của mảng đó.

410
00:20:51,630 --> 00:20:55,190
và vì vậy chúng tôi sẽ nói trong
trường hợp này, có lẽ array.map,

411
00:20:55,190 --> 00:21:00,330
và bên trong của nó, chúng tôi đang đi qua
vào bản đồ là một chức năng mà chúng ta muốn

412
00:21:00,330 --> 00:21:02,430
được áp dụng cho tất cả các yếu tố duy nhất.

413
00:21:02,430 --> 00:21:07,299
Vì vậy, nó là loại tương tự để sử dụng
một vòng lặp để duyệt qua mọi phần tử

414
00:21:07,299 --> 00:21:09,340
và áp dụng một đặc biệt
chức năng để mọi yếu tố,

415
00:21:09,340 --> 00:21:14,830
chỉ JavaScript đã được xây dựng trong
khái niệm về một bản đồ có thể được áp dụng.

416
00:21:14,830 --> 00:21:19,700
Và đây là một bối cảnh tuyệt vời để
nói về một chức năng vô danh.

417
00:21:19,700 --> 00:21:22,370
>> Vì vậy, chúng ta hãy nói rằng chúng ta có
mảng này của các số nguyên.

418
00:21:22,370 --> 00:21:25,370
Nó được gọi là nums, và nó có năm
thứ trong đó, một, hai, ba, bốn,

419
00:21:25,370 --> 00:21:26,410
năm.

420
00:21:26,410 --> 00:21:30,620
Bây giờ tôi muốn một số bản đồ
chức năng trên vào mảng này.

421
00:21:30,620 --> 00:21:34,337
Tôi muốn có một chức năng áp dụng
để mọi phần tử của mảng.

422
00:21:34,337 --> 00:21:37,420
Vâng, chúng ta hãy nói rằng những gì tôi muốn
làm là chỉ cần tăng gấp đôi tất cả các yếu tố.

423
00:21:37,420 --> 00:21:42,520
Những gì tôi có thể làm là chỉ cần sử dụng một vòng lặp
var cho tôi bằng 0, tôi là ít hơn

424
00:21:42,520 --> 00:21:47,390
hoặc bằng 4, tôi cộng, cộng thêm, và
sau đó tăng gấp đôi mỗi số duy nhất.

425
00:21:47,390 --> 00:21:49,580
Nhưng tôi cũng có thể làm một cái gì đó như thế này.

426
00:21:49,580 --> 00:21:53,420
Tôi có thể nói nums là trước đây
một hai ba bốn năm,

427
00:21:53,420 --> 00:21:58,310
bây giờ, mặc dù, tôi sẽ như bạn để
áp dụng một ánh xạ vào mảng này

428
00:21:58,310 --> 00:22:00,400
mà tôi muốn bạn
tăng gấp đôi mỗi số.

429
00:22:00,400 --> 00:22:02,540
Và đó là chính xác
những gì đang xảy ra ở đây.

430
00:22:02,540 --> 00:22:06,870
Nhưng cần chú ý những gì tôi đang đi qua
trong như là đối số để lập bản đồ.

431
00:22:06,870 --> 00:22:09,080
Đây là một chức năng vô danh.

432
00:22:09,080 --> 00:22:11,140
Và nhận thấy tôi đã không cho
Chức năng này một cái tên,

433
00:22:11,140 --> 00:22:13,290
Tôi đã chỉ cho nó một danh sách tham số.

434
00:22:13,290 --> 00:22:16,370
Và vì vậy đây là một ví dụ
của một chức năng vô danh.

435
00:22:16,370 --> 00:22:21,270
>> Chúng tôi thường sẽ không bao giờ gọi này
chức năng bên ngoài bối cảnh của bản đồ.

436
00:22:21,270 --> 00:22:24,110
Chúng tôi đang xác định nó như là một tham số
bản đồ, và vì vậy chúng tôi không thực sự

437
00:22:24,110 --> 00:22:27,910
cần phải có một tên cho nó, nếu người
Điều duy nhất mà quan tâm là bản đồ

438
00:22:27,910 --> 00:22:30,339
và nó được xác định đúng
có bên trong của bản đồ.

439
00:22:30,339 --> 00:22:31,880
Và vì vậy đây là một chức năng vô danh.

440
00:22:31,880 --> 00:22:34,680
Chúng tôi đã không thể
để làm điều này trước đây.

441
00:22:34,680 --> 00:22:38,400
Bản đồ một số chức năng mà
chấp nhận một tham số, num,

442
00:22:38,400 --> 00:22:41,890
và những gì chức năng nào
được trả về num lần 2.

443
00:22:41,890 --> 00:22:45,330
Và như vậy sau này
lập bản đồ đã được áp dụng,

444
00:22:45,330 --> 00:22:50,090
này hiện nay là gì nums vẻ
như thế, hai, bốn, sáu, tám, 10.

445
00:22:50,090 --> 00:22:52,090
Và chúng tôi sẽ bật lên để tôi
cửa sổ trình duyệt và chỉ

446
00:22:52,090 --> 00:22:55,240
hãy xem này
thực sự nhanh càng tốt.

447
00:22:55,240 --> 00:22:58,000
>> Vì vậy, tôi có một nút khác ở đây
tại trang chủ của tôi gọi là gấp đôi.

448
00:22:58,000 --> 00:23:03,570
Và khi tôi nhấp đúp, và nó nói
tôi trước khi nó được một, hai, ba, bốn,

449
00:23:03,570 --> 00:23:07,250
năm sau khi hai, bốn, sáu, tám, 10.

450
00:23:07,250 --> 00:23:11,930
Và nếu tôi quay lại và nhấp đúp
một lần nữa, hai, bốn, sáu, tám, 10.

451
00:23:11,930 --> 00:23:17,400
Và rồi sau đó, bốn,
tám, 12, 16, và sau đó 20.

452
00:23:17,400 --> 00:23:20,440
Và những gì tôi làm trong chức năng này?

453
00:23:20,440 --> 00:23:25,210
Vâng, nếu chúng ta chỉ cần bật qua IDE, và
Tôi kéo lên chức năng ẩn danh của tôi, ở đây

454
00:23:25,210 --> 00:23:28,780
trên đường từ bảy đến 13, tôi
làm một công việc ưa thích chút chút ở đây,

455
00:23:28,780 --> 00:23:32,240
nhưng tôi chỉ cần in ra
những gì hiện đang trong mảng.

456
00:23:32,240 --> 00:23:36,580
Sau đó, trên đường 16, 17,
và 18, có bản đồ của tôi.

457
00:23:36,580 --> 00:23:40,930
Đây là nơi mà tôi đang làm đơn này tăng gấp đôi
chức năng để mọi yếu tố duy nhất.

458
00:23:40,930 --> 00:23:43,530
Và sau đó một chút tiếp tục xuống,
Tôi chỉ làm những điều tương tự

459
00:23:43,530 --> 00:23:46,640
Tôi đã làm trước đây, ngoại trừ bây giờ tôi
in ra các nội dung của mảng

460
00:23:46,640 --> 00:23:48,167
sau đó.

461
00:23:48,167 --> 00:23:50,500
Nhưng tất cả tôi đã làm ở đây là
chỉ cần sử dụng một chức năng ẩn danh

462
00:23:50,500 --> 00:23:53,640
bản đồ trên một mảng toàn bộ.

463
00:23:53,640 --> 00:23:58,466
>> Vì vậy, thêm một chủ đề lớn để nói về trong
JavaScript là quan điểm của một sự kiện.

464
00:23:58,466 --> 00:24:01,590
Một sự kiện là một cái gì đó mà chỉ xảy ra
khi người dùng tương tác với các trang web của bạn

465
00:24:01,590 --> 00:24:04,715
trang, như vậy có lẽ họ bấm vào một cái gì đó,
hoặc có thể trang được tải xong,

466
00:24:04,715 --> 00:24:07,200
hoặc có thể họ đã di chuyển
chuyển chuột lên một cái gì đó,

467
00:24:07,200 --> 00:24:09,290
hoặc họ đã gõ một cái gì đó
trong một trường đầu vào.

468
00:24:09,290 --> 00:24:14,260
Tất cả những điều này là sự kiện
mà đang xảy ra trên trang web của chúng tôi.

469
00:24:14,260 --> 00:24:17,460
Và JavaScript có
khả năng hỗ trợ một cái gì đó

470
00:24:17,460 --> 00:24:21,760
được gọi là một xử lý sự kiện, mà
là một chức năng gọi lại đó

471
00:24:21,760 --> 00:24:23,329
đáp ứng một sự kiện html.

472
00:24:23,329 --> 00:24:24,620
Và một chức năng gọi là gì?

473
00:24:24,620 --> 00:24:27,328
Vâng, nó thường chỉ khác
đặt tên cho một chức năng vô danh.

474
00:24:27,328 --> 00:24:30,170
Đó là một chức năng mà
đáp ứng một sự kiện.

475
00:24:30,170 --> 00:24:34,130
Và đây là nơi mà chúng ta đến với
ý tưởng của ràng buộc chức năng nhất định

476
00:24:34,130 --> 00:24:38,060
một thuộc tính html đặc biệt.

477
00:24:38,060 --> 00:24:41,420
Hầu hết các yếu tố html
hỗ trợ cho một thuộc tính

478
00:24:41,420 --> 00:24:45,170
rằng chúng ta không nói về trong html
video cho một cái gì đó giống như trên nhấp chuột

479
00:24:45,170 --> 00:24:50,540
hoặc trên di chuột hoặc vào tải,
tất cả các sự kiện

480
00:24:50,540 --> 00:24:53,120
mà sau đó bạn có thể viết các chức năng
mà đối phó với những sự kiện

481
00:24:53,120 --> 00:24:56,090
khi những sự kiện
xảy ra trên trang web của bạn.

482
00:24:56,090 --> 00:24:59,170
>> Và như vậy có lẽ html của bạn
trông giống như thế này.

483
00:24:59,170 --> 00:25:02,240
Và tôi có hai nút ở đây,
một nút và nút hai,

484
00:25:02,240 --> 00:25:04,620
và ở đây tôi có hiện nay
không có gì được xác định,

485
00:25:04,620 --> 00:25:11,170
nhưng đây là nơi mà các thuộc tính trên
nhấp chuột là rõ ràng một phần của thẻ html của tôi.

486
00:25:11,170 --> 00:25:15,220
Vì vậy, rõ ràng khi tôi xác định những gì
xảy ra bên trong các thuộc tính đó,

487
00:25:15,220 --> 00:25:18,590
nó sẽ có một số hoạt Javascript
chức năng để ứng phó với các sự kiện

488
00:25:18,590 --> 00:25:24,360
có lẽ phải nhấn lên
nút một hoặc hai nút.

489
00:25:24,360 --> 00:25:28,580
>> Có gì loại mát mẻ về việc này là chúng tôi
có thể viết một hàm xử lý sự kiện chung chung.

490
00:25:28,580 --> 00:25:32,370
Và sự kiện này sẽ Handler
tạo ra một đối tượng sự kiện.

491
00:25:32,370 --> 00:25:37,000
Và các đối tượng sự kiện sẽ cho chúng tôi
mà trong hai nút được nhấp.

492
00:25:37,000 --> 00:25:38,064
Bây giờ làm thế nào mà làm việc?

493
00:25:38,064 --> 00:25:39,730
Vâng, nó có thể giống như thế này.

494
00:25:39,730 --> 00:25:44,860
Vì vậy, đầu tiên chúng ta sẽ định nghĩa các nút của chúng tôi
để đáp ứng với các cuộc gọi lại

495
00:25:44,860 --> 00:25:47,470
chức năng đó sẽ được gọi là
khi nút được nhấn vào,

496
00:25:47,470 --> 00:25:49,520
chúng ta sẽ gọi tên sự kiện cảnh báo.

497
00:25:49,520 --> 00:25:53,320
Và thông báo trong cả hai trường hợp chúng tôi
đi qua trong tham số sự kiện này.

498
00:25:53,320 --> 00:25:55,460
Vì vậy, chúng tôi gọi chức năng này
hoặc khi chức năng này

499
00:25:55,460 --> 00:26:00,330
được kích hoạt bởi các sự kiện xảy ra,
nó sẽ tạo ra các đối tượng sự kiện này

500
00:26:00,330 --> 00:26:03,300
và vượt qua nó như một
tham số để cảnh báo tên.

501
00:26:03,300 --> 00:26:07,270
Và đó là đối tượng sự kiện
sẽ chứa thông tin

502
00:26:07,270 --> 00:26:09,800
về những nút được nhấp.

503
00:26:09,800 --> 00:26:11,580
Và làm thế nào để nó làm điều đó?

504
00:26:11,580 --> 00:26:13,654
Vâng, nó có thể giống như thế này.

505
00:26:13,654 --> 00:26:15,570
Vì vậy, bây giờ trong riêng của tôi
Tập tin JavaScript, tôi có thể

506
00:26:15,570 --> 00:26:17,420
có để tìm kiếm này
Chức năng cảnh báo tên, mà

507
00:26:17,420 --> 00:26:19,500
một lần nữa chấp nhận rằng tham số sự kiện.

508
00:26:19,500 --> 00:26:24,640
Và sau đó ở đây là nơi mà tôi phát hiện
nút đó đã được kích hoạt,

509
00:26:24,640 --> 00:26:28,100
var kích hoạt bằng sự kiện
dot phần tử nguồn.

510
00:26:28,100 --> 00:26:33,150
Các nguồn tạo ra là gì
đối tượng này sự kiện được thông qua tại?

511
00:26:33,150 --> 00:26:36,390
Đó có phải là một nút hay là nút hai?

512
00:26:36,390 --> 00:26:40,710
>> Và sau đó ở đây tất cả tôi đang làm là
in ra trigger.innerhtml.

513
00:26:40,710 --> 00:26:43,860
Vâng, trong trường hợp này, trong này
bối cảnh, trigger.innerhtml

514
00:26:43,860 --> 00:26:45,940
chỉ là những gì được viết trên các nút.

515
00:26:45,940 --> 00:26:48,830
Nó chỉ như vậy sẽ xảy ra nếu chúng ta nhảy
lại cho một thứ hai, mà có

516
00:26:48,830 --> 00:26:51,670
được những gì trong giữa những thẻ nút.

517
00:26:51,670 --> 00:26:54,150
Nó sẽ là một nút hoặc nút hai.

518
00:26:54,150 --> 00:26:57,320
Và chúng ta hãy nhìn vào
cách xử lý sự kiện này sẽ

519
00:26:57,320 --> 00:27:01,080
xem xét nếu chúng tôi đã có nó chạy trong thực tế.

520
00:27:01,080 --> 00:27:03,850
>> Vì vậy, trước hết, bạn đã
mở ra events.js,

521
00:27:03,850 --> 00:27:06,517
đó là tập tin JavaScript nơi
Tôi đã xác định chức năng này.

522
00:27:06,517 --> 00:27:08,558
Và như bạn có thể thấy, đó là
khá nhiều chính xác những gì

523
00:27:08,558 --> 00:27:10,230
chúng ta chỉ nhìn thấy trên slide một giây trước đó.

524
00:27:10,230 --> 00:27:14,890
Và tôi sẽ đi qua để
trang nhà, chúng tôi đã sử dụng.

525
00:27:14,890 --> 00:27:17,660
Và tôi có ở đây nút
một và hai nút.

526
00:27:17,660 --> 00:27:19,820
Và tôi sẽ bấm vào một nút.

527
00:27:19,820 --> 00:27:23,930
Bạn nhấp vào nút một, nếu bạn
có thể nhìn thấy ngay ở đây trong cảnh báo.

528
00:27:23,930 --> 00:27:25,810
ĐƯỢC.

529
00:27:25,810 --> 00:27:28,980
Click vào nút hai, bạn
nhấp vào một nút hai.

530
00:27:28,980 --> 00:27:32,150
>> Vì vậy, cả hai nút có
cùng chức năng gọi, phải không?

531
00:27:32,150 --> 00:27:35,840
Cả hai đều là những tên cảnh báo
sự kiện, nhưng đối tượng sự kiện này

532
00:27:35,840 --> 00:27:41,900
mà được tạo ra khi chúng ta click vào
nó cho chúng ta nút mà được nhấp.

533
00:27:41,900 --> 00:27:44,650
Chúng tôi không phải viết hai riêng biệt
chức năng hoặc các thỏa thuận với có

534
00:27:44,650 --> 00:27:46,470
để vượt qua bất kỳ thông tin bổ sung.

535
00:27:46,470 --> 00:27:48,220
Chúng tôi chỉ dựa vào
những gì sẽ JavaScript

536
00:27:48,220 --> 00:27:53,772
làm cho chúng ta, đó là tạo ra mà
loại đối tượng sự kiện thay cho chúng ta.

537
00:27:53,772 --> 00:27:56,730
Có rất nhiều chi tiết để Javascript hơn
những gì chúng tôi đã đề cập trong video này,

538
00:27:56,730 --> 00:27:58,521
nhưng có những
cơ bản sẽ giúp bạn có

539
00:27:58,521 --> 00:28:00,690
khá một cách lâu dài để
học tất cả mọi thứ bạn sẽ

540
00:28:00,690 --> 00:28:04,030
cần phải biết về điều này
ngôn ngữ thú vị.

541
00:28:04,030 --> 00:28:05,000
Tôi Doug Lloyd.

542
00:28:05,000 --> 00:28:07,010
Đây là CS50.

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