>> [MUSIC CHƠI]
>> 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?
Và chúng tôi đã bao phủ nhiều ngôn ngữ trong các video cá nhân.
Và bây giờ chúng ta hãy làm một nhiều hơn, JavaScript.
>> Đầu tiên là tin tức tốt, JavaScript là một chương trình hiện đại
ngôn ngữ giống như PHP mà cú pháp có nguồn gốc từ C,
vì vậy đó là một nơi tốt để bắt đầu.
Đó là về như cũ như PHP, cũng như, đã được khoảng 20 năm.
Nó được phát minh khoảng cùng một lúc như PHP.
Và JavaScript thực sự là khá cơ bản cho người dùng kinh nghiệm
của web.
Trong thực tế, có ba ngôn ngữ mà tôi
sẽ nói loại, tạo nên trải nghiệm người dùng tương tác
với các trang web, html, css, và JavaScript.
Và vì vậy bây giờ chúng ta hãy nói một chút chút về JavaScript.
>> Tin xấu, mặc dù, với JavaScript mà nó đặt ra rất nhiều quy tắc cho chính nó,
và sau đó nó phá vỡ chúng.
Và JavaScript có thể thực sự loại thách thức để học hỏi,
bởi vì nó không giống như C và PHP, mà rất có cấu trúc
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.
JavaScript có loại của nhận được rất linh hoạt
rằng có lẽ mọi việc không đến làm việc theo cách chúng ta mong đợi,
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
như một JavaScript.
Vì vậy, có lẽ vì nó không đề ra các quy tắc,
và nó không thực sự thực thi các thói quen mã hóa tốt.
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,
và vì vậy chúng tôi có thể bắt đầu thâm nhập JavaScript vào một chút.
>> Để 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
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
với js dot mở rộng tập tin.
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.
Đó là loại góc khung dấu hỏi PHP
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à
JavaScript là bằng cách bao gồm nó trong một thẻ html,
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.
>> Những điều khác mà làm JavaScript khác nhau,
mặc dù, là nó chạy phía khách hàng.
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
PHP mà nhấn mạnh một website.
Nếu chúng ta từng xem các nguồn của trang, chúng tôi chỉ sẽ
xem html đó là tạo bởi PHP.
Nhưng JavaScript chạy phía khách hàng.
JavaScript của bạn chạy trên máy tính của bạn.
Và đó là lý do tại sao bạn có thể làm điều thích thêm blockers.
Bên phải?
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
đang chạy trên một trang web cụ thể.
Và bởi vì nó sẽ phải chạy về phía máy khách hàng của bạn,
bạn chỉ có thể dừng JavaScript để chạy hoàn toàn.
Điều đó cũng có nghĩa là khi bạn sử dụng một trang web chứa JavaScript,
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
cho khách hàng khi họ yêu cầu.
Và do đó, bạn có thể không muốn sử dụng JavaScript
để làm những việc thực sự nhạy cảm như chuyển thông tin
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ự
sẽ nhận được tất cả các mã nguồn, không chỉ là html được tạo ra,
như sẽ là trường hợp với nói PHP.
>> 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?
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.
Với CSS chúng ta có thẻ style.
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.
Tương tự như vậy với JavaScript chúng ta có thể mở thẻ script,
một thẻ html chúng tôi đã không nói về trong video html của chúng tôi,
và viết trong JavaScript giữa các thẻ script.
Ngoài ra mặc dù, như CSS, chúng tôi có thể liên kết ở bên ngoài file CSS
và kéo chúng vào chương trình của chúng tôi theo cách đó.
Với CSS chúng ta cũng có thể, tha cho tôi, với JavaScript
chúng ta cũng có thể xác định nguồn gốc thuộc tính của thẻ script
để liên kết trong JavaScript riêng biệt, do đó bạn không
phải viết nó trong giữa các thẻ script, chúng tôi
có thể liên kết nó trong sử dụng mà thẻ script là tốt.
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à
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
bạn cần phải thay đổi nó, tương tự làm chúng tôi đề nghị
mà bạn viết của bạn JavaScript trong các tập tin riêng biệt
và sử dụng các nguồn thẻ script thuộc tính để buộc JavaScript
vào html của bạn, trang web của bạn.
>> Vì vậy, các biến JavaScript, chúng ta sẽ bắt đầu nói về cú pháp ở đây.
Và chúng ta sẽ đi qua loại này một cách nhanh chóng,
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.
Vì vậy, các biến trong JavaScript rất giống như PHP biến.
Không có loại specifier, và khi bạn giới thiệu một biến,
bạn có tiền tố nó với các từ khóa var.
Trong PHP, chúng tôi sẽ làm điều gì đó như thế này, ký hiệu đô la x.
Đó là cách chúng ta chỉ một biến, nhưng không có, chúng tôi
không đề cập đến các loại của biến ở tất cả.
Chúng tôi sẽ nói điều gì đó như Đôla dấu x bằng 44 trong PHP.
Nếu chúng tôi đã làm việc điều tương tự trong JavaScript,
chúng ta sẽ nói var x = 44.
Vì vậy, var là loại cách của chúng tôi giới thiệu một biến.
Đó có lẽ trực quan hơn một chút hơn là chỉ biến dấu đô la.
>> 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
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.
Điều kiện, tất cả chúng tôi những người bạn cũ từ C và PHP
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
dấu chấm.
Switch còn lại linh hoạt như nó là trong PHP, nhưng tất cả các bạn
quen thuộc với bây giờ.
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,
làm trong khi, và vẫn có sẵn cho chúng tôi.
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
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.
>> Gì về hàm trong JavaScript?
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.
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.
Một chút khác biệt là những gì về JavaScript,
mặc dù là khả năng có những gì được gọi là một chức năng vô danh.
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.
Đây là một cái gì đó chúng tôi thực sự đã không nhìn thấy trước.
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
Một lát sau, trong này video, bởi vì nó sẽ thấy
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ể
mà tôi đã chuẩn ở đây.
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
chức năng có thể trông như thế nào.
>> Vì vậy, tôi đã đi trước và mở ra IDE CS50 của tôi
và tôi đã chạy Apache để bắt đầu máy chủ đang chạy của tôi.
Và tôi có tập tin này mở home.htm.
Và tôi sẽ phóng to một chút ở đây.
Và về cơ bản, bạn có thể xem Home.html chỉ là một loạt các nút bấm.
Và tôi tuyên bố ở đầu đây rằng đây là phần JavaScript
nguyên vật liệu.
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ì?
>> Vâng, chúng ta sẽ đi qua IED của tôi, và tôi đã home.html mở ở đây.
Lúc đầu, đây là nơi mà tôi đang liên kết
trong tất cả các tập tin mã nguồn JavaScript của tôi.
Bên phải?
Vì vậy, tôi có anonymous.js, clock.js, Tôi đang sử dụng các thuộc tính nguồn
của thẻ script để liên kết trong tập tin.
Vì vậy, tôi đã không viết bất kỳ JavaScript trực tiếp vào tập tin này,
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.
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
với một chút của cú pháp mới.
Chúng tôi có ở đây tag tiêu đề cho chức năng và sau đó một nút.
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ó,
Tôi sẽ gọi một số hoạt động ngày cảnh báo.
Và đây là cách chúng ta có thể loại pha trộn lên một chút JavaScript và html.
Họ thực sự chơi khá độc đáo với nhau, và như vậy rõ ràng khi
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.
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
là trên trang home.html, mà chúng tôi sẽ tiếp tục trở lại
để trong quá trình video này.
Nhưng chúng ta hãy quay trở lại ở đây và có một cái nhìn
tại clock.js, đó là Tập tin JavaScript mà tôi
đã 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.
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,
và tôi đã đưa ra này một một tên, nó được gọi là ngày báo.
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.
Và tôi sẽ chỉ định một bằng một ngày mới.
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à,
và thực sự là như vậy JavaScript lớn mà chúng ta có thể không thể
bao gồm tất cả mọi thứ trong một video.
Nhưng nó đủ để nói, điều này sẽ để trở về với tôi một mục dữ liệu mà
gói gọn ngày hiện tại và thời gian.
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.
>> Vâng, những gì hiện cảnh báo hiện nay như thế nào?
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.
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.
Và tôi nhấp vào nó ở đó và hãy nhìn những gì nó đã làm, nó cảnh báo.
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
đó là ngày 04 tháng 11 tại 10:43:43 vào buổi sáng.
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?
Vì vậy, đó là tất cả chức năng này không.
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.
Vì vậy, có thực sự không quá nhiều chức năng
đó là khác nhau từ PHP, chỉ một chút cú pháp mới
mà đi kèm với làm việc với JavaScript.
>> Mảng trong JavaScript khá đơn giản.
Để khai báo một mảng, bạn sử dụng cú pháp dấu ngoặc vuông
mà chúng ta đã quen thuộc với từ PHP.
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.
Vì vậy, mảng này, cả hai các mảng sẽ
có JavaScript hoàn toàn hợp pháp.
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.
>> Một cái gì đó rất khác nhau là gì trong JavaScript, mặc dù?
Đó là quan điểm của một đối tượng.
Vì vậy, có lẽ bạn đã nghe nói về lập trinh Hương đôi tượng.
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ó
ở đây trong bối cảnh của JavaScript.
Bây giờ JavaScript có khả năng hành xử như một lập trình hướng đối tượng
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
ngôn ngữ lập trình.
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ó
có thể rất khó khăn để tìm hiểu JavaScript là lập trình đầu tiên của bạn
ngôn ngữ, bởi vì nó không thực sự phù hợp với một mô hình cụ thể.
>> C trên mặt khác là một ngôn ngữ lập trình chức năng.
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?
Họ ra lệnh gì xảy ra mọi thứ khác.
Chúng tôi muốn thay đổi các biến, chúng ta gọi hàm.
Chúng tôi làm việc với chức năng.
Các đối tượng thay vào đó, trong một phản đối ngôn ngữ hướng,
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.
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?
Vâng, nếu nó giúp, suy nghĩ về nó ở trước sắp xếp
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.
Trong C, một cấu trúc chứa một số lĩnh vực,
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.
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?
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
trường hoặc thuộc tính, một trong một số nguyên cho năm của xe
và một nhân vật 10 chuỗi cho mô hình của chiếc xe,
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
cấu trúc kiểu xe herbie.
Và sau đó tôi có thể nói điều gì đó như herbie.year bằng 1,963,
và herbie.model bằng Beetle.
Vậy là được rồi.
Tôi đang sử dụng các trường trong bối cảnh của kết cấu,
nhưng tôi có thể không bao giờ chỉ nói một cái gì đó như thế này.
Bên phải?
Tôi không thể sử dụng tên trường độc lập của cấu trúc.
Đó là loại một điều cơ bản.
>> Vì vậy, các lĩnh vực được cơ bản để cấu trúc C
rất giống với tài sản là cơ bản cho các đối tượng JavaScript.
Nhưng những gì làm cho họ đặc biệt thú vị
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ự
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.
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.
Chỉ có một đối tượng mà đã được xác định Chức năng này bên trong của nó,
nếu bạn nghĩ về một cấu trúc, chức năng
được định nghĩa bên trong những định nghĩa niềng răng nhọn của cấu trúc.
Vì vậy, nó chỉ có nghĩa là một cái gì đó để cấu trúc.
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.
Đó là cơ bản giống như chúng tôi xác định một chức năng mà
chỉ có ý nghĩa trên đối tượng cụ thể, và vì vậy chúng tôi
gọi đó là một phương thức của đối tượng.
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,
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.
>> Vì vậy, lập trình chức năng mô hình giống như thế này.
Chức năng và sau đó khi bạn vượt qua trong đối tượng như một tham số.
Trong một lập trình hướng đối tượng ngôn ngữ, loại này được
lộn, và chúng tôi sẽ suy nghĩ về nó như thế này, object.function.
Vì vậy, nó loại dấu chấm đó nhà điều hành lại ngụ ý
rằng nó là một số loại tài sản hoặc thuộc tính của đối tượng đó.
Nhưng đây là những gì một đối tượng ngôn ngữ lập trình hướng
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à
chỉ là một từ đặc biệt cho một chức năng đó là vốn có để một đối tượng.
Đây là những gì mà cú pháp có thể trông như thế nào.
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.
>> 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,
mà chúng ta đã quen thuộc với từ PHP.
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ì
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
mảng.
Mảng kết hợp có thể bản đồ từ, như trong video PHP,
chúng tôi đã nói về toppings pizza.
Và vì vậy chúng tôi đã có một mảng gọi pizza, và chúng tôi
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,
9,99 $ là một giá trị, và như vậy.
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
mảng.
Và do đó, cú pháp này ở đây sẽ tạo ra một đối tượng mới
gọi herbie với hai tính chất bên trong của nó.
Năm, mà được gán giá trị năm 1963, và mô hình, mà được gán chuỗi
Beetle.
>> Và hãy chú ý ở đây mà tôi đang sử dụng dấu ngoặc đơn trong JavaScript.
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.
Nó chỉ là quy ước những trường hợp đó hầu hết các lần
khi bạn đang viết JavaScript, bạn chỉ cần sử dụng dấu nháy đơn.
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.
>> Vì vậy, hãy nhớ làm thế nào trong PHP chúng ta có khái niệm này
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
cặp của một liên kết mảng, bởi vì chúng tôi
không có khả năng này để lặp qua 0, một, hai, ba, bốn,
và như vậy?
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,
nó được gọi là một định trong vòng.
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,
đó là loại tương tự để nói cho mỗi một cái gì đó như là một cái gì đó.
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.
Và bên trong của xoăn niềng răng ở đó, tôi sẽ
đố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.
>> Ngoài ra, có thậm chí một cách tiếp cận.
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,
và chỉ cần sử dụng chìa khóa bên trong.
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
chìa khóa bên trong vòng lặp.
Đố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,
bởi vì anh chỉ cụ thể nói về các giá trị đó.
>> 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
chỉ để nhanh chóng chỉ cho bạn sự khác biệt giữa bốn
trong và cho các với rất cụ thể mảng, mà chúng ta có ở đây, mảng tuần.
Vì vậy, tôi phải tìm một mảng mới mà tôi đầy bảy dây,
Thứ hai thứ ba thứ tư, Thứ năm, thứ sáu, thứ bảy, chủ nhật.
Và tôi muốn bây giờ lặp qua mảng này,
in ra thông tin nhất định.
Nếu tôi sử dụng một cho trong vòng lặp để in ra thông tin,
điều gì làm bạn nghĩ rằng tôi sẽ nhận được?
Vâng, chúng ta hãy có một cái nhìn.
Và trước khi chúng tôi nhảy qua vào cửa sổ trình duyệt của tôi,
chỉ biết rằng console.log là sắp xếp của một
cách làm một F in trong JavaScript.
Nhưng giao diện điều khiển là gì?
Vâng, đó là những gì chúng ta đang đi đi hãy xem ngay bây giờ.
>> 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,
và tôi sẽ mở lên các công cụ phát triển của tôi.
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.
Và nhận thấy rằng đây tại đầu tôi đã chọn giao diện điều khiển.
Vì vậy, đây là khái niệm của một giao diện điều khiển phát triển,
và nó sẽ cho phép chúng tôi in thông tin ra ngoài,
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,
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.
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.
Và bốn trong test-- Tôi sẽ không hiển thị cho bạn mã số cho nó ngay bây giờ,
nhưng bạn sẽ có được nó nếu bạn tải về mã nguồn
được liên kết với video-- này Chỉ là để trong vòng lặp là
mà chúng ta thấy chỉ là một trước thứ hai trên slide.
>> Vì vậy, tôi sẽ bấm vào đó nút, và qua đây,
đây là những gì đã in ra trong giao diện điều khiển, 0, một, hai, ba, bốn, năm,
sáu.
Tôi đã không in ra thông tin bên trong những địa điểm mảng,
bởi vì tôi đã sử dụng một cho trong vòng lặp.
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.
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
Tôi nói tôi sử dụng cho vòng lặp thay vào đó và in ra chìa khóa,
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
hoặc mảng của tôi trong trường hợp này.
Mảng của tôi về các ngày trong tuần.
Tôi in ra thứ hai, Thứ ba thứ tư.
Vì vậy, đó là sự khác biệt giữa một cho trong vòng lặp, trong đó in ra
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,
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ỉ
chính bên trong cơ thể của vòng lặp.
>> 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
một số biến với nội suy như chúng tôi có thể làm gì trong PHP?
Vâng, chúng tôi đang khá quen thuộc với điều này từ PHP.
Đâ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.
Trong JavaScript, mặc dù, chúng tôi thực sự sử dụng một cái gì đó
đượ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
trực quan, phải không?
Chúng tôi đang thêm một bó các dây với nhau.
Vì vậy, chúng ta hãy quay trở lại trên và xem những gì này
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.
Được rồi, như vậy dưới đây dưới nối chuỗi,
Tôi có hai lựa chọn, xây dựng chuỗi V1 và sau đó xây dựng chuỗi V2.
Và chúng ta sẽ thấy lý do tại sao chúng tôi cần V2 trong một giây.
Nhưng tôi sẽ click vào chuỗi tòa V1, mà
là mã chúng tôi chỉ cần lấy một cái nhìn tại,
các console.log với tất cả những ưu điểm.
Hãy xem nếu bản in này ra những gì chúng tôi mong đợi.
>> Thứ hai là ngày thứ 01 của tuần, Thứ ba là ngày thứ 11 của tuần.
Vâng, những gì tôi đã cố gắng phải làm là có được
nó để in ra thứ hai là số lượng ngày một, thứ ba là ngày thứ hai.
Nhưng có vẻ như tôi là luôn in ra một.
Vâng, tại sao vậy?
Vâng, nó quay ra, một cái nhìn khác ở đoạn này ít mã ở đây.
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.
>> Và do đó, đây là nơi mà có lẽ mọi thứ mà chúng tôi đã loại được nói,
oh, nó tuyệt vời như vậy.
Chúng tôi không đối phó với các loại dữ liệu nữa.
Nhưng đây là nơi mà thực tế chúng ta mất đi các kiểu dữ liệu
thực sự có thể là một chút của một vấn đề đối với chúng tôi.
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ố
với nhau, JavaScript có để làm cho dự đoán tốt nhất của mình
như những gì tôi muốn nó làm cho tôi.
Và trong trường hợp này, nó đoán sai.
Nó ngày chỉ cần kết nối, đó sẽ là 0, một, hai, ba, bốn, năm, sáu,
và sau đó nó chỉ nối đó và sau đó nối một.
Nó không thực sự gắn chúng lại với nhau.
Và do đó, những ngôn ngữ, PHP và JavaScript,
mà tóm tắt đi khái niệm này của các loại,
bạn không phải đối phó với nó nữa.
Họ vẫn có loại dưới mui xe.
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à
bằng cách nói một cái gì đó như có lẽ này, mà
là nói JavaScript, do cách, coi đây là một số nguyên,
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
và số nguyên ở đây.
>> 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
rằng chúng ta không cần phải đối phó với các loại nữa,
nhưng đôi khi bạn sẽ thấy chạy vào một tình huống
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
có thể backfire về bạn nếu bạn không cẩn thận.
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,
và tôi sẽ bấm chuỗi xây dựng phiên bản hai, trong đó
là nơi mà tôi sử dụng chức năng phân tích cú pháp int.
Bây giờ nó in ra thông tin mà tôi đang mong đợi.
Số ngày một ngày thứ Hai, thứ Ba là ngày thứ hai, và như vậy.
>> Vì vậy, chúng ta hãy nói về chức năng một lần nữa.
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
cuối cùng cũng đã đến.
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.
Vì vậy, mảng là một đặc biệt trường hợp của một đối tượng.
Trong thực tế, tất cả mọi thứ trong JavaScript thực sự là một đối tượng.
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,
số nguyên là một đặc biệt trường hợp của một đối tượng,
nhưng mảng cụ thể có một số phương pháp.
Ghi vì họ đang đối tượng, họ có thể có các thuộc tính và phương pháp.
Họ có một số phương pháp có thể được áp dụng cho các đối tượng.
Có một phương pháp gọi là kích thước, array.size,
sẽ trở về bạn như bạn mong đợi
số phần tử trong mảng của bạn.
array.pop, loại giống như khái niệm của chúng ta về popping off
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,
loại bỏ các yếu tố cuối cùng từ mảng.
Array.push thêm một yếu tố mới đến cuối mảng.
array.shift là loại như DQ, nó splices ra
các yếu tố đầu tiên của một mảng.
>> 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 đồ.
Và đây là loại một khái niệm thú vị.
Vì vậy, ý tưởng về một bản đồ là gì?
Bạn thực sự sẽ thấy điều này trong một số ngôn ngữ khác,
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,
chúng ta đang nói về một chức năng lập bản đồ.
Trong bối cảnh chúng tôi nói ở đây, một bản đồ
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
để áp dụng một chức năng cụ thể để mọi phần tử của mảng đó.
và vì vậy chúng tôi sẽ nói trong trường hợp này, có lẽ array.map,
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
được áp dụng cho tất cả các yếu tố duy nhất.
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ử
và áp dụng một đặc biệt chức năng để mọi yếu tố,
chỉ JavaScript đã được xây dựng trong khái niệm về một bản đồ có thể được áp dụng.
Và đây là một bối cảnh tuyệt vời để nói về một chức năng vô danh.
>> 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.
Nó được gọi là nums, và nó có năm thứ trong đó, một, hai, ba, bốn,
năm.
Bây giờ tôi muốn một số bản đồ chức năng trên vào mảng này.
Tôi muốn có một chức năng áp dụng để mọi phần tử của mảng.
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ố.
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
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.
Nhưng tôi cũng có thể làm một cái gì đó như thế này.
Tôi có thể nói nums là trước đây một hai ba bốn năm,
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
mà tôi muốn bạn tăng gấp đôi mỗi số.
Và đó là chính xác những gì đang xảy ra ở đây.
Nhưng cần chú ý những gì tôi đang đi qua trong như là đối số để lập bản đồ.
Đây là một chức năng vô danh.
Và nhận thấy tôi đã không cho Chức năng này một cái tên,
Tôi đã chỉ cho nó một danh sách tham số.
Và vì vậy đây là một ví dụ của một chức năng vô danh.
>> 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 đồ.
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ự
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 đồ
và nó được xác định đúng có bên trong của bản đồ.
Và vì vậy đây là một chức năng vô danh.
Chúng tôi đã không thể để làm điều này trước đây.
Bản đồ một số chức năng mà chấp nhận một tham số, num,
và những gì chức năng nào được trả về num lần 2.
Và như vậy sau này lập bản đồ đã được áp dụng,
này hiện nay là gì nums vẻ như thế, hai, bốn, sáu, tám, 10.
Và chúng tôi sẽ bật lên để tôi cửa sổ trình duyệt và chỉ
hãy xem này thực sự nhanh càng tốt.
>> 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.
Và khi tôi nhấp đúp, và nó nói tôi trước khi nó được một, hai, ba, bốn,
năm sau khi hai, bốn, sáu, tám, 10.
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.
Và rồi sau đó, bốn, tám, 12, 16, và sau đó 20.
Và những gì tôi làm trong chức năng này?
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
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,
nhưng tôi chỉ cần in ra những gì hiện đang trong mảng.
Sau đó, trên đường 16, 17, và 18, có bản đồ của tôi.
Đâ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.
Và sau đó một chút tiếp tục xuống, Tôi chỉ làm những điều tương tự
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
sau đó.
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
bản đồ trên một mảng toàn bộ.
>> 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.
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
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,
hoặc có thể họ đã di chuyển chuyển chuột lên một cái gì đó,
hoặc họ đã gõ một cái gì đó trong một trường đầu vào.
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.
Và JavaScript có khả năng hỗ trợ một cái gì đó
được gọi là một xử lý sự kiện, mà là một chức năng gọi lại đó
đáp ứng một sự kiện html.
Và một chức năng gọi là gì?
Vâng, nó thường chỉ khác đặt tên cho một chức năng vô danh.
Đó là một chức năng mà đáp ứng một sự kiện.
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
một thuộc tính html đặc biệt.
Hầu hết các yếu tố html hỗ trợ cho một thuộc tính
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
hoặc trên di chuột hoặc vào tải, tất cả các sự kiện
mà sau đó bạn có thể viết các chức năng mà đối phó với những sự kiện
khi những sự kiện xảy ra trên trang web của bạn.
>> Và như vậy có lẽ html của bạn trông giống như thế này.
Và tôi có hai nút ở đây, một nút và nút hai,
và ở đây tôi có hiện nay không có gì được xác định,
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.
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 đó,
nó sẽ có một số hoạt Javascript chức năng để ứng phó với các sự kiện
có lẽ phải nhấn lên nút một hoặc hai nút.
>> 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.
Và sự kiện này sẽ Handler tạo ra một đối tượng sự kiện.
Và các đối tượng sự kiện sẽ cho chúng tôi mà trong hai nút được nhấp.
Bây giờ làm thế nào mà làm việc?
Vâng, nó có thể giống như thế này.
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
chức năng đó sẽ được gọi là khi nút được nhấn vào,
chúng ta sẽ gọi tên sự kiện cảnh báo.
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.
Vì vậy, chúng tôi gọi chức năng này hoặc khi chức năng này
đượ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
và vượt qua nó như một tham số để cảnh báo tên.
Và đó là đối tượng sự kiện sẽ chứa thông tin
về những nút được nhấp.
Và làm thế nào để nó làm điều đó?
Vâng, nó có thể giống như thế này.
Vì vậy, bây giờ trong riêng của tôi Tập tin JavaScript, tôi có thể
có để tìm kiếm này Chức năng cảnh báo tên, mà
một lần nữa chấp nhận rằng tham số sự kiện.
Và sau đó ở đây là nơi mà tôi phát hiện nút đó đã được kích hoạt,
var kích hoạt bằng sự kiện dot phần tử nguồn.
Các nguồn tạo ra là gì đối tượng này sự kiện được thông qua tại?
Đó có phải là một nút hay là nút hai?
>> Và sau đó ở đây tất cả tôi đang làm là in ra trigger.innerhtml.
Vâng, trong trường hợp này, trong này bối cảnh, trigger.innerhtml
chỉ là những gì được viết trên các nút.
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ó
được những gì trong giữa những thẻ nút.
Nó sẽ là một nút hoặc nút hai.
Và chúng ta hãy nhìn vào cách xử lý sự kiện này sẽ
xem xét nếu chúng tôi đã có nó chạy trong thực tế.
>> Vì vậy, trước hết, bạn đã mở ra events.js,
đó là tập tin JavaScript nơi Tôi đã xác định chức năng này.
Và như bạn có thể thấy, đó là khá nhiều chính xác những gì
chúng ta chỉ nhìn thấy trên slide một giây trước đó.
Và tôi sẽ đi qua để trang nhà, chúng tôi đã sử dụng.
Và tôi có ở đây nút một và hai nút.
Và tôi sẽ bấm vào một nút.
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.
ĐƯỢC.
Click vào nút hai, bạn nhấp vào một nút hai.
>> Vì vậy, cả hai nút có cùng chức năng gọi, phải không?
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
mà được tạo ra khi chúng ta click vào nó cho chúng ta nút mà được nhấp.
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ó
để vượt qua bất kỳ thông tin bổ sung.
Chúng tôi chỉ dựa vào những gì sẽ JavaScript
làm cho chúng ta, đó là tạo ra mà loại đối tượng sự kiện thay cho chúng ta.
Có rất nhiều chi tiết để Javascript hơn những gì chúng tôi đã đề cập trong video này,
nhưng có những cơ bản sẽ giúp bạn có
khá một cách lâu dài để học tất cả mọi thứ bạn sẽ
cần phải biết về điều này ngôn ngữ thú vị.
Tôi Doug Lloyd.
Đây là CS50.