[MUSIC CHƠI] DAVID Malan: Đây là CS50. Đây là khởi đầu của tuần chín. Và đây là những gì sẽ có được ngày sinh nhật thứ 200 của ông Boole. Vì vậy, đây là nghiên cứu sinh người mà chúng tôi đã ám chỉ khá nhiều lần về việc sử dụng Biến Boolean đúng và sai, 1 và 0 và như vậy. Và điều này đã được Google của cống nộp cho anh ta ngày hôm nay. Ông đã có thể quay 200. Vì vậy, nếu bạn muốn tham gia với chúng tôi để CS50 ăn trưa, hãy xem các liên kết trên trang web của khóa học. Và khuôn mặt như vậy và bạn bè những chờ đợi bạn ở đây tại Cambridge. Khuôn mặt như thế này đang chờ đón bạn ở New Haven. Và, trên thực tế, Ken trong New Haven vui lòng thực hiện những gì được gọi là một GIF hoạt hình của Eli ở đây, vào gần đây lunch-- một GIF là chưa một định dạng tập tin đồ họa, mà bạn familiar-- đó trông một chút gì đó như thế này. Vì vậy, chỉ là một chuỗi of-- OK. Không ai ở đây ở Cambridge được cười. Nhưng ở New Haven, điều này thực sự là buồn cười, phải không? Được rồi. Vì vậy, chúng tôi có tham gia. Ở đây tại Harvard, Cụ thể, thứ Tư này, nếu bạn là một sinh viên năm hai hoặc sinh viên năm nhất even-- hoặc thậm chí suy nghĩ junior-- của việc ra một chuyển đổi thành máy tính khoa học, biết rằng có sẽ thấy được một CS tư vấn cho hội chợ này Thứ tư, ngay sau giờ học tại 04:00 trong máy tính tòa nhà khoa học Maxwell Dworkin. Chúng tôi sẽ đưa điều này vào khóa học của website của ngày mai, là tốt. Donuts, tôi đã nói, sẽ được phục vụ. Được rồi. Vì vậy, vui story-- Tôi thò khoảng trên internet, và tôi tìm thấy một số kho cũ của trang web trước đây của tôi. Và nó quay quanh out-- này thời gian, có vẻ như rất kịp thời kể từ khi tôi thu thập rằng các cuộc bầu cử UC khoảng gear lên một lần nữa. Vì vậy, tôi chạy cho UC, mất thảm hại. Và có lẽ đây là một phần lý do tại sao. Vì vậy, đây là trang web của tôi lúc đó. Đối với một số lý do, tôi nghĩ rằng nó là một ý tưởng tốt, trước khi nói với mọi người nền tảng những gì tôi đã và tại sao họ nên bỏ phiếu cho tôi, rằng họ có bấm vào để nhập vào để tìm ra rằng thông tin, mà khi nhìn lại là loại đáng sợ. Tôi không thực sự biết những gì đã được. Nhưng chắc chắn nó không giúp chiến dịch của tôi. Tôi cũng nhận thấy rằng bằng cấp cao year-- tôi đã có lịch Muppet này. Muppets là loại thịnh hành trở lại sau đó. Hoặc có thể họ không. Tôi đã có một lịch Muppet trở lại sau đó. Và tôi nghĩ rằng nó muốn được mát mẻ để tên máy tính của tôi trên mạng của Harvard frogman.student.harvard.edu. Vào thời điểm đó, tất cả chúng ta có duy nhất tên máy chủ nhận dạng. Và bạn có thể chọn một số vanity tên thay cho tên riêng của bạn. Và tôi đã đi với người nhái đối với một số lý do. Và sau đó tôi started-- tôi đã dành rất nhiều thời gian cách nhấn qua các liên kết sáng nay. Và đây là trang giới thiệu về mình, mà bây giờ loại có vẻ đáng yêu. Nhưng nó cũng làm chứng chỉ làm thế nào công nghệ đến nay đã đến. Ý tôi là, trở lại trong ngày, 486 là một cái gì đó. Những ngày này, đó là siêu, siêu, siêu chậm và cũng ít hơn bạn có thể có trong bạn túi riêng của những ngày này. Có nhiều trên đó mà thậm chí còn nhiều lúng túng. Vì vậy, tôi sẽ để nó ở đó. Nhưng đó là lần đầu tiên của tôi bước đột phá vào web-- oh, không có. Đó không phải. My bước đột phá thực sự đầu tiên thành lập trình web được trang web này, mà tôi chỉ quên. Tại một số điểm, tôi đã học được làm thế nào để làm cho hình ảnh nền lặp đi lặp lại. Và vì vậy tôi thấy ốp lát này có hiệu quả, như khúc côn cầu, bóng đá, golf và bóng, hoặc bất cứ điều gì đó là cho các trang web Frosh tin nhắn tức thì. Và điều này là thực sự, thực sự dự án dựa trên web đầu tiên tôi mất on-- Tôi nghĩ có lẽ thứ hai năm, year-- junior sau khi uống CS50 và CS51, một của các lớp tiếp theo vào chung. Tôi nhận thấy trong tìm kiếm thông qua các tài liệu lưu trữ rằng một trong những người thừa kế của tôi và bạn bè, Lee, loại thay đổi bản quyền với chính mình. Nhưng điều này thật sự là một cái gì đó Tôi nên sở hữu những bối rối tới. Nhưng vào thời điểm đó, điều này là trang web đầu tiên, như tôi đã nói cách đây vài tuần, theo đó sinh viên năm nhất có thể đăng ký và thể thao ở đây. Và do đó, nó quay ra mà hình ảnh nền như thế không phải là một ý tưởng tốt. Nhưng các web là mới, và chúng tôi đã thử nghiệm tất cả. Và đây là những gì tôi dường như đã làm vào thời điểm đó. Được rồi. Vì vậy, không có thêm ado, chúng tôi chuyển đổi bánh răng ngày hôm nay để cung cấp cho bạn, thực sự, các mảnh ghép cuối cùng mà bạn có thể tìm thấy đặc biệt hữu dụng cho các dự án cuối cùng nhưng cũng sẽ bắt đầu làm cho các trang web trên toàn thế giới cảm thấy một chút dễ hiểu hơn. Thật vậy, chúng ta sẽ giới thiệu một ngôn ngữ lập trình hơn gọi là JavaScript mà là tương tự và khác nhau theo những cách khác nhau từ ngôn ngữ, chúng tôi đã vậy, đến nay. Vì vậy, C, thu hồi, là ngôn ngữ biên dịch này. Bạn đã có để chạy nó thông qua một trình biên dịch. Bạn nhận được mã nguồn để phản đối mã, hoặc zero và những người thân. Và đó là những con số không và những người CPU của bạn, Central Processing Unit, thực sự hiểu. PHP, ngược lại, không phải là một ngôn ngữ biên dịch. Đó là một điều gì? Đây là một ngôn ngữ giải thích. Vì vậy, có một số chương trình được gọi là một trình thông dịch có đọc top it-- để phía dưới, từ trái sang right-- và tìm ra những gì tất cả cú pháp của bạn không và có nghĩa là, cho dù đó là một vòng lặp hoặc một điều kiện hoặc bất kỳ số nào khác của chương trình xây dựng. Vì vậy, đó là một ngôn ngữ giải thích. Sau đó, chúng tôi giới thiệu HTML. Và HTML không phải là lời ngôn ngữ lập trình. Chúng tôi muốn gọi nó là gì? Ngôn ngữ đánh dấu, mà chỉ là một loại cách ưa thích của nói nó không có cấu trúc lập trình như chúng ta đã thấy thậm chí trở lại trong ngày của Scratch. Không có vòng. Không có điều kiện. Nó thực sự là một ngôn ngữ về đánh dấu dữ liệu của bạn và định dạng hoặc cơ cấu nó một cách nào đó. CSS, trong khi đó, tương tự không phải là một ngôn ngữ lập trình. Nó thậm chí còn mang tính thẩm mỹ hơn theo định hướng. Và nó cho phép bạn sắp xếp các tinh chỉnh những thứ như kích thước font chữ và màu sắc và vị trí và tất cả điều đó. Sau đó, chúng tôi đã có SQL. Vì vậy, SQL thực sự là một lập trình ngôn ngữ trong một số ý nghĩa, mặc dù thiết kế đặc biệt để cơ sở dữ liệu. Nhưng thậm chí dù chúng tôi chỉ giới thiệu với bạn lựa chọn và chèn và xóa và cập nhật và một vài người khác, hóa ra bạn có thể thực sự viết các chức năng hay thủ tục, như họ đang gọi là, trong SQL mà nhìn và hành động khá giống như PHP và C chức năng. Vì vậy, biết rằng những tồn tại. Nhưng chúng tôi thậm chí không bận tâm với họ như chúng ta chỉ làm xước bề mặt ở đây. Và sau đó JavaScript, người cuối cùng của ngôn ngữ của chúng tôi chính thức giới thiệu. Vì vậy, JavaScript, quá, là một ngôn ngữ giải thích. Và những người quen thuộc, làm bạn muốn phân biệt nó với một số đặc trưng từ cả hai C và PHP? Điều gì làm cho nó khác nhau? Đung Nó không được biên dịch. DAVID Malan: Nói một lần nữa? Đung Nó không được biên dịch. DAVID Malan: Nó không được biên dịch. Vì vậy, nó cũng được giải thích. Vì vậy, nó không được biên dịch. Nhưng mà làm cho nó một chút như PHP. Nhưng nó vẫn khác PHP trong một số cách nổi bật, ít nhất là trong cách chúng ta sẽ sử dụng nó. Yeah? Đung Nó chạy client-side. DAVID Malan: Nó chạy phía khách hàng, thông thường. Đó là thực sự phân biệt đặc trưng cho chúng tôi ngay bây giờ. C là phía máy chủ trong ý nghĩa rằng chúng tôi đã làm tất cả mọi thứ trong CS50 IDE. PHP vậy, đến nay đã được server-side trong chừng mực vì nó cũng được interpreted-- không được biên dịch, nhưng interpreted-- bên CS50 IDE, trong đó tất nhiên là chỉ một máy chủ hoặc máy chủ trong các đám mây. Nhưng JavaScript, thậm chí mặc dù bạn bạn đang đi để bắt đầu viết nó cho, nói, pset tám và có thể thức projects-- bạn đi sang phải nó trong CS50 IDE và lưu nó trong các tập tin trong CS50 IDE, IDE CS50 và, đến lượt nó, các máy chủ đám mây mà trên đó nó được lưu trữ, sẽ không để giải thích hoặc thực thi mã của bạn. Thay vào đó, nó sẽ được gửi đi trong hình thức không đổi xuống cho trình duyệt. Và sau đó nó sẽ được trình duyệt IE hoặc Chrome hoặc Firefox hay Safari hoặc bất cứ điều gì đó thực sự diễn giải nó, trên xuống dưới, từ trái sang phải. Vì vậy, các phân biệt chủ yếu đặc trưng cho ngày hôm nay là JavaScript là client-side và PHP, ví dụ, có được server-side. Bây giờ, điều này có ý nghĩa thú vị cho, như, sở hữu trí tuệ và những người thực sự có thể nhìn thấy mã của bạn. Và thực sự, bạn có thể đi trên web và xem nhất bất kỳ mã mà một người nào đó có viết bằng JavaScript. Đôi khi nó có thể đọc được, đôi khi nó làm cho khó hiểu. Nhưng thêm vào đó trong thời gian do. Vì vậy, JavaScript, độc đáo đủ, là siêu tương tự, cú pháp, để C. Và giống như PHP, không có chức năng chính. Nếu bạn muốn bắt đầu bằng văn bản Mã JavaScript, như bạn sẽ thấy ngày hôm nay, bạn chỉ cần bắt đầu viết nó. Nhưng đó là, bạn sẽ thấy, đặc biệt hữu ích trong bối cảnh của các trình duyệt web. Tuy nhiên, nhỏ của tôi disclaimer-- thường earlier-- là để nói rằng bạn có thể ngày càng sử dụng ngày nay JavaScript phía máy chủ sử dụng một khung lạ mắt gọi là Node.js rằng một số ứng dụng riêng của CS50 được viết. Kiểm tra 50 thực sự sử dụng Node.js. Nhưng chúng ta sẽ tập trung vào JavaScript client-side đây trên ra ngoài. Vì vậy, đây là một tập hợp các điều kiện trong PHP. Xin lỗi, in-- thực sự, mà tuyên bố, quá là đúng. Đây cũng là một tập hợp các điều kiện trong JavaScript. Cú pháp, nó là giống với C và PHP. Biểu của ông Boole là, tương tự như vậy, cú pháp giống hệt nhau cho cả hai C và PHP. Chúng tôi cũng có thiết bị chuyển mạch trong JavaScript mà nhìn giống hệt nhau. Chúng tôi có cho vòng mà là có cấu trúc giống nhau, trong khi các vòng, làm trong khi các vòng lặp. Điều này là một chút khác nhau. PHP đã từng xây dựng mà bạn có thể sử dụng được hoặc sẽ sử dụng trong pset bảy, có lẽ. JavaScript có phiên bản đặc biệt này cho nơi bạn có nghĩa là nói điều gì đó như cho chính biến trong đối tượng, trong đó là một cách rất ngắn gọn nói, nếu tôi đã có một object-- và chúng tôi sẽ nói về những lần nữa trong một moment-- và tôi muốn để lặp qua tất cả của các cặp giá trị bên trong, Tôi không cần phải tìm ra cách để chỉ số về số lượng chúng bằng số không, một, hai ba. Tôi nghĩa là có thể nói điều này. Và trên mỗi lần lặp, JavaScript đối với tôi sẽ cập nhật các chính biến là chìa khóa đầu tiên, sau đó bấm phím tiếp theo, sau đó các khóa tiếp theo, sau đó bấm phím tiếp theo, và kể từ đó trở đi. Và tôi có thể có được ở giá trị của nó bằng cách xử lý một đối tượng trong JavaScript, như chúng ta sẽ thấy, như thể đó là một mảng liên kết trong PHP. Thật vậy, nếu bạn cuối cùng bọc của bạn tâm xung quanh những gì một mảng kết hợp là trong PHP, bạn có thể nghĩ về nó bây giờ là giống với một đối tượng trong JavaScript. Nhưng đó là một chút một sự đơn giản. Mảng nhìn, độc đáo đủ, giống hệt nhau PHP trừ cho một ký tự. Có một điều còn thiếu ở đây mà chúng ta đã thấy trong tuần qua với PHP. Có gì bỏ qua? Yeah? Không có dấu hiệu đồng đô la. Vì vậy, chúng ta trở lại với một hơn thế giới bình thường mà các biến không có dấu hiệu đồng đô la. Nhưng bạn làm tiền tố chúng với var, thông thường. Và var nghĩa biến. Và giống như PHP là lỏng lẻo typed-- theo đó có nhiều loại, có những con số và chuỗi và phao nổi và rất forth-- JavaScript tương tự có các loại. Nhưng nó lỏng lẻo ở chỗ chúng tôi các lập trình viên không cần phải xác định chúng. Chúng tôi chỉ có được nhận thức rằng các loại khác nhau tồn tại. Biến, meanwhile-- đây là cách chúng ta có thể khai báo "hello, world" như là một chuỗi. Chú ý nó giống hệt với PHP nhưng không có dấu hiệu đồng đô la. Và đây là một cái gì đó chúng tôi sẽ bắt đầu thấy ngày nay nhiều hơn, nhờ đó mà bạn có một đối tượng khóa và giá trị. Và nếu bạn muốn thử để suy ra từ week-- cuối cùng cú pháp là một chút khác nhau. Nhưng một chút tỉnh táo check-- bao nhiêu phím không đối tượng này dường như có? Vì vậy, tôi thấy bốn. Tôi thấy hai. Vì vậy, nó thực sự hai. Vì vậy, đây là một bộ sưu tập của hai cặp khóa-giá trị. Điều quan trọng là biểu tượng có giá trị là FB. Điều quan trọng là giá có giá trị là 101,53. Vì vậy, những người là hai cặp khóa-giá trị. Và hãy nhớ, PHP-- và điều này là một lần nữa chỉ là loại khác biệt cú pháp. Đó không phải là tất cả mà trí tuệ thú vị. PHP có thể viết bài này cùng điều như quote follows--, bình đẳng. Và tôi thay đổi này để dấu ngoặc vuông. Và sau đó tôi thay đổi này để một lời trích dẫn, "giá". Và sau đó tôi không sử dụng dấu hai chấm. Tôi đã sử dụng những gì trong tuần qua? Yeah, dấu bằng mũi tên ký hiệu funky. Và sau đó tôi đã làm điều tương tự ở đây. Cùng một điều ở đây. Và đó là tất cả. Vì vậy, nó là tốt nếu điều này có không thực sự chìm vào bộ nhớ chỉ nhưng vì nó thực sự trí tuệ nhàm chán. Đó là sự khác biệt chỉ là cú pháp. Nhưng những ý tưởng là chính xác như nhau. Bên trong của biến này quote trong JavaScript là một bộ sưu tập các cặp khóa-giá trị, một trong số đó là biểu tượng, một trong số đó là giá cả. Và tôi có thể có được ở những giá trị với cú pháp sau đây. Cũng giống như trong PHP, tôi có thể làm điều gì đó để cho like-- tôi làm cho hộp này lớn hơn một chút. Cũng giống như trong PHP, tôi có thể làm this-- oh, mẹ kiếp. Nào. Cũng giống như trong PHP-- OK, chúng tôi sẽ chỉ cần sử dụng các ghi chú trình bày. Cũng giống như trong PHP, tôi có thể làm $ quote $ quote ["biểu tượng"], và điều này sẽ làm cho tôi giá trị của "biểu tượng." Trong JavaScript, nó sẽ được giống hệt nhau, nhờ đó mà tôi chỉ có thể làm điều này. Điều duy nhất đó là thiếu là các ký hiệu đô la. Vì vậy, độc đáo đủ, sau đó, có không phải tất cả mà nhiều cú pháp mới. Vì vậy, những gì hôm nay chúng tôi tập trung vào, thực sự, là một số ý tưởng và các ứng dụng. Và lần đầu tiên như vậy ứng dụng mà có lẽ bạn đã nhìn thấy nếu bạn nhảy vào pset bảy đã là cú pháp này. Vì vậy, trong pset bảy, nếu bạn đã nhìn thấy hoặc không nhìn thấy được chưa, biết rằng có một tập tin mà chúng tôi cung cấp bạn gọi config.json-- JavaScript Object Notation. Tại sao? Chúng tôi muốn để có thể cung cấp cho bạn một mẫu với một số cặp giá trị khóa. Chúng tôi muốn để có thể cung cấp cho bạn một danh sách của chủ nhà, tên của các máy chủ. Chúng tôi muốn cung cấp cho bạn một giữ chỗ cho tên người dùng của bạn và một giữ chỗ cho mật khẩu của bạn. Nếu bạn không nhìn thấy này chưa, không phải lo lắng. Thêm chi tiết về điều này trong pset bảy [? spec. ?] Và sau đó, rõ ràng, chúng tôi muốn bạn để điền vào to-dos bởi vì khi bạn đăng nhập vào CS50 IDE, mỗi bạn có tên đăng nhập và mật khẩu riêng của bạn. Vì vậy, chúng ta có thể đã sử dụng một nửa tá hoặc nhiều định dạng tập tin khác nhau. Chúng ta có thể đã sử dụng một tập tin txt. Chúng ta có thể sử dụng một tập tin CSV. Chúng ta có thể đã sử dụng một INI file, một file XML, cả một bó nhiều từ viết tắt bạn có thể chưa bao giờ nghe. Đó là loại tùy ý cuối ngày. Nhưng siêu phổ biến những ngày này là một văn bản định dạng được gọi JSON-- JavaScript Object Notation-- trông như thế này. Đó là một chút khó hiểu, nhưng nhận thấy các mô hình. Bạn bắt đầu với một xoăn mở nẹp, và bạn kết thúc với cùng. Bên trong đó là một cái gì đó. Đó là một cặp khóa-giá trị. Vì vậy, đây là một đối tượng mà tôi nhìn trên màn hình ở đây rằng có một trọng điểm, trong đó có một giá trị. Và chỉ cần suy luận dựa trên mô hình trước đó, chìa khóa ở đây là gì? Cơ sở dữ liệu, các điều bên trái của đại tràng. Bây giờ, giá trị sẽ xảy ra là một nhiều dòng thời gian này. Nhưng giá trị bắt đầu với một xoăn cú đúp và kết thúc với một cú đúp xoăn. Vì vậy, những gì bạn sẽ đề xuất là kiểu của giá trị của cơ sở dữ liệu? Một từ điển hay, chỉ cần hơn ngắn gọn, một đối tượng. Bên phải? Đây là loại một cấu trúc dữ liệu có thể sử dụng các cấu trúc khác trong chính nó. Vì vậy, nếu toàn bộ điều này chúng tôi gọi một object-- và một đối tượng chỉ là một loạt các giá trị khóa pairs-- sự giá trị của cơ sở dữ liệu chính nó là một đối tượng. Giá trị của cơ sở dữ liệu có cả một bó các cặp giá trị quan trọng, là người đầu tiên trong số đó là chủ nhà, sau đó đặt tên, sau đó Tên truy nhập, sau đó mật khẩu, mỗi người có giá trị, trong khi đó, nó chỉ là một chuỗi nhàm chán trong dấu ngoặc kép. Vì vậy, ngay cả khi đó không phải là siêu rõ ràng chỉ được nêu ra, biết rằng đây chỉ là một là tiêu chuẩn, cách khá nhàm chán lưu trữ dữ liệu trong một định dạng chuẩn. Nhưng những sai lầm phổ biến mà bạn có thể thực hiện, ngay cả trong pset bảy, là những điều ngu ngốc chút, giống như nếu bạn vô tình bỏ qua các dấu phẩy ở đó. Điều đó sẽ dẫn đến tập tin không nhất thiết là có thể đọc được. Nếu bạn vô tình bỏ qua những thứ như báo giá, nó sẽ không thể đọc được. Vì vậy, nó là một định dạng tập tin khá nitpicky, nhưng đó là một trong đó là siêu phổ biến. Và chúng tôi xảy ra để sử dụng nó, mặc dù bạn không sử dụng bất kỳ JavaScript khác, trong pset bảy. Được rồi. Vì vậy, nhớ hình ảnh này. Chúng tôi nói chuyện về, trong HTML, mà mã có thể trông như thế này. Đây là ngôn ngữ đánh dấu siêu văn bản [Không nghe thấy] chỉ "hello, thế giới." Nhưng sau đó chúng tôi đề xuất một trong khi lại rằng nếu nó giúp, bạn có thể muốn bắt đầu suy nghĩ về vấn đề này như một cái cây. Trong thực tế, thụt đầu dòng mà chúng ta sử dụng chỉ vì khả năng đọc của hoặc vì lợi ích về phong cách của bên trái có thể loại của được dịch sang cây này, nơi bạn có một số nút gốc đặc biệt mà chúng tôi sẽ quát được gọi là tài liệu, sau đó là yếu tố HTML gốc hoặc thẻ, HTML, mà sau đó có hai trẻ em, đầu và thân. Và sau đó lần lượt, đầu có một cái tên. Và danh hiệu có một giá trị văn bản. Và cơ thể tương tự có một giá trị văn bản. Vì vậy, nếu bạn cảm thấy thoải mái nói mà có, bạn có thể mất HTML này và vẽ một hình ảnh như thế này, phía bên tay phải là một mô hình tinh thần tốt đẹp bởi vì bây giờ rằng chúng ta có JavaScript, một lập trình ngôn ngữ mà trình duyệt có thể thực hiện và giải thích cho bạn, nó chỉ ra rằng những gì chúng tôi về để làm trong mã được bắt đầu thao tác này cấu trúc cây trong bộ nhớ. Chúng tôi không cần phải xây dựng cây trong bộ nhớ. Chúng tôi không cần phải làm loại cấu trúc dữ liệu pset lăm-style phức tạp. Các trình duyệt, độc đáo đủ, thuận diễn giải HTML trên xuống dưới, trái hoặc phải, là nghĩa đen đi tay chúng tương đương với một con trỏ cho rằng toàn bộ cây miễn phí. Nó làm tất cả các công việc khó khăn. Đó là những gì Mozilla và Apple và những người khác đã làm cho chúng ta. Và với JavaScript chúng ta sẽ có thể kiểm soát và thay đổi và làm điều thú vị để cây đó, nếu không được biết đến như một DOM hoặc Document Object Model. Những loại vật? Vâng, nó chỉ ra rằng trong JavaScript, có danh sách giặt ủi này sự kiện có thể xảy ra. Và chúng tôi đã không thực sự được sử dụng đó Lời kể từ tuần zero và pset bằng không khi chúng tôi nói chuyện về Scratch. Hầu hết các bạn có thể không sử dụng một sự kiện trong dự án Scratch của bạn. Nhưng bạn có thể gọi lại đơn giản Marco Polo Ví dụ, khi chúng ta có hai sprites, một trong số đó cho biết, Marco. Các khác của người mà sau đó, khi nghe và nghe sự kiện, cho biết, Polo. Nếu không được, cảm thấy tự do để nhìn lại đó rất lâu. Nhưng điều này chỉ là để nói, và bạn có thể loại suy ra từ tên của các điều, JavaScript, nó quay ra, sẽ cung cấp cho chúng ta một cách để lắng nghe cho chuột đi xuống hoặc chuột đi lên hoặc phím đi xuống hoặc phím đi lên hoặc onselect onsubmit hoặc onresizing một cái gì đó. Nói cách khác, bất kỳ hành động thể chất rằng một con người có thể đi với một trình duyệt mà bạn làm mỗi ngày, bạn có thể viết mã cho mà nghe cho các sự kiện và sau đó làm điều gì đó thích hợp. Ví dụ, nếu bạn sử dụng Google Maps, những gì sẽ xảy ra nếu bạn nhấp chuột và di chuyển chuột, thường? Nếu bạn nhấp vào và kéo? Yeah? Đúng như vậy. Bản đồ bắt đầu di chuyển. Vì vậy, bạn có thể sắp xếp xem có gì trên đây, những gì ở trên đó. Và làm thế nào để Google thực hiện điều đó? Vâng, có lẽ, họ sử dụng một vài những sự kiện thính giả, một trong đó nói, lắng nghe trên chuột down-- vì vậy khi sử dụng thể chất đẩy trackpad của mình hoặc mình hoặc chuột của mình xuống. Và sau đó, chúng tôi đang tìm kiếm một cái gì đó giống như phong trào hoặc một số sự kiện khác cho phép chúng ta nắm bắt kéo. Và trên thực tế, kéo là tương tự như trong này dot dot dot danh sách các tùy chọn có thể. Vì vậy, đây sẽ là một mạnh mẽ cách để bắt đầu phản ứng cho người sử dụng thậm chí trước khi người đó thực sự nhấp chuột một cái gì đó rõ ràng như trình. Nhưng chúng tôi sẽ giới thiệu một vài chủ đề để đạt được điều đó. Nhưng trước tiên, chúng ta hãy chuyển tiếp để một số mã thực tế. Vì vậy, tôi sẽ đi trước và mở dom-0, đó là một ví dụ rất đơn giản ở đây là nếu tôi phóng to đơn giản có đầu vào này ở đây cho tôi. Và tôi sẽ đi trước và gõ vào "David" cho tên của tôi và nhấp vào Gửi. Và sau đó, mặc dù loại với giá rẻ, tôi nhắc này mà bật lên nói, "hello, David!" Vì vậy, đây là loại như chúng tôi "hello, world" rằng chúng tôi đã làm một lúc quay lại trong C và ngay cả trong PHP vì tôi đã tự động xuất ra tên của tôi. Tôi có thể làm tên của người khác ở đây. Tôi chỉ đơn giản là có thể thay đổi điều này với, như, Hannah, nhấn Submit. Và quả thực, các cửa sổ pop-up ít thay đổi. Bây giờ, pop-up là một trong những hầu hết các tính năng bị lạm dụng của web. Và trên thực tế, trở lại trong các chức năng chặn pop-up ngày đi vào thịnh hành vì bạn sẽ đi đến một số website-- có lẽ một place-- ngờ mà sẽ sau đó đột nhiên bắt đầu peppering màn hình của bạn với một bó toàn bộ các cửa sổ pop-up. Và vì thế khả năng này để bật lên cửa sổ ở phía trước của người sử dụng đã không được đặc biệt được đón nhận bởi nhân loại. Vì vậy, đó là lý do tại sao bạn thấy ngăn chặn điều này, mà chỉ làm cho toàn bộ điều này xấu xí. Vì vậy, chúng ta sẽ cần một cách tốt hơn để nhắc nhở người dùng. Nhưng hiện nay, điều đó dường như làm việc. Vì vậy, chỉ bằng trực giác, những gì dường như xảy ra ở đây? Tôi đi trước và bấm Gửi, và sau đó một cái gì đó đang xảy ra, rõ ràng. Nhưng những gì không xảy ra mà đã xảy ra tuần trước bất cứ lúc nào tôi nhấp Submit? Những gì đã không xảy ra trên màn hình? Lấy làm tiếc? Nạp lại. Các URL không thay đổi ở tất cả. Tôi cho rằng đây là dom-0, và tôi vẫn còn ở dom-0. Thông thường, chúng tôi muốn có được thay đổi một số khác URL, như register.php hoặc tương tự. Nhưng ngay cả khi tôi bỏ điều này bằng cách nhấn OK, nhận thấy rằng các URL vẫn hoàn toàn đặt. Và, trên thực tế, nếu tôi là một chút hoài nghi, hãy để tôi mở Chrome. Hãy để tôi mở tab Network. Và nhận thấy nó trống tại thời điểm này. Hãy để tôi đi trước và gửi lại Maria. Không có mạng lưới giao thông nào. Vì vậy, không có HTTP. Vì vậy, thực sự, nếu tôi nhìn vào mã nguồn cho this-- cho tôi đóng cửa sổ này và hãy vào View Source. Hấp dẫn. Dường như có một số thẻ mới, trong đó có kịch bản. Vì vậy, chúng ta hãy có một cái nhìn bên trong CS50 IDE chính xác những gì tôi đã gửi cho người sử dụng. Vì vậy, ở đây chúng ta hãy is-- tập trung vào các chỉ HTML. Dưới đây là nửa dưới của dom-0.html. Và nhận thấy rằng nó có một tiêu đề, một thẻ đầu, một thẻ cơ thể, một thẻ hình thức. Nhưng những gì nhảy ra ngoài với bạn như khác nhau, đặc biệt là nếu bạn đã không bao giờ bằng văn bản bất kỳ JavaScript mình. Hãy để tôi di chuyển một chút đến ngay đây. Tôi đã có một đầu vào, một đầu vào cho nộp. Tôi đã có một ID, đó là loại mới. Nhưng chúng ta đã thấy điều này với CSS. Những gì người khác chắc chắn là mới? Yeah? Tốt đẹp. Được rồi. Vì vậy mà nó nói onsubmit, chú ý những gì dường như tuân theo. Đây là một thuộc tính trong HTML danh pháp. Giá trị của nó là chuỗi này trích dẫn ở đây. Và điều này có vẻ một chút lạ ở cái nhìn đầu tiên. Đó không phải là HTML. Nó không phải CSS. Đây là, như bạn có thể đoán, JavaScript. Vì vậy, có vẻ như được xây dựng vào đây Trang web là một chức năng gọi là Greet. Và tôi suy luận rằng chỉ bởi vì đó là một từ, chào hỏi. Nó có một dấu ngoặc mở, Dấu ngoặc đơn đóng, dấu chấm phẩy. Trông giống như một chức năng C, trông giống như một chức năng PHP. Và quả thực, nó sẽ là một hàm JavaScript. Sau đó tôi trở lại sai. Chúng tôi sẽ trở lại mà chỉ trong một khoảnh khắc. Nhưng đâu là chức năng này được xác định? Vâng cho tôi di chuyển lên để phía trên cùng của tập tin. Và mặc dù nó là một đường dài, nó tương đối đơn giản. Hãy để tôi phóng to ra ở đây và tập trung vào bốn dòng. Vì vậy, trong JavaScript, chỉ như PHP, bạn chỉ nói, theo nghĩa đen, từ "chức năng" tên của các chức năng, và sau đó ngoặc với bất kỳ arguments-- không có đối số trong trường hợp này. Và không có kiểu trả về trong JavaScript, giống như PHP. Vì vậy, nó là một chút lỏng hơn so với C. Mở ngoặc móc, nẹp xoăn gần. Được xây dựng vào JavaScript là một function-- không phải là một đề nghị function-- nhưng một chức năng gọi là cảnh báo Mục đích duy nhất mà trong cuộc sống là để kéo lên đó khá xấu xí nhắc nhở rằng chúng ta đã thấy một chút thời gian trước đây. Bây giờ đây là loại một ngụm. Những gì đang xảy ra ở đây? Vì vậy, chúng ta hãy bắt đầu làm nổi bật tất cả mọi thứ ở đây. Đó là lập luận tương tự để cảnh báo. Và những gì đang xảy ra? Điều này chỉ trông giống như một chuỗi. Và hóa ra, không giống như PHP và không giống như C, nó không quan trọng trong JavaScript nếu bạn dấu nháy đơn hoặc dấu ngoặc kép. Họ sẽ là tương đương. Và thẳng thắn mà nói, nó chỉ phổ biến những ngày này cho các lập trình JavaScript để luôn luôn sử dụng dấu ngoặc đơn cho một số lý do. Nó chỉ là điều phải làm. Nhưng chúng ta có thể sử dụng dấu ngoặc kép, là tốt. Vì vậy, cộng với đó là một nhân vật mới. Nhưng những người bạn của những người đã done này trước đây, những gì cộng nghĩa là gì? Yeah. Tiếp nhau. Vì vậy, chúng ta thấy điều này trong PHP. Không chỉ là những dấu chấm nhà điều hành trong PHP sẽ nối hai chuỗi với nhau. C là một cơn đau ở cổ để làm điều này. Nhớ lại từ pset sáu, đó là một cơn đau đặc biệt là ở cổ, bạn sẽ phải sử dụng một cái gì đó giống như strcat sau khi phân bổ bộ nhớ trên stack hay heap. Bạn phải nhảy qua hoops chỉ để nối hai chuỗi. Trong JavaScript, đó là siêu đơn giản. Chỉ cần sử dụng các toán tử cộng giữa chúng. Vì vậy, các phức hợp tìm kiếm Điều này có vẻ là bởi vì vào cuối của chuỗi toàn này, tôi chỉ tiếp nhau trên một dấu chấm than. Vì vậy, nếu những gì đã nảy lên được "hello, David", "hello, Hannah," "hello, Maria", và vân vân, rõ ràng rằng điều trung ở giữa hai Điểm cộng phải cho tôi tiếp cận với những gì? Có gì trong đó cho chắc chắn? Yeah. Vì vậy, tôi sẽ giả vờ ở đây trả lời tên của họ, phải không? Vì vậy, tên của họ xuất hiện trong trận chung kết kết quả. Vì vậy, điều này có nghĩa là gì? Vâng, tôi đã đề xuất trước đó trong đó hình ảnh mà cái gọi là DOM có phần tử gốc đặc biệt này đường lên đỉnh được gọi là tài liệu. Và bây giờ, nó quay ra, đó là đi là một biến toàn cầu đặc biệt trong JavaScript, được xây dựng vào đó là một bó toàn bộ các chức năng hữu ích. Trong số các tính năng hữu ích là khả năng để có được ở bất kỳ nút hậu duệ. Những hình vuông hoặc hình chữ nhật hoặc elip chỉ là các nút trong một cây, vậy để nói chuyện. Vì vậy, nó chỉ ra rằng xây dựng vào Đối tượng tài liệu JavaScript của là một chức năng, nếu không được biết đến như là một phương pháp, đó gọi là getElementById. Cú pháp để gọi một hàm trong JavaScript đó là bên trong của một đối tượng hoặc một biến là chỉ với các ký hiệu dấu chấm. Và chúng ta thấy điều này trong C những gì các cú pháp cấu trúc. Bạn thấy điều này trong pset bảy, loại, loại, khi bạn nhìn thấy CS50 :: truy vấn. Đại tràng ruột trong PHP là một cách gọi một chức năng mà bên trong của một số đối tượng. Nhưng hiện nay trong JavaScript, nó chỉ là một dấu chấm. Và chức năng này, độc đáo đủ, loại nói những gì nó does-- có được yếu tố của ID. Một phần tử là chỉ là một tên cho một tag hoặc nút trong DOM. Và do đó, có yếu tố của ID "tên" nghĩa this-- đây là HTML của tôi. Và dựa trên HTML này, những gì nút hoặc những gì tag HTML tôi đi để lập trình được bàn giao bằng cách gọi document.getElementById? Vâng, chính xác. Tôi sẽ có được đầu vào phần tử có có ID là "tên." Vì vậy, đặc biệt, bạn có thể nghĩ của chức năng này, getElementById, như là một cách cho sao một con trỏ đến nút đó cụ thể trong cây. Chúng tôi đã không vẽ này cây, nhưng đó là một cách nhận được quyền truy cập vào đó hình chữ nhật hoặc hình chữ nhật đó bằng cách xác định duy nhất nó thông qua ID của nó. Bây giờ, tại sao điều này là hữu ích? Vâng, nó quay ra rằng khi bạn đã nhận mà nút, hình chữ nhật từ hình ảnh, mà nút bên trong của nó, đến lượt nó, có một bó toàn bộ cặp khóa-giá trị properties-- hoặc dữ liệu, một trong số đó được gọi là giá trị. Vì vậy, theo nghĩa đen, đó là loại một mouthful để giải thích toàn bộ sự việc. Nhưng vào cuối ngày, tất cả điều này là cung cấp cho bạn một chuỗi mà người dùng gõ trong thời trang thứ bậc này. Nhưng tôi không thích một vài những điều này. Hay đúng hơn, có một số sự tò mò vẫn. Tất cả điều đó dường như làm việc. Tại sao bạn nghĩ rằng tôi trở về sai sau khi gọi chào? Điều này có vẻ hơi xấu xí, mà Tôi có hai câu có cách nhau bởi dấu chấm phẩy. Hãy đoán. Nếu tôi loại bỏ trở lại sai, những gì có thể xảy ra, chỉ là bản năng? Xin lỗi, nói một lần nữa? Mở một loạt các Windows. Vì vậy, khả năng có lẽ cái gì như thế sẽ xảy ra. Những gì khác? Có thể gửi yêu cầu ở đâu? Để cùng một trang. Vì vậy, trên thực tế, đó là điều đó gần hơn trả lời ở đây, mặc dù, không giống như trong quá khứ, tôi đã không quy định các thuộc tính hành động, mà thông thường chúng ta phải làm. Hóa ra có một mặc định. Nếu bạn không xác định hành động, nó giống như nói rằng quote, unquote hoặc tên của các tập tin bản thân, mà trong trường hợp này sẽ được như dom-0.html. Nó chỉ là loại suy, hay đúng hơn là ngụ ý. Và do đó, nếu tôi không làm được điều này, chúng ta hãy chú ý. Hãy để tôi tiết kiệm này. Và tôi đã gỡ bỏ trở lại sai. Hãy để tôi trở lại này ví dụ và lực tải lại nó. Và bạn có thể đã thấy tôi đề nghị này trên CS50 Thảo luận về một loạt các lần. Nếu bất cứ điều gì đã từng diễn xuất sôi nổi và Trình duyệt không hành xử như bạn mong đợi, đôi khi bạn sẽ muốn giữ Shift và sau đó nhấn Reload. Điều đó sẽ buộc mọi file để tải lại và không sử dụng bộ nhớ cache của trình duyệt của bạn địa phương hoặc bản sao như vậy mà bây giờ, hãy để tôi đi trước và mở lên Thanh tra của tôi, các tab Network. Tôi sẽ nhấp Bảo tồn Log vì tôi không muốn nó để xóa các hàng một lần tôi bị gạt đi nơi khác. Hãy để tôi đi trước đây và gõ Andi, nhấn Submit. Được rồi. Điều đó có vẻ như mong đợi. Nó nói "hello, Andi." Hãy để tôi nhấn OK. Hấp dẫn. Chú ý rằng trang này đã thay đổi, mặc dù trang ban đầu. Chú ý các loại URL của thay đổi. Nó thêm một dấu hỏi, mà thường là chỉ tiêu mà chúng tôi đã cố gắng để gửi một cái gì đó. Và sau đó ở phía dưới, thậm chí nhiều hơn một cách rõ ràng, đây là yêu cầu HTTP thực tế, trong đó có một phản ứng của 200 mà đưa tôi trở lại đây. Vì vậy, đây không phải là những gì chúng tôi muốn làm, phải không? Bởi vì tôi không muốn tải lại toàn bộ trang. Tôi thay vào đó muốn trở lại là sai lầm cho đến ngắn mạch hành vi mặc định của trình duyệt, là, tất nhiên, để gửi trang. Vì vậy, chúng ta hãy nhìn vào một Ví dụ nhỉnh hơn. Đây là một phiên bản dom. Và hãy chú ý những điều sau đây. Đó là OK nếu bạn không grok tất cả các dòng mã. Nhưng những gì là cơ bản khác nhau về việc thực hiện điều này? Tôi sẽ định nó cư xử cùng, làm điều tương tự. Điều gì đã tôi rõ ràng là làm khác đi? Yeah? Đung [không nghe được]. DAVID Malan: Yeah. Vì vậy, các chức năng được xác định differently-- nói cách khác, vắng mặt từ hình thức, up có trên dòng 7-- hay đúng hơn, dòng 8-- không còn Tôi có các thuộc tính onsubmit. Trong ví dụ trước, tôi đã có điều này. Và sau đó tôi theo nghĩa đen đã viết code của tôi ở đây. Và sau đó tôi đã nói trở lại sai. Và nếu nó không chà xát bạn một cách sai lầm nào, nó nên bắt đầu trong chừng mực như, giống như trong HTML, khi chúng tôi bắt đầu để cùng hòa mình nó với CSS trong các thuộc tính phong cách, nó chỉ mới bắt đầu để có được một chút lộn xộn hoặc cảm thấy một chút sai. Tương tự như vậy ở đây, nếu bạn bắt đầu dùng HTML, và sau đó bạn tự động tiếng tom số mã JavaScript ở giữa một chuỗi trích dẫn, đó là không sẽ rất dễ bảo trì. Bên phải? Nó thậm chí không rõ ràng lúc đầu đặt nơi mã JavaScript là. Vì vậy, nó sẽ được thực sự tốt đẹp như một nguyên tắc thiết kế tốt hơn, chúng ta hãy giữ HTML của chúng tôi hoàn toàn tách biệt với JavaScript của chúng tôi. Vì vậy, để làm được điều đó, những gì chúng tôi đã thực hiện ở đây là following-- chúng ta chỉ cần sử dụng HTML cho chỉ đánh dấu. Và như vậy trong phiên bản một trong những điều này, tất cả Tôi có là một hình thức với một ID duy nhất. Và sau đó xuống đây, tôi đang lợi dụng của một tính năng đặc biệt của JavaScript nhờ đó mà tôi có thể có những gì được gọi là một chức năng vô danh. Vì vậy, nó chỉ ra rằng nếu tôi gọi document.getElementById của 'demo' đó là giống như đem lại cho tôi một con trỏ đến nút này trong cây của tôi, các yếu tố hình thức, vậy để nói chuyện. Bây giờ, tôi chỉ biết từ biết một chút về HTML Hiện tại chúng tôi đang có đọc một số trực tuyến tài liệu tham khảo, đó là một yếu tố hình thức hỗ trợ một bó toàn bộ các sự kiện trong listeners-- Nói cách khác, các danh sách dài dằng dặc các sự kiện nghe mà chúng ta đã thấy một chút thời gian trước đây. Tôi biết từ đọc tài liệu onsubmit đó là một sự kiện hợp lệ listener cho một yếu tố hình thức. Vì vậy, một khi tôi biết rằng, nó an toàn cho tôi làm các following-- có được nút đó từ cây, các yếu tố hình thức, và truy cập của nó được gọi là tài sản onsubmit. Vì vậy, các dấu chấm chỉ có nghĩa là đây là một tài sản, như một giá trị đặc biệt bên trong của nó. Và những gì dữ liệu kiểu tôi giao, rõ ràng, để onsubmit, đó là hiệu quả một biến bên trong của nút đó trong cây? Đó là một lĩnh vực bên trong của cấu trúc đó. Các kiểu dữ liệu là gì? Một chức năng, yeah. Vì vậy, nó chỉ ra rằng PHP có này. Và mặc dù chúng tôi không nói với bạn về nó, C cũng có chức năng con trỏ, khả năng để vượt qua và gán chức năng như biến các giá trị 'bản thân. Và chúng tôi sẽ không thoái trở lại C. Nhưng hiện nay, nó chỉ ra rằng ở phía bên tay phải ở đây, mặc dù có vẻ một chút funky, phương tiện này, hey trình duyệt, cho tôi một chức năng. Tôi sẽ không để thậm chí làm phiền cho nó một cái tên bởi vì tôi là nghĩa đen sẽ chỉ định chúng ta hãy gọi nó địa chỉ của chức năng này ngay lập tức để onsubmit. Nói cách khác, trình duyệt, bạn không cần để biết chức năng này được gọi là. Bạn chỉ cần biết nó ở đâu trong bộ nhớ. Và như vậy nó cũng đủ chỉ để có một dấu bằng có và không phải bận tâm đặt tên này, như foo hoặc chào hoặc bất kỳ từ nào khác. Và bây giờ điều này chỉ là một điều phong cách. Tôi có thể di chuyển ngoặc móc này lên the-- sorry-- dòng tiếp theo như chúng ta thường làm CS50. Nhưng trong JavaScript, đó là thực sự phong cách phổ biến chỉ cần giữ cho các ngoặc móc, các Người đầu tiên, trên dòng đầu tiên. Nhưng sau này, có không có gì thú vị. Đó ngoặc móc mở chỉ demarcates bắt đầu chức năng của tôi. Các chức năng tại là giống hệt nhau, ngoại trừ tôi đã bao gồm các giả trở lại bên trong của chức năng này. Bởi vì nó quay out-- và bạn sẽ chỉ biết điều này từ đọc các documentation-- rằng nếu các chức năng mà bạn chỉ định để xử lý onsubmit trả về false, trình duyệt chỉ biết và đồng ý không gửi mẫu đến một máy chủ. Nếu nó trở thành sự thật, nó sẽ trình nó đến một máy chủ cho lý do chúng ta sẽ thấy là hữu ích chỉ trong một khoảnh khắc. Và sau đó các dấu chấm phẩy sau nẹp xoăn có chỉ có nghĩa là tôi đang thực hiện xong việc xác định chức năng. Bạn biết những gì để gọi là sớm khi bạn nghe một bài nộp. Được rồi. Điều này vẫn còn cho là loại xấu xí. Vì vậy, những gì chúng ta càng có thể làm gì? Vâng, nó quay ra sau đó trong phiên bản hai, đó là last-- và chúng ta sẽ chỉ nhìn lướt qua này. Tại các nguy cơ làm nó xấu xí, nó quay ra rằng có một thư viện trong thế giới gọi jQuery. Và jQuery là một siêu thư viện JavaScript phổ biến đó là rất phổ biến mà hầu hết bất kỳ JavaScript-- nó không phổ biến cho mọi người nhầm lẫn jQuery với JavaScript. Tại sao? Tự JavaScript có rất cách tiết làm things-- document.getElementById, dadadadadada. Bạn sẽ chỉ có rất đường dài của mã. Vì vậy, một đồng nghiệp tên là John Resid, những người thực sự làm việc cho một khởi động lên những ngày này, đi ra với điều này năm thư viện trước đó nhiều người đã đóng góp để gọi jQuery rằng những thay đổi cú pháp trong các cách sau đây. Và chỉ cần như vậy bạn đã nhìn thấy điều này, bởi vì bạn sẽ không thay đổi thấy điều này nếu làm một dự án cuối cùng dựa trên web, này sẽ là cách tương đương thực hiện cùng chức năng sử dụng thư viện đặc biệt này. Bây giờ, thay vì tease nó ngoài trong toàn bộ, chúng ta hãy xem xét một số mô hình. Cú pháp này dường như có có bao nhiêu chức năng ẩn danh hoặc chức năng không tên hoặc chức năng lambda AKA? Hai, phải không? Và bạn có biết rằng, ngay cả khi bạn không phải là siêu thoải mái với điều này, chỉ bởi thực tế rằng nó nói function () hai lần. Và nó chỉ ra rằng những mã này là doing-- và chúng tôi sẽ tham khảo tài liệu tham khảo trực tuyến, cuối cùng, đối với một số trợ giúp với điều này. Điều này có nghĩa khi các tài liệu đã sẵn sàng, đi trước và đăng ký các chức năng sau đây như là xử lý nộp cho HTML yếu tố có ý tưởng độc đáo là demo. Và sau đó, khi điều đó xảy ra, gọi hai dòng mã. Và đây là, một cách bi thảm, một nhiều hơn cách tiết nói trở lại sai. Và chúng tôi đề cập điều này chỉ vì bạn sẽ thấy mã như thế này trực tuyến. Và nó không có gì dễ nản lòng. Nhưng thay vào đó, hãy nhớ rằng những gì sẽ được phổ biến trong JavaScript là mô hình này. Và đó là lý do tại sao chúng tôi hiển thị nó cho bây giờ. Được rồi. Vì vậy mà không ở quá nhiều vào cú pháp đó, được có bất kỳ câu hỏi về những ví dụ hay ý tưởng cho đến nay? Được rồi. Vì vậy, hãy sử dụng này cho một cái gì đó hữu ích. Làm một trang web mà chỉ cần nói xin chào, vậy và như vậy không phải là tất cả những gì thú vị, không để underwhelm. Điều này sẽ không được xinh đẹp, nhưng nó là sẽ làm một cái gì đó hữu ích. Hãy để tôi quay trở lại thư mục của tôi ở đây và mở ra, nói, form-0.html. Vì vậy, giả sử đây là sinh viên năm nhất trang đăng ký và thể thao mà không có bất kỳ CSS hoặc bất kỳ ý nghĩa của thiết kế. Và tôi muốn đi trước và đăng ký tại đây với một mật khẩu. Và tôi sẽ phải đồng ý với các điều khoản và các điều kiện và nhấn Register. Và bây giờ các trang web nói rằng, "Bạn đang đăng ký! (Vâng, không thực sự.) " Điều đó có vẻ như nó đã làm việc, nhưng hãy để tôi đi trước và buộc tải lại. Và hãy để tôi nói, không, bạn không cần địa chỉ email thực tế của tôi. Hoặc có lẽ chúng ta sẽ chỉ nói mail trong đó. Mật khẩu sẽ được, như, 12345. Và sau đó, chỉ vì tôi là một thằng ngốc, bây giờ nó là 123456789. Và tôi sẽ không kiểm tra hộp thư của bạn. Hừm. Được rồi. Vì vậy, có nhiều cơ hội để cải thiện ở đây. Và bạn biết không, hoặc sẽ thấy trong pset bảy, bạn có thể viết code-- và bạn sẽ phải viết mã trong PHP-- để bảo vệ chống lại những loại người dùng lỗi do người sử dụng rõ ràng đã không hợp tác. Và người đó đã không cho bạn tất cả các giá trị mà bạn muốn hoặc thậm chí trong các định dạng mà bạn muốn họ. Vì vậy, bạn sẽ thấy trong pset bảy mà chúng tôi chắc chắn có thể có một số nếu điều kiện mà nói nếu địa chỉ email không phải là một username@something.edu, chúng ta chỉ việc nói xin lỗi và xin lỗi cho người sử dụng nhiều, như bạn có thể trong pset bảy. Hoặc nếu họ đã không kiểm tra hộp, Hóa ra trong PHP, bạn có thể phát hiện ra rằng, cũng. Và chắc chắn nếu mật khẩu không phù hợp như trong register.php cho pset bảy, bạn có thể phát hiện. Nhưng đó là một nỗi đau trong cổ trong đó bây giờ họ yêu cầu chúng tôi đi tất cả các cách để các máy chủ. Người dùng sẽ được thông báo lỗi. Và ít nhất, trừ khi bạn sử dụng một số kỹ thuật fancier, bây giờ họ phải bấm vào mũi tên lại. Nó sẽ không được tốt đẹp, như rất nhiều trang web ngày hôm nay, nếu bạn đã có ngay lập tức nhiều hơn thông tin phản hồi, ngay lập tức? Nói cách khác, cho tôi đi đến phiên bản một, mà là có được không đẹp. Nhưng nó không có tính năng này. Malan, 12345, 123456789, không sẽ kiểm tra các hộp, Đăng ký. Mật khẩu không phù hợp. Vì vậy, mặc dù điều này pop-up là ugly-- chúng ta có thể thay thế này cuối cùng với một cái gì đó giống như Bootstrap, mà bạn sẽ thấy trong pset bảy là một library-- rất phổ biến tôi đã làm phát hiện rằng mật khẩu không khớp. Được rồi. Vâng, hãy để tôi khắc phục điều đó như người sử dụng. Hãy để tôi đi trước và nói 12345, 12345. Vẫn không kiểm tra thỏa thuận. Bạn phải đồng ý với các điều khoản và điều kiện. Vậy tại sao? Nếu chúng ta đã thừa nhận rằng có một cách, và chúng tôi đã yêu cầu bạn pset bảy để phát hiện lỗi điều kiện như thế này server-side, tại sao tôi nên cũng bận tâm làm điều này trong JavaScript? Một đối số trong là gì ủng hộ thêm gì bạn đang về để xem như some-- có phức tạp thêm. Có lẽ không có lộn ngược. Những gì nó có thể được? Đung [không nghe được]. DAVID Malan: Oh, thú vị. Khai thác tiềm năng. Vì vậy, chắc chắn, nếu bạn không xử lý sử dụng đầu vào sai lầm rằng tuyệt vời, có lẽ đó là tất cả tốt hơn nếu nó thậm chí không đạt máy chủ của bạn. Tôi sẽ đẩy lùi và có nói, bạn nên có lẽ sửa chữa cả những vấn đề đó. Nhưng đó là công bằng. Những gì khác? Đung [không nghe được]. DAVID Malan: Yeah. Mã này, như chúng ta đã nói, là giải thích trên các client-side. Nó không làm phiền các máy chủ, có nghĩa là nó không ảnh hưởng đến tải của máy chủ hoặc năng lực. Và bây giờ, tôi ít tuổi, này không có tác dụng có ý nghĩa bởi vì tôi có một người sử dụng ngay bây giờ. Nhưng nếu bạn đang ở bất kỳ website của độ nhất định, đặc biệt là lớn nhất, như Facebook, càng có nhiều bạn có thể giữ cho mọi người off các máy chủ của bạn tốt hơn vì một máy chủ, tất nhiên, chỉ có một số lượng hữu hạn của bộ nhớ RAM, một số hữu hạn các gigahertz, một số hữu hạn các điều nó có thể làm cho mỗi đơn vị thời gian. Vì vậy, nếu có nhiều người ở thế giới đánh máy chủ của bạn, vô tình đăng nhập không chính xác, chỉ là tốt nếu bạn có thể tiếp tục tải mà tắt máy chủ của bạn. Plus, đặc biệt là trên một điện thoại di động device-- nếu bạn đã bao giờ hoặc đăng nhập vào my.harvard Netid Yale hoặc các loại tương tự, có độ trễ này với rất nhiều các trang web như rằng nhờ đó mà nó mất, như, a damn thứ hai hoặc hai đôi. Và sau đó, Thiên Chúa của tôi, nếu bạn gõ nhầm, sau đó bạn phải đánh lại và làm lại nó. Vì vậy, có độ trễ, đặc biệt trên các kết nối mạng chậm hơn. Nhưng JavaScript, bởi vì nó chạy trên máy khách và không cần phải đi qua lại qua internet có khả năng chậm kết nối, bạn có thể nhận được phản hồi gần như tức thời. Vì vậy, chúng ta hãy nhìn vào điều này. Hãy để tôi mở ra form-0 và nhìn vào HTML ở đây. Và chúng ta hãy chỉ nhìn thấy những gì đang xảy ra. Đây là một hình thức mà hành động là register.php. Tôi chỉ sử dụng có được như vậy mà tôi có thể nhìn thấy các URL. Nhưng đối với mật khẩu, chúng tôi muốn chắc chắn muốn để thay đổi điều này để gửi trong thực tế. Dưới đây là một lĩnh vực đầu vào của loại văn bản. Dưới đây là đầu vào khác lĩnh vực của loại mật khẩu. Dưới đây là, nếu bạn chưa bao giờ nhìn thấy, một đầu vào của hộp loại. Nhưng không có JavaScript ở đây cứ lí do gì. Đây chỉ là HTML mà đi vào register.php. Nhưng trong phiên bản một, nơi tôi bắt đầu để có được những cửa sổ pop-up, hãy xem những gì thực sự xảy ra ở đây. Trong phiên bản một, những gì Tôi sẽ see-- tôi nghĩ tôi có thể stall đủ với đủ lời, nhưng tôi chạy ra ngoài. Trong phiên bản one-- có chúng tôi đi. Trong phiên bản một, nhận thấy sự following-- và không phải là thực hiện tốt nhất, nhưng đó là lần đầu tiên của tôi. Chú ý rằng bên dưới hình thức, tôi có một thẻ script. Và một thẻ script có nghĩa là, hey, trình duyệt, đây đến một số mã trong, thường, JavaScript. Và bây giờ, chú ý những gì tôi đang làm. Trên line-- tôi có thể hầu như không đọc it-- dòng 32, nó nói, var form-- để cho tôi một biến gọi là hình thức. Và sau đó nhận document.getElementId của "đăng ký". Cai gi đây? Vâng, hãy để tôi tua lại lên đây. Và thông báo, ah, tôi đã cho các yếu tố hình thức một ý tưởng độc đoán nhưng mô tả đăng ký. Vì vậy, điều này mang lại cho tôi một biến cho phép tôi để lấy nút đó, rằng hình chữ nhật trong cây gọi là hình thức. phương tiện form.onsubmit, hey trình duyệt, đăng ký một sự kiện nghe vào mẫu này. Nói cách khác, khi hình thức này là trình, thực thi các mã sau đây. Nó không cần một tên vì tại sao bạn cần phải biết tên? Bạn chỉ cần biết những gì để thực hiện, ergo nó là một chức năng vô danh hoặc lambda. Và chức năng đó là tất cả các dòng ở đây. Và bây giờ, phải trung thực, ngay cả khi bạn có thể không có bao giờ viết JavaScript trước khi, nó chỉ là C và PHP logic. Vì vậy, nếu form.email.value == "" - vì vậy nếu trường email là trống, la lên với người dùng với "Bạn phải cung cấp địa chỉ email của bạn. " Khác nếu form.password.value là tiếng thét trống ở người sử dụng, "Bạn phải cung cấp mật khẩu của bạn." Thêm thú vị một cách hợp lý, nếu form.password.value không form.confirmation.value-- bằng nơi đã xác nhận đến từ đâu? Hãy để tôi tua lại. Vâng, tôi gọi là đầu vào này trường ở đây mật khẩu. Và tôi gọi này ở đây xác nhận. Tôi có thể gọi nó mật khẩu hai hoặc bất cứ điều gì khác. Tôi chỉ kiểm tra một cách hợp lý rằng hai đều giống nhau. Else-- hóa ra đây là ông Boole again-- một giá trị Boolean, các hộp kiểm tra. Vì vậy, nếu tôi nói, cảm thán point-- nếu không form.agreement.checked, la lên với người sử dụng là tốt. Vì vậy, cú pháp này, bạn sẽ thấy là rất phổ biến trong JavaScript, nơi bạn có ký hiệu dấu chấm này. Bạn bắt đầu với một đối tượng ở đây. Bạn lặn vào sâu hơn để một để một tài sản như mật khẩu. Và sau đó bạn sẽ có được giá trị thực tế của nó. Và một lần nữa, đây là đầu vào. Dưới đây là mật khẩu tên. Và giá trị của nó là bất cứ điều gì con người đã thực sự gõ vào. Vì vậy, trong tất cả các trường hợp, tôi trở về false. Nhưng nếu không, tôi trở thành sự thật. Và vì vậy bây giờ chúng ta thấy một sử dụng hấp dẫn khi bạn sẽ trả về false để dừng lại những gì người sử dụng của làm và làm cho anh ta hoặc cô chọn lại hoặc gõ một lần nữa. Nếu không, chúng tôi trở lại đúng. Và hãy để tôi giới thiệu một biến thể khác của điều này chỉ để gieo một số hiểu biết của chúng. Vâng, trong phiên bản 2 này, hình thức-2-- Tôi sẽ làm điều đó với một làn sóng của một bàn tay. Điều này là, đối với những người tò mò, phiên bản jQuery, những người bạn của những người có thể muốn vọc trong thư viện riêng. Nhưng chúng ta hãy start-- và bất kỳ câu hỏi? Hãy để tôi tạm dừng trong thời điểm bởi vì đó là nhanh và rất nhiều. Nhưng điều tốt đẹp ở đây là tất cả của mã này là khá nhiều giống. Các công cụ mới là dom là gì? Những hình chữ nhật là gì? Các nút này là gì? Một chức năng ẩn danh là gì? Xử lý sự kiện là gì? Nhưng may mắn thay, hầu hết đó chỉ là vòng tròn đầy đủ từ, nói, tuần không. Được rồi. Vì vậy, một cái gì đó thú vị hơn một chút? Vâng, trước hết, hãy để tôi đi trước và mở Google Maps. Và bạn sẽ nhận thấy rằng đối với một thời điểm, trên phân chia thứ hai, thông báo những gì sẽ xảy ra khi Tôi bấm đủ nhanh. Và kết nối này tại Harvard là như vậy nhanh mà bạn không thực sự chú ý đến nó. Nhưng điều gì làm bạn loại loại xem nếu tôi nhấp và kéo thực sự nhanh chóng? Những người bạn xem trực tuyến, nếu bạn làm chậm tốc độ này đến 0.5x, bạn có thể thấy điều này tốt hơn. Điều gì đã xảy ra chỉ trước khi tôi bấm và di chuyển? Hãy để tôi thử here-- hãy để tôi làm cái gì khác, như 90.210. Hãy đi thật xa. Đó là thực sự nhanh, quá. Làm thế nào về Disney World? Hiện chúng tôi đi. ĐƯỢC. Bạn đã thấy gì trong một vài giây? Chỉ là, như, hình vuông, phải không? Giữ chỗ cho gạch? Vâng, những gì đang xảy ra ở đây? Google Maps là một ví dụ tốt đẹp của công nghệ này mà được gọi là AJAX. Và đây là nơi mà chúng ta sẽ bắt đầu sử dụng JavaScript trong một đặc biệt cách quyến rũ. Trở lại trong ngày, đã có Trang web này được gọi là MapQuest. Và tôi nên đã lấy một ảnh chụp màn hình của việc này từ những năm 1990, mà nếu bạn muốn nhìn lên đây trên bản đồ, bạn có nghĩa là sẽ nhấp một mũi tên lên ở đầu cho thấy bạn một hình vuông khác nhau của bản đồ. Nếu bạn muốn di chuyển trái, bạn nhấp một mũi tên cho thấy bạn một hình vuông khác nhau của bản đồ. Và một số trang web vẫn làm điều này hôm nay. Nhưng ngay cả MapQuest đã nhận tốt hơn, như Google Maps. Thay vào đó, những gì tốt hơn những ngày này là các trang web có sử dụng AJAX. AJAX-- hay còn gọi là Asynchronous JavaScript và XML, mà chỉ là một cách nói một công nghệ hay kỹ thuật mà cho phép trình duyệt sử dụng JavaScript để thực hiện các yêu cầu HTTP bổ sung sau khi trang đã được tải. Vì vậy, điều này có nghĩa là gì? Vâng, nó sẽ là loại gây phiền nhiễu trong Gmail nếu mỗi khi bạn muốn để kiểm tra thư của bạn, bạn đã theo nghĩa đen nhấn Control-R hay Command-R hoặc bấm vào nút Reload và toàn bộ trang darn sẽ tải lại. Bên phải? Nó sẽ nhấp nháy màu trắng có thể cho thứ hai. Bạn sẽ nhìn thấy thanh tiến trình ngu ngốc. Và chỉ để xem nếu bạn có mới mail, toàn bộ trang web và URL bạn đang ở sẽ phải tải lại. Nhưng đó không phải là những gì xảy ra trong Gmail. Bên phải? Khi bạn nhận được một email mới trong Gmail, những gì xảy ra trên màn hình? Nó chỉ hiện lên, phải không? Nó chỉ xuất hiện kỳ ​​diệu như là một hàng mới trong bảng. Điều đó thực sự liên quan đến một số tiền khá phức tạp. Trong thực tế, nếu bạn nghĩ về cây này, mà mặc dù là một trong những đơn giản ở đây, Gmail-- và tôi sẽ phải xem xét tại các mã được sure-- có thể có một bảng HTML hoặc có thể một danh sách có thứ tự mà nó ám mỗi hộp thư email của bạn như. Và vì vậy nếu bạn tưởng tượng này có là một cây trong bộ nhớ khi bạn đang sử dụng Gmail trông loại loại như thế này, khi Google nhận ra, ooh, bạn có một email mới, nó không muốn xây dựng lại toàn bộ cây. Thay vào đó, nó muốn tìm các nút trong cây đại diện cho hộp thư đến của bạn và chỉ cần chèn một nút mới. Vì vậy, rất giống với pset năm, nơi bạn đã có để chèn nút vào một bảng băm, tương tự như vậy không Google, thông qua Mã JavaScript mà nó đã được viết, đi qua cây này, tìm ra nơi là một phần hộp thư đến của cửa sổ, và sau đó chèn một hàng mới. Và một hàng mới chỉ có nghĩa là một hoặc nhiều hơn các nút mới trong một cây. Và do đó, AJAX là kỹ thuật này cho phép chính xác điều đó. Một khi bạn đã truy cập một URL, Tuy nhiên điên dài nó là, và một khi các trang có được nạp, bạn vẫn có thể lấy dữ liệu hơn từ internet-- cho dù đó là một email hoặc một gạch của một map-- lấy nó đằng sau hậu trường và sau đó chèn nó vào trang do đó con người không thực sự phải đợi cho nó. Facebook Messenger hoạt động theo cùng một cách. Bất kỳ số websites-- khác oh, trên thực tế, ngay cả điều này. Ý tôi là, đây là, thẳng thắn, loại một tính năng khó chịu trong những ngày này. Nếu tôi bắt đầu tìm kiếm cats-- này là loại dùng một trải nghiệm khủng khiếp. Nó chỉ bắt đầu tìm kiếm cho tôi. Vâng những gì là nó đang làm gì? Các URL đã không thực sự thay đổi kể từ khi tôi bắt đầu gõ. Nhưng những gì đang diễn ra trên khắp các wire-- OK, hmm thú vị. Điều gì đang xảy ra trên dây ở đây chỉ được kì quặc. ĐƯỢC. Vì vậy, hãy để tôi đi trước và kiểm tra yếu tố và đi đến tab Network và cố gắng để thực hiện điều này kỹ thuật và ít về mèo. Khi tôi gõ, theo nghĩa đen, mèo và- gì đang xảy ra per-- Tôi sẽ không để bấm vào đó. Được rồi. Vì vậy, ở đây, những gì đang xảy ra mỗi Hiện tôi gõ một ký tự, rõ ràng? Giống như, mức thấp? Điều gì đang xảy ra với mỗi người nhân vật tôi đang gõ vào bàn phím của tôi? Yeah? Đung [không nghe được]. DAVID Malan: Chính xác. Mỗi nhân vật là những người cách vào Google, một tại một thời điểm. Họ đang xây dựng một chuỗi trên máy chủ của họ đại diện tất cả mọi thứ tôi đã nhập vào cho đến nay. Và mỗi lần tôi gõ một nhân vật khác, họ sử dụng nước sốt bí mật của họ về một tìm kiếm thuật toán và tìm ra, không có nghĩa là anh trang con mèo này hoặc trang này mèo hay như thế nào? Vì vậy, trong một nghĩa nào đó, nó cung cấp cho tôi với một kinh nghiệm tốt hơn trong đó tôi thậm chí không cần phải hoàn thành suy nghĩ của tôi. Và quả thực, đó là một hữu ích điều, autocomplete nói chung. Nếu thuật toán của họ là đủ tốt và nếu tìm kiếm của tôi là đủ rõ ràng, Tôi không cần phải gõ toàn bộ từ. Họ sẽ cho tôi biết những gì nó là tôi đang thực sự tìm kiếm. Vì vậy, những gì Google gọi ngay lập tức tìm kiếm chỉ được sử dụng AJAX, bằng cách sử dụng mã số đó cho phép họ yêu cầu bổ sung nội dung thông qua một trình duyệt web đằng sau hậu trường bằng cách sử dụng này ngôn ngữ mới, JavaScript. Vì vậy, chúng tôi có một vài phút còn lại. Và hãy để tôi gọi lên bạn thân của tôi Colton lên sân khấu, vì nó dường như đặc biệt thú vị lần cuối cùng để giới thiệu một công nghệ rằng một số bạn đã bày tỏ quan tâm trong các dự án chính thức. Chúng tôi nghĩ rằng nó muốn được vui vẻ để mang lại lên một tình nguyện viên, tuy nhiên, ngày hôm nay để cho bạn thấy một bổ sung cho này cho phép you-- yeah, Tôi thấy bàn tay này đầu tiên. Nào lên. Thực hiện rất tốt. Làm tốt lắm. Tôi sẽ đến dự án này trên màn hình chỉ trong một khoảnh khắc. Tên của bạn cho tất cả mọi người là gì? EFA: Tôi Efa. DAVID Malan: Etha? EFA: Efa. DAVID Malan: Efa? EFA: Yeah. DAVID Malan: Nice để xem bạn. Được rồi. Hãy để tôi có được sẵn sàng này. Come on sang các giữa với Colton ở đây. Colton gì có trong tay hôm nay là một điều khiển từ xa. Vì vậy, thay vì chỉ đứng đó trong một ba chiều thế giới nhìn xung quanh như Colton đã làm, bây giờ Efa thể thực sự đi bộ xung quanh bằng cách đi lên, xuống, trái, và bên phải giống như một Nintendo hay Xbox controller. EFA: Tôi sẽ để rơi ra khỏi sân khấu. DAVID Malan: Tôi sẽ đứng khoảng hơn ở đây. Nhưng đó là một nguy cơ. ĐƯỢC. Vì vậy, đi trước và đưa những người trên. Hãy để tôi đi trước và chuyển sang màn hình ở đây. Hãy để tôi tắt đèn. Và Colton, cho tôi đến đứng bên cạnh bạn. Bạn có muốn giải thích ở đây với mic những gì chúng tôi đang làm? Ở đây bạn đi. COLTON: Chắc chắn rồi. Vì vậy, ngay bây giờ chúng tôi tải lên các Oculus, Tôi đoán operating-- không hoạt động hệ thống, nhưng các chương trình chính, nơi bạn có thể truy cập tất cả các trò chơi và các ứng dụng đang có trong thư viện của bạn. Vì vậy, ngay bây giờ, cần nói tap touchpad để bắt đầu. Touchpad sẽ là trên phía bên phải của tai nghe. Vì vậy, đi trước và tap-- EFA: Oh, người đàn ông. DAVID Malan: Yeah, có bạn đi. Chất lượng Efa được nhìn thấy là chất lượng cao hơn nhiều. Đây chỉ là Wi-Fi ở đây. COLTON: Vì vậy, những gì bạn đang sẽ muốn làm đang nhìn về phía đỉnh bên phải của màn hình. Yep, rằng trò chơi trên rất trên bên phải. Và sau đó khi bạn đang chọn nó, hãy chạm vào touchpad nữa. Tôi nghĩ Dreadhalls của nó. Và sau đó ở đây là a-- đây, để tôi giữ kính của bạn cho bạn. Vì vậy, tôi chỉ cho ông một bộ điều khiển. Vì vậy, bây giờ anh có thể kiểm soát các trò chơi. Ông có thể di chuyển xung quanh và các công cụ như thế. Vì vậy, đi trước và tìm đến đỉnh. Bạn sẽ thấy New Game. Vì vậy, đi trước và bạn có thể làm điều đó. Bây giờ, bạn sẽ có thể kiểm soát mình với bộ điều khiển, là tốt, ngay sau khi các trò chơi tải lên ở đây. Đây có thể là một chút đáng sợ. EFA: Bây giờ bạn cho tôi biết. ĐƯỢC. COLTON: Tất cả các quyền. Vì vậy, xác nhận rằng bạn có thể di chuyển xung quanh. ĐƯỢC. Bạn có thể di chuyển xung quanh. Hoàn hảo. Vì vậy, nếu bạn nhìn xuống, bạn có một bản đồ. Bản đồ cho thấy bạn đang ở đâu. Bạn có thể nhìn xung quanh căn phòng. Bạn hoàn toàn có thể quay lại. Vâng, chính xác. Quay lại. Vì vậy, nhìn sang bên trái của bạn. Tôi nghĩ rằng có một cái gì đó bạn có thể chọn lên trên một thùng trong phòng. EFA: Làm thế nào để tôi có được vạch ra đường? COLTON: Nhìn lên. Chỉ cần nhìn lên. Được rồi. Của bạn đó. Bây giờ đi trước và chỉ quay lại. Vì vậy, nhìn xa hơn để trái. Hãy di chuyển trái. Hãy tìm kiếm lại. Tiếp tục đi. Yeah. EFA: Oh, theo cách đó. COLTON: Yeah. Đi bộ về phía nó với bộ điều khiển. Của bạn đó. Bây giờ nó nên nói nhặt nó lên. Của bạn đó. Nhặt nó lên. Được rồi. Bây giờ, chúng ta hãy ra khỏi căn phòng này. Đi trước và đi bộ đến cánh cửa đó. Vì vậy, bạn sẽ hold-- nó nói giữ nút để buộc nó mở. Vì vậy, đi trước và giữ nút. Yep, buộc nó mở. Được rồi. Làm tốt lắm. Bây giờ chúng ta đang đi ra khỏi phòng. Vì vậy, tôi sẽ rời khỏi phần còn lại lên cho bạn và xem những gì bạn tìm hiểu. EFA: Tôi sẽ không ở trong phòng tối. Oh, chờ đợi. Bây giờ tôi phải đi xuống hành lang tối tăm? OK, tôi sẽ trở lại [không nghe được]. COLTON: Tất cả các quyền. Một số mặt hàng hơn để chọn lên. Hình như một số tiền xu. Đó là một lựa chọn khóa. Vì vậy, nếu bạn tìm thấy một khóa cửa, bạn có thể sử dụng đó. Bạn có sợ không? EFA: Chưa. COLTON: OK. Pretend-- yeah. Chỉ cần giả vờ bạn thực sự đứng ở đó. Và nếu bạn bật around-- bạn đã có để làm quen với nó. Nhưng nó có ý nghĩa. DAVID Malan: Và trong khi Efa tiếp tục chơi, vì chúng ta có thể làm điều này cả ngày, chúng tôi có thể tất cả tip-toe ra ở đây. Nhưng chúng tôi có hai cặp khác, nếu bạn muốn đến và chơi. Nếu không, chúng ta sẽ thấy bạn tiếp theo vào ngày thứ Tư. Cảm ơn bạn tình nguyện viên của chúng tôi ngày hôm nay. [Vỗ tay] [MUSIC - "Seinfeld THEME"] SPEAKER 1: Vâng, tôi là đặt một PL mới gắn vào. Tôi chỉ cần thay đổi các OLPF-- SPEAKER 2: Vậy điều gì chính xác là bạn đang làm gì? SPEAKER 1: Vâng, mỗi một trong these-- ở đây, tôi sẽ chỉ cho bạn một này tại đây. Bạn có thể nhìn thấy nó ngay tại đây. SPEAKER 3: Tôi nghĩ tôi tốt với các. Anh cần thêm nữa không? SPEAKER 4: Không, tôi là tốt. [Không nghe thấy]. SPEAKER 3: Không, [nghe được]. Có một số. SPEAKER 1: màu sắc khác nhau. SPEAKER 2: OK. SPEAKER 1: Vì vậy, cuối cùng những gì nó làm đó là điều chỉnh màu sắc of--