>> SAM GREEN: Hi, tất cả mọi người.
Chào mừng bạn đến hội thảo của chúng tôi.
Tên tôi là Sam.
HUGH Zabriskie: Tôi Hugh.
SAM GREEN: Và chúng ta sẽ nói chuyện hôm nay về JavaScript và các API Web Audio.
Chỉ cần để bắt đầu ra, đây là một phác thảo của chương trình nghị sự của chúng tôi cho các buổi hội thảo.
Chúng ta sẽ bắt đầu bằng cách nói về lý do tại sao bạn nên quan tâm đến các Web
Audio API, tại sao là JavaScript ngôn ngữ mà bạn cần cho nó,
và sau đó nói về JavaScript essentials-- như vậy giống như,
hướng dẫn bạn thông qua một số vấn đề cơ bản của ngôn ngữ,
và sau đó nói về API âm thanh ở mức độ cao.
Sau đó, Hugh sẽ nói về một số các công đoạn của sản xuất âm thanh
và sau đó giới thiệu sequencer này awesome dự án ông đã xây dựng cho các bạn các mã.
Và sau đó, chúng tôi sẽ có thời gian cho câu hỏi ở cuối cho mọi người
người đang ở đây sống.
>> HUGH Zabriskie: Cool.
>> SAM GREEN: Cool.
>> HUGH Zabriskie: Cool.
Tôi sẽ trở lại.
>> SAM GREEN: Vì vậy, điều đầu tiên.
Vì vậy, một trong những điều tuyệt vời về Web âm thanh API
là không có bộ lên yêu cầu.
Nó đi kèm được xây dựng trong hầu hết các trình duyệt hiện đại,
bao gồm Chrome, Edge, một toàn bộ bó others-- tất cả những người
phần đó lớn người đang sử dụng ngày nay.
Vì vậy, rằng không có bất lập, ngoài chỉ nhận được
một máy chủ web đi, cho bạn để bắt đầu làm việc
về dự án của bạn, đó là rất tốt.
>> Chúng tôi khuyên bạn nên khá nặng nề mà bạn xem xét
sử dụng Chrome JavaScript phát triển web,
chỉ vì phát triển của nó công cụ này là thực sự mạnh mẽ.
Như một ví dụ về những gì chúng ta có nghĩa là bằng cách nói mở JavaScript
console-- nếu bạn đi vào Chrome và bạn nhìn vào bất kỳ trang web,
và bạn nhấp chuột trái Kiểm tra Element, và sau đó
bạn đi đến ít thả xuống này ngay tại đây và bạn click vào Console,
bạn sẽ thấy những gì mở ra trông rất nhiều như một dấu nhắc lệnh mà bạn
có thể nhìn thấy trên máy Mac của bạn, hoặc trên các ID.
Và chỉ cần như thế, chúng ta có thể loại lệnh ở đây, như Clear,
và các lệnh khác như thế.
Chúng ta có thể tạo ra các biến, như chúng ta sẽ thấy sau này trong JavaScript.
Và do đó, bất cứ điều gì chúng ta có thể làm gì trong JavaScript, chúng ta có thể làm với giao diện điều khiển,
và đó là một cách siêu tiện dụng để bắt đầu chơi xung quanh với các API
và nhận được thoải mái với JavaScript phải off the bat.
Không có thiết lập lên yêu cầu, đó là thực sự tốt đẹp.
Mát.
Thật tuyệt vời.
>> Vì vậy, chỉ một điều nữa để thêm.
Nếu bạn có bất kỳ questions-- có nhiều bạn của những người không sống ở đây,
cảm thấy tự do để gửi email cho những us-- là địa chỉ email của chúng tôi.
Nếu bạn có thắc mắc bạn không muốn yêu cầu chúng tôi,
như, oh tôi có một lỗi trong mã của tôi, hay cái gì
đó là một chút cụ thể hơn, có lẽ Google nó đầu tiên.
Có rất nhiều tài nguyên tuyệt vời về API Web âm thanh ra khỏi đó.
Nó thực sự tốt tài liệu và nó được
được sử dụng bởi một tấn của người dân ở ngành công nghiệp, và những người chỉ
xây dựng công cụ thú vị cho chính mình.
Vì vậy, cần phải có rất nhiều các nguồn lực hiện có.
Thật tuyệt vời.
>> Cool, vậy tại sao Web âm thanh API?
Sơ đồ này là một chút của một quá trình tiến hóa của con đường
âm thanh trên web đã phát triển theo thời gian.
Bgsound giống như các tag HTML gốc rằng Internet Explorer sử dụng để hỗ trợ.
Nó chỉ được phép cho âm thanh khá cơ bản, các chức năng không phải là rất mạnh mẽ,
và bạn không thể làm được trình tự phức tạp,
hoặc kiểm soát âm thanh khi bắt đầu và dừng lại rất mạnh mẽ.
Vì vậy, nó không phải là đặc biệt phát triển tốt.
Rồi sau đó, Flash đến along-- đó,
Tôi chắc chắn rằng các bạn đều quen thuộc với Flash-- có lẽ không phải là cách nó hoạt động,
nhưng bạn chắc chắn đã nhìn thấy nó.
Bạn đã cập nhật Flash của bạn Plug-in, tất cả các loại công cụ,
và đó chắc chắn mở rộng phạm vi các chức năng đó đã có sẵn.
Nhưng làm cho người sử dụng cài đặt một plug-in là chắc chắn
một nhược điểm để bao gồm Flash trong ứng dụng của bạn, phải không?
Bởi vì sau đó bạn đang phụ thuộc vào người sử dụng sẽ tìm kiếm và plug-in này,
và có lẽ được quay off của bước này thêm
họ phải thực hiện để sử dụng ứng dụng của bạn.
Và sau đó có thể là một bản cập nhật rằng sẽ phá vỡ toàn bộ ứng dụng của bạn,
và nó kết thúc lên được một cơn ác mộng cho các nhà phát triển, quá.
Vì vậy, đó là một chướng ngại vật.
>> Và rồi sau đó đến cùng, các tag HTML âm thanh, mà
là một tính năng của HTML-- hiện đại hơn mà chắc chắn cho phép cho các công cụ nhiều hơn,
nhưng ngay cả những điều bạn có thể làm có được một chút giới hạn chỉ
là kết quả của những điều HTML đó là có khả năng.
Vì vậy, khi các JavaScript API, API Web âm thanh,
đã trở thành một tiêu chuẩn thực hành trên các trình duyệt,
mà thực sự mở rộng tập cơ hội cho các nhà phát triển
để thực sự có được vào tòa nhà thứ mát mẻ cho trang web.
Trong một thời gian dài có có được các công cụ thực sự mạnh mẽ
cho các ứng dụng âm thanh gốc, like-- mọi người đều biết GarageBand,
và sau đó rõ ràng là có nhiều âm thanh pha trộn các ứng dụng chuyên nghiệp,
và các loại công cụ.
Nhưng không có một thực sự tốt Cloud-- không
Cloud, yeah, tôi đoán Nền tảng web-based Cloud--
mà sẽ cho phép các nhà phát triển xây dựng các ứng dụng cho mọi người
để làm pha trộn âm thanh.
Và như ông sẽ chỉ cho bạn sau đó, Web âm thanh API
cho phép thực sự mạnh mẽ công cụ để xảy ra thực sự đơn giản,
mà là khá mát mẻ.
Vì vậy, đó là lý do tại sao bạn hướng dẫn để nên xem phần còn lại của buổi hội thảo,
về cơ bản.
>> Và bây giờ, tôi sẽ nói về một số yếu tố JavaScript-- chỉ cơ bản
của ngôn ngữ, do đó chúng ta có thể trên cùng một trang
khi chúng ta nói về API một chút sau đó.
Mát.
>> Vì vậy, đây là một bản tóm tắt.
Tôi quên này đã ở đây.
Yeah.
>> HUGH Zabriskie: Có hai slide ở đây.
>> SAM GREEN: Đây là bản tóm tắt của một số hạn chế
các ràng buộc, các phương pháp cũ khác.
Và rồi bây giờ, chúng tôi có những việc này.
Mát.
Thật tuyệt vời.
>> Vì vậy, yếu tố cần thiết JavaScript.
Trước tiên, có một sự khác biệt khá lớn
trong JavaScript so với trong một ngôn ngữ như C, trong cách
rằng các biến được tạo ra.
Vì vậy, trong C, chúng tôi đang sử dụng để có gõ biến của chúng tôi, phải không?
Và tôi không phải là loại như gõ vào, tôi có phải là loại
như gán cho chúng một ý nghĩa type-- như thế, một int, một phao, một char.
Trong C, chúng tôi đã thực sự được sử dụng để phải tạo ra một biến
và sau đó dính vào đó kiểu cho toàn bộ thời gian mà chúng ta sử dụng biến.
Và đó không nhất thiết phải là tồi tệ hơn, nhưng nó có thể là khó khăn hơn để sử dụng.
Một trong những tính năng mát mẻ JavaScript là
rằng các biến số là những gì được gọi là "kiểu động", mà
có nghĩa là tôi có thể tạo ra một biến với cú pháp đó,
varX bằng 5, ví dụ.
Mà ban đầu tạo ra một số nguyên variable--
ngay bên dưới mui xe somewhere-- nhưng tôi
có thể thay đổi biến để chỉ một chuỗi
mà không làm gì như tạo ra một biến mới.
Tôi không cần phải lo lắng về các loại thay đổi.
JavaScript biết rằng các loại của thay đổi, và điều đó xảy ra động.
>> Vì vậy, có những lợi ích và nhược điểm đó,
như bất cứ ai đã từng làm việc trong JavaScript trong một thời gian có thể biết.
Có những lúc bạn có thể vô tình
thay đổi kiểu của một biến và không xử lý kiểu thay đổi,
và sau đó bạn JavaScript có thể crash-- hoặc một ngoại lệ
được ném ra, bởi vì bạn sẽ có loại sai khi bạn mong đợi một loại.
Mát.
>> Vì vậy, scoping-- đó là như thế, nếu chúng ta nhớ những tuần đầu khóa học,
đề cập đến cách nhìn thấy một biến là gì và trong khu vực của các mã.
Tất cả trông rất giống đến hình thức của nó trong C.
Vì vậy, các biến được scoped thường trong dấu ngoặc nhọn trong một hàm,
và sau đó cũng có biến toàn cầu scoped rằng
are-- nếu bạn viết một biến bên ngoài của một hàm,
nó sẽ được hiển thị trong toàn bộ văn bản.
>> Một sự khác biệt giữa JavaScript và C nói riêng,
là nếu bạn khai báo một toàn cầu bất cứ nơi nào biến trong một tập tin văn bản
nó vẫn hiện hữu trong bất kỳ chức năng trong tập tin văn bản.
Đó là đúng, phải không?
>> HUGH Zabriskie: Yep.
>> SAM GREEN: Vì vậy, đó cũng là một chút bit sôi nổi so với C,
nơi mà chúng ta luôn luôn phải có của chúng tôi các định nghĩa biến trên các nơi
chúng được sử dụng.
Đó không phải là một nguyên tắc đó là thực thi nữa, do đó, một chút khác nhau.
Và một lần nữa nhấn mạnh lại, toàn cầu so với variables-- địa phương
rất tương tự như C. Bạn có thể có hai biến có cùng tên,
và có một trong những tên của họ được theo dõi bởi một biến địa phương nếu một trong số họ
là toàn cầu.
Loại như vậy, tương tự vấn đề mà một số bạn
có thể đã chạy vào trong một số các vấn đề của bạn đặt ra cho đến nay.
Cool, vì vậy đó là các biến.
>> Kiểm soát dòng chảy, có nghĩa là như thế, if-else-- stuff-- logic và vòng lặp.
Vì vậy, để bắt đầu, đây là những gì if-else báo cáo như thế nào trong JavaScript.
Sự sắp xếp của những điều khác nhau trên đường dây là không quan trọng.
Đây chỉ là một trong các công ước cho cách thức mã cấu trúc chúng ta.
Cũng giống như trong C, chúng ta có một "nếu", một tuyên bố ngoặc.
Đó không phải là những gì tôi có nghĩa là để làm.
Tôi đã làm nó một lần nữa.
>> HUGH Zabriskie: Đang cố gắng để thoát khỏi?
SAM GREEN: Không, tôi chỉ cần cố gắng để phóng to.
Nó không quan trọng.
>> Vì vậy, chúng ta có một "nếu" tuyên bố và chúng ta có một điều kiện bên trong của nó
rằng để đánh giá đúng hay sai, và xác định có hay không
chúng ta bước vào mà khối mã.
Và tương tự như vậy, chúng ta có một else-if, và một người nào khác, giống như chúng ta đang sử dụng để trong C.
>> Bạn cũng nên khá thoải mái ngay lập tức với các vòng,
vì họ cũng nhìn rất giống C trông.
Nhưng bạn sẽ nhận thấy rằng chúng ta chỉ có, thay vì int khởi tạo,
chúng tôi có var việc khởi tạo.
Và tôi đoán bạn có phải cẩn thận để làm cho
chắc chắn bạn không thay đổi giá trị của tôi từ một int cho một chuỗi,
ví dụ, bởi vì điều đó sẽ gây ra hành vi lạ bạn có thể không
chờ đợi.
Nhưng điều này nên nhìn khá quen thuộc, là tốt.
>> Vì vậy, đây là nơi mọi thứ bắt đầu có được một chút điên rồ trong JavaScript
cho một người đang đi từ một nền của C. Có chức năng
trong JavaScript, và có một cách để khai báo một hàm trông
loại tương tự như C, và sau đó có một số khác mà
trông loại khác nhau.
>> Phiên bản đầu tiên, mà chúng ta có thể thấy ở đây,
là loại C-như, nơi chúng tôi nói, đây là một chức năng,
cung cấp cho nó một cái tên, cung cấp cho số lượng các đối số,
và sau đó các nội dung của hàm đi vào bên trong những dấu ngoặc nhọn.
Chúng ta sẽ thấy một ví dụ về đối số chỉ trong một giây.
>> Trong khi đó, trên dòng tiếp theo, chúng ta thấy, oh, đây là một biến gọi là "myFunction,"
và chúng tôi bằng nó thế này function-- thing-- chung chung mà
dường như không có bất cứ điều gì xảy ra.
Lý do đó là khác nhau hơn so với C là JavaScript
là những gì được gọi là một ngôn ngữ chức năng, hoặc có yếu tố chức năng, có nghĩa là
có chức năng là thực sự giá trị.
Và điều đó có nghĩa là chúng ta có thể thiết lập một biến bằng với một chức năng
và sau đó di chuyển chức năng xung quanh, vượt qua nó như một tham số,
làm tất cả các loại công cụ như thế với chức năng.
>> Một điều khác để note-- chức năng được viết
với một số lượng nhất định các đối số.
Chúng ta sẽ thấy một ví dụ về một hàm với một đối số vào các slide tiếp theo.
Nhưng JavaScript sẽ không hét lên với bạn nếu bạn cố gắng
sử dụng một chức năng với sai số của các đối số.
Nó sẽ chỉ làm hết sức mình để làm cho làm, nghĩa là nếu bạn vượt qua,
bạn gọi một chức năng mong đợi một lập luận không có đối số, tất cả những gì
sẽ xảy ra là nó sẽ làm hết sức mình để cố gắng và thực thi mã,
và nếu nó cuối cùng chạy vào một ngoại lệ hay một lỗi,
nó sẽ ném ngoại lệ đó và chỉ cần giữ going-- đó chỉ là một trong những cách
mà các công trình JavaScript.
Yeah.
>> Đung gì sẽ xảy ra nếu có quá nhiều tranh luận?
SAM GREEN: Vì vậy, các Câu hỏi là, những gì sẽ xảy ra
nếu có quá nhiều tranh luận?
Và câu trả lời là JavaScript sẽ chỉ
bỏ qua những cái được sau khi những người dự kiến.
Nó sẽ cố gắng để thực hiện chức năng gọi như thể nó chỉ là lần đầu tiên hai.
Bên phải?
>> HUGH Zabriskie: Đúng, yeah.
Tương tự như vậy, nếu có là quá ít đối số,
nó chỉ là loại cho null để tất cả các tham số của nó không có bất kỳ giá trị
cho.
>> SAM GREEN: Những thể thực sự là tiện dụng, nếu bạn
muốn viết một chức năng mà mất một đối số số biến.
Bạn có thể thiết lập các giá trị mặc định trong định nghĩa của các chức năng,
và nó có thể bỏ qua thực tế rằng các đầu vào không có ở đó.
Vì vậy, tôi muốn nói một chút thêm về viên đạn cuối cùng này
điểm, đó là chức năng là những giá trị.
Đây là một ví dụ đó là một chút tâm-thổi
nếu bạn chỉ cần đọc nó, và đừng nghĩ về những gì đang xảy ra trong một giây.
Vì vậy, chúng ta hãy nhìn vào chỉ dòng đầu tiên ở đây.
Chúng tôi có biến này, f1, mà chúng ta nói là một chức năng nào điều này.
Và nội dung của hàm được console.log ('hello').
Bạn có thể nghĩ console.log như JavaScript tương đương của printf.
Vì vậy, những gì sẽ xảy ra là, nếu chúng ta chạy mã này trong trình duyệt của chúng tôi,
nó sẽ in ra một chuỗi.
Tôi có thể chứng minh điều đó.
Đung By đăng nhập, tuy nhiên, làm thế có nghĩa là nó được ghi lại ở đâu đó?
SAM GREEN: Yeah.
Vì vậy, tôi sẽ cho bạn thấy những gì sẽ xảy ra.
Vì vậy, câu hỏi là, những gì hiện log nghĩa là gì?
>> HUGH Zabriskie: Vậy console.log giống như printf cho C.
SAM GREEN: Vì vậy console.log giống như printf,
vì vậy nếu tôi có console.log này ('hello'), và tôi gọi đó, các chuỗi "hello"
được in ra để giao diện điều khiển.
Đây là giao diện điều khiển.
Nó giống như printf, nơi nó in ra để tiêu chuẩn.
Và chúng ta sẽ thấy trong một phút, nhưng điều này là thực sự
đề cập đến các đối tượng giao diện điều khiển, và gọi một phương thức trên đối tượng đó.
Điều đó sẽ có ý nghĩa hơn trong một phút khi chúng tôi
nhận được để nói về đối tượng trong JavaScript,
nhưng tôi nghĩ tôi sẽ chỉ đề cập đến đó.
HUGH Zabriskie: Chúng tôi sử dụng để trong C, right--
chúng tôi thường viết một chương trình lớn trong chính để làm bất cứ điều gì.
Nhưng những gì là mát mẻ trong JavaScript là bạn có loại thông dịch
chạy trong thời gian thực, vì vậy nó chỉ mất từng dòng,
nó chỉ có thể giải thích điều đó ngay tại chỗ.
Và nó theo dõi điều đó đã chạy trước,
do đó, nó là một công cụ khá hữu ích cho sử dụng console.log, hoặc giao diện điều khiển,
nói chung, chỉ chơi xung quanh với JavaScript.
>> SAM GREEN: Quay trở lại với này example-- dòng thứ hai của mã
ở đây là khá tâm-boggling trong đầu tôi.
Lần đầu tiên tôi đọc, nó được như thế, những gì đang xảy ra?
Vì vậy, những gì đang xảy ra là, này khai báo hàm nói,
Tôi có một chức năng gọi là f2 đó là mong đợi một đối số, f,
và sau đó nó gọi mà chức năng, f, mà
đã được thông qua để nó như là một đối số không có đối số của chính nó.
Vì vậy, đó có thể là khó hiểu.
Nếu chúng ta hiểu điều này như f2 mất f1 như một tham số, và sau đó bên trong của f2,
f được called-- mà phương tiện mà dòng mã này,
sau khi hai dòng mã, kết quả trong "hello"
được in ra console.
>> Thực tế là chúng ta có thể vượt qua chức năng xung quanh như các giá trị
kết thúc lên được một trong những nhất tính năng mạnh mẽ của JavaScript
như là một ngôn ngữ lập trình.
Bên ngoài của tất cả các điều tuyệt vời nó có thể làm,
chỉ là một tính năng của ngôn ngữ trong điều kiện của cách
mà nó làm cho mọi thứ dễ dàng chương trình và cho phép
cho những thứ mà không phải là đặc biệt rất phù hợp với các trang web,
lập trình chức năng và chức năng khía cạnh lập trình JavaScript
là một trong những nhất khái niệm mạnh mẽ
tồn tại trong JavaScript-- nếu bạn hỏi tôi.
Mát.
>> Vì vậy, điều tiếp theo.
Ngoài việc là chức năng, cũng có những yếu tố của JavaScript
đó là hướng đối tượng, đó là một trong số rất
Nói cách buzz phổ biến trong khoa học máy tính.
Lập trinh Hương đôi tượng là một điều thực sự phổ biến.
JavaScript có một phiên bản đó, nơi mà tôi tin rằng mọi giá trị cũng là
một đối tượng, trong đó có nghĩa là mọi đối tượng kết thúc tốt đẹp với nhau một số lượng các giá trị.
Vì vậy, đối với các giá trị mà đơn giản, giống như một số nguyên, như varX bằng 5,
đối tượng đó chỉ kết thúc tốt đẹp mà một giá trị.
>> Nhưng chúng ta cũng có thể tưởng tượng một tình huống where-- chúng ta có thể nghĩ về tình huống trong C
nơi chúng tôi muốn làm một cái gì đó với cấu trúc,
Ví dụ, kết thúc tốt đẹp nhiều giá trị với nhau và làm cho
nó thực sự dễ dàng để vượt qua những thứ xung quanh.
Đó là khi một đối tượng là trong JavaScript.
>> Điều quan trọng là phải nhớ khi tôi nói rằng các đối tượng bọc
số lượng các giá trị với nhau, mà chức năng cũng là
giá trị, có nghĩa là chức năng có thể cũng được bên trong của một đối tượng JavaScript.
Và lý do đó là quan trọng là, trong khi chúng ta thường
nghĩ về gọi một phương thức trên một đối tượng đó
một thuật ngữ phổ biến từ khác ngôn ngữ hướng đối tượng phổ biến,
một trong những sự khác biệt ở đây là tất cả những gì một phương pháp là trong JavaScript
là một giá trị được lưu trữ bên trong của một đối tượng mà thực hiện một số action-- thể
sử dụng các giá trị khác được bên trong của đối tượng đó, nhưng không nhất thiết.
Vì vậy, bạn có thể tưởng tượng một tình huống, tôi đoán trong một chút của một cách điên rồ,
nơi bạn được gọi là một phương pháp của một phản đối trên một đối tượng khác, ví dụ.
Vì vậy, đó là một chút sôi nổi theo cách đó.
>> Và bạn cũng có thể thay đổi các phương pháp được liên kết với một đối tượng
bằng cách gán cho rằng phương pháp một chức năng mới, đó cũng là
khá khác nhau từ khác ngôn ngữ hướng đối tượng, nơi
một khi chúng ta khai báo một đối tượng và nhanh chóng nó,
chúng ta không thể thay đổi các phương pháp đó là kết hợp với đối tượng đó nữa.
Vì vậy, đó là khá khác nhau.
Mát.
>> Vì vậy, đây là một ví dụ, đầu tiên, của một đối tượng trong hành động.
Đây là những gì được gọi là một đối tượng chung chung, mà
có nghĩa là nó không có bất kỳ tên cụ thể, không có một lớp học,
nó chỉ là một số bao bì của các giá trị.
Và cách mà trông là, chúng ta có cặp bên ngoài này của xoăn niềng răng đây
mà chỉ ra cho JavaScript và nói, đây là một đối tượng.
Các giá trị bên trong của nó là mỗi giá trị bên trong
của các đối tượng mà nên được bao bọc với nhau.
Và bên trong của đối tượng đó, sau đó chúng ta có các cặp giá trị quan trọng,
mà chính đề cập đến tên các giá trị bên trong của đối tượng,
và side-- khác đối diện here-- đại tràng
là giá trị thực tế mà sẽ được lưu.
>> Vì vậy, bạn thấy ở đây chúng ta có một phím gọi là fn với giá trị sam,
theo sau là một dấu phẩy, nói lên mục tiếp theo.
Sau đó, một phím gọi là ln, với một giá trị của màu xanh lá cây,
theo sau là một dấu phẩy, tiếp theo là "in"
đó là sẽ có một giá trị chức năng có nghĩa là sẽ làm dòng mã này.
Hãy lùi lại một bước và giải nén những gì đang xảy ra ở đây.
Vì vậy, đây là một chút phức tạp, và chúng ta đang nhìn thấy một cái gì đó mới
cho lần đầu tiên.
Các "này" từ khóa là điều mới chúng ta đang thấy ở đây, và điều này không
là, đề cập đến hiện tại đối tượng trong phạm vi, phải không?
Vì vậy, khi chúng ta nói, này chỉ tất cả các cách trở lại
để toàn bộ object-- này khi chúng ta làm this.fn,
chúng ta sẽ đi tất cả các cách trở lại đến đối tượng này, đi đến các giá trị fn
và nhận được sam, kéo nó tất cả các cách trở lại, dính nó ở đây, và sau đó di chuyển trên.
>> Đung Vì vậy, với việc thu hồi, là mà thực hiện vì các tham số
Định nghĩa?
SAM GREEN: Vậy câu hỏi là, là thu hồi thực hiện vì các tham số
Định nghĩa?
Vâng, hoàn toàn.
Chuyện gì sẽ xảy ra ở đây là, dot này nói với JavaScript,
OK, tôi nhận được một số giá trị từ đối tượng này từ bản thân mình.
Và sau đó nó sẽ tìm một entry gọi fn, và nếu nó tìm thấy nó,
nó sẽ trả lại rằng value-- như vậy, đó là sam.
Nhưng tôi cũng có thể đã gõ một cái gì đó mà không được định nghĩa ở đây,
và sau đó nó sẽ chỉ trở undefined-- mà
là một điều mà JavaScript có thể làm, mà có thể có lợi ích,
nhưng nó also-- nếu bạn thực hiện một lỗi đánh máy, nó có thể dẫn đến lỗi lạ.
Vì vậy, nó sẽ chỉ cố gắng tìm bất cứ điều gì bạn nói với nó để tìm
và nó sẽ không phàn nàn nếu không tìm thấy nó.
Nó sẽ chỉ nói rằng, tôi đã không tìm thấy nó, và sau đó di chuyển trên.
Vì vậy, nó sẽ không được định nghĩa, cộng với trống, cộng với tên cuối cùng.
Yeah.
Và sau đó chúng ta có thể thấy rằng nếu chúng tôi sau đó có thể đi xuống và access--
và chúng tôi gọi tf.print () với dấu ngoặc đơn.
Nó sẽ gọi in mà hàm không có đối số, phải không?
Nhưng nếu chúng ta chỉ nói tf.print () dấu chấm phẩy, mà không có dấu ngoặc đơn,
tất cả những gì đã có thể làm là kéo hiện chức năng từ các giá trị,
nhưng không thực sự gọi nó.
Mát.
HUGH Zabriskie: Có nên chúng tôi làm cho một đối tượng?
SAM GREEN: Chắc chắn, chúng ta hãy làm điều đó.
Vì vậy, tôi có thể di chuyển này ví dụ để các giao diện điều khiển.
Chúng ta có thể tưởng tượng rằng tôi có một đối tượng.
Vì vậy, đây là một đối tượng đơn giản.
Đây là một đối tượng có chứa hai giá trị với hai phím, hai giá trị quan trọng
cặp.
Vì vậy, tôi sau đó có thể truy cập các giá trị được lưu trữ bên trong của đối tượng này bằng cách làm x.x1,
ví dụ, và tôi nhận được 1 trở lại.
Tương tự như vậy, x.x2, có được giá trị đó trở lại.
>> Và bây giờ điều thực sự thú vị là, tôi có thể thực sự thêm một cái gì đó để đối tượng này
sau khi tôi đã tạo ra nó.
Vì vậy, bạn có thể tưởng tượng, chúng ta hãy nói rằng tôi có một chức năng.
>> HUGH Zabriskie: Bạn phải làm Shift-Enter.
>> SAM GREEN: Oh, đó là gây phiền nhiễu.
Sao nó không thích những gì?
Oh.
Ở đây chúng tôi đi.
Mát.
>> Vì vậy, tôi vừa tạo chức năng này, f, mà
sẽ đi đến hiện tại đối tượng và in this.x1.
Vì vậy, nếu tôi chỉ cần gọi f bởi chính nó, không có gì đang xảy ra
xảy ra, phải không, vì không có x1 lĩnh vực trong các đối tượng mà nó đang nói đến.
Nhưng, nếu tôi nói, x.f = f, và sau đó tôi gọi x.f (), tôi sẽ nhận lại 1.
Điều đó hàm f tại là liên kết với các đối tượng x,
trong đó có một phím gọi là x1 kết hợp với các giá trị 1,
do đó, khi chúng tôi gọi this.x1, nó sẽ tìm thấy những gì nó đang tìm kiếm
và có thể in một giá trị ra.
Vì vậy, đó chỉ là một ví dụ các loại của những điều điên rồ
bạn có thể làm với các đối tượng trong JavaScript.
>> Vì vậy, phiên bản đó là phiên bản chung, ý nghĩa
mà chúng tôi đã tạo ra một đối tượng sử dụng này ngoặc ký hiệu cú đúp notation--,
rather-- và đó là tiện dụng nếu chúng ta chỉ muốn
một ví dụ của một đối tượng cụ thể, nhưng nếu chúng ta muốn có nhiều hơn một
cùng loại?
Và câu trả lời đó Câu hỏi là, có những điều
được gọi là các lớp học trong JavaScript là tốt.
Chúng ta có thể tạo ra một chức năng mà hiện một số loại khởi tạo
cho một đối tượng nước ngoài, và chúng tôi muốn nói, như thế,
class-- của tôi vì vậy tên của object-- thể tái sử dụng
bằng chức năng đặt nó lên.
Vì vậy, điều này sẽ tương đương với để được tạo ra một đối tượng
sẽ chỉ là thích, ngoặc móc, str, đại tràng,
này là một chuỗi, dấu chấm phẩy, dấu ngoặc nhọn.
Đó sẽ là generic đối tượng chúng ta khởi tạo,
với một sự khác biệt là trên dòng tiếp theo chúng ta tạo ra một mẫu thử nghiệm, trong đó
có nghĩa là nó là một khóa mặc định chúng ta thêm vào đối tượng của chúng tôi
có giá trị được liệt kê ở đây.
Có nghĩa là, khi tôi tạo ra một mới thể hiện của đối tượng MyClass này,
nó sẽ có tiền xây dựng bên trong của cho nó một giá trị gọi là str và giá trị khác
gọi myPrint, đó là sẽ là một chức năng.
Thật tuyệt vời.
>> Thật tuyệt.
Vì vậy, điều cuối cùng nói về JavaScript
là nó thực sự hữu ích cho những gì được gọi là hoạt động không đồng bộ.
Phương tiện không đồng bộ là chúng tôi có thể chờ đợi cho một số hoạt động
để hoàn thành trước khi chúng tôi di chuyển trên, nhưng di chuyển vào trong khi chúng tôi chờ đợi
và sau đó có một cái gì đó xảy ra sau này.
Và những gì tôi có ý nghĩa bởi đó là, bạn có thể tưởng tượng một tình huống mà
bạn gửi một yêu cầu đến một số máy chủ web nơi nào đó,
và nó sẽ gửi lại cho bạn một số đoạn lớn của dữ liệu, phải không?
Và người dùng của bạn có thể chờ đợi trong khi chờ đợi điều đó xảy ra,
và không có gì có thể xảy ra tại thời điểm đó.
Nhưng đó không phải là một thiết kế tuyệt vời, phải không?
Bạn không muốn các trang web để đóng băng.
Điều gì nếu người dùng muốn bấm vào một trình đơn thả xuống?
Nó không phải là một mẫu thiết kế tuyệt vời.
Thay vào đó, về cơ bản những gì JavaScript không được nói,
OK, làm hoạt động này không đồng bộ.
Vì vậy, như thế, chờ đợi trong nền, và sau đó khi các hoạt động được thực hiện,
gọi callback function-- gọi một số chức năng,
sao một số action-- để báo hiệu rằng hoạt động chúng tôi đã chờ đợi để kết thúc
kết thúc.
Và lý do đó là siêu mạnh là, chúng ta có thể làm điều gì đó, vượt qua một đối số,
làm điều gì đó, và sau đó chờ đợi cho một cái gì đó xảy ra.
Sau đó, một khi một cái gì đó hoàn tất, chúng ta có thể gọi một cuộc gọi lại.
Đó là thực sự tiện dụng vì nó cho phép chúng tôi làm việc với API Web âm thanh,
Ví dụ, như tải một tập tin âm thanh từ một máy chủ từ xa
mà không cần phải chờ đợi toàn bộ tập tin âm thanh được nạp,
đó sẽ là thực sự xấu cho người dùng kinh nghiệm.
Mát.
>> Vài ghi chú về gỡ lỗi, vì đây
là một điều bạn sẽ phải làm như là một phần của dự án của bạn, đảm bảo.
Tôi đề cập đến điều khiển JavaScript.
Đó là một tính năng siêu hữu ích của tất cả các trình duyệt hiện đại,
Và chúng tôi thực sự khuyến khích các bạn thoải mái sử dụng giao diện điều khiển của bạn,
nếu bạn muốn có được tốt ở JavaScript.
Đó là siêu tiện dụng cho gỡ lỗi, nhưng nó cũng
thực sự hữu ích cho việc tìm hiểu làm thế nào để sử dụng một API.
Nó cho phép thực sự dễ dàng thử nghiệm
mà không cần phải gõ một số mã, và sau đó biên dịch nó.
Bạn không cần phải làm tất cả các bước.
Bạn chỉ có thể viết một số mã vào một dòng,
và sau đó nhận được thông tin phản hồi ngay lập tức về có hay không có dòng mã
worked-- rất tiện dụng.
>> Và cũng có thể, chỉ là một note-- kỹ thuật bảng điều khiển JavaScript là một ví dụ
của một REPL-- vì vậy đó là R-E-P-L, REPL, đó là viết tắt cho đọc, đánh giá,
in loop.
Bạn đang đi đến gõ một số công cụ trong, nó sẽ đọc những gì bạn gõ vào,
nó sẽ đánh giá nó, và nó sẽ in ra đầu ra, và sau đó nó sẽ bắt đầu lại.
Điều đó cho phép bạn nhanh chóng đi vào vòng lặp, mà là thực sự mát mẻ.
>> Tôi đoán cuối cùng thực note-- này là lưu ý cuối cùng thực tế, có.
Làm thế nào để chúng ta thực sự sử dụng JavaScript?
Vì vậy, đầu tiên, chúng tôi có thể nhập khẩu nó sử dụng một thẻ script
ở trên cùng hoặc dưới cùng của một HTML file-- bất cứ nơi nào bên trong của một tập tin HTML,
thực sự.
Và trong một thẻ script, có hai tiểu cách nhập JavaScript.
Đầu tiên là bởi có một tập tin JavaScript riêng biệt
mà chúng tôi nhập khẩu toàn bộ, hoặc bởi có một diện tích mã như kịch bản
để bắt đầu, và sau đó script dấu chéo ngược để kết thúc.
Và sau đó chúng ta chỉ cần viết JavaScript bên trong các tập tin HTML.
Đó là hai cách.
Bạn không thể có nó bên trong của HTML.
Đung là một tốt hơn so với người khác?
SAM GREEN: Câu hỏi là, là một trong tốt hơn khác.
Vì vậy, có, như là một thực hành phong cách mã hóa, và cũng có thể nó giống như một thiết kế thực hành.
Có hai lý do lý do tại sao nó có thể được tốt hơn.
Đầu tiên là, nó làm cho mã của bạn một nhiều dễ đọc hơn nếu tất cả các HTML của bạn
là ở một nơi, tất cả các CSS của bạn đang ở một nơi khác, tất cả các bạn JavaScript
là ở một vị trí thứ ba.
Bên phải?
Tôi nghĩ chúng ta nên đã nói chuyện về nó trong sections-- như CSS-- gì
rằng is-- và nó đi thường trong tập tin khác.
Vì vậy, loại tương tự của khái niệm ở đây.
Bạn cũng có thể tưởng tượng rằng JavaScript sẽ được tái sử dụng trên nhiều hơn một
Trang HTML, hoặc có lẽ một Rất đông các trang HTML,
và có JavaScript refactored thành một
tập tin mà bạn có thể nhập khẩu vào nhiều hơn một nơi
cho phép mã được cách duy trì nhiều hơn.
Bạn có thể tưởng tượng làm cho một thay đổi để các JavaScript
và phải thay đổi nó trong 100 tập tin khác nhau.
Và thay vì chúng ta chỉ có thể thay đổi nó trong một, mà là cách mạnh mẽ hơn.
Tôi đã trả lời câu hỏi của bạn?
Mát.
>> Chúng tôi cũng có thể gõ vào bàn điều khiển, như chúng tôi đã đề cập trước đây.
Và một lần nữa, một note-- cuối cùng Web Audio được tích hợp sẵn,
bạn không cần phải tải bất cứ điều gì.
Mát.
Có bất kỳ câu hỏi nào, bạn có câu hỏi nữa về JavaScript,
trước khi chúng tôi di chuyển trên?
>> Đung [Không nghe thấy]
SAM GREEN: Tất cả các bên phải, thoáng mát.
Vì vậy, bây giờ anh ta sẽ nói về các API.
>> HUGH Zabriskie: Cool.
Cảm ơn, Sam.
>> SAM GREEN: Chắc chắn.
HUGH Zabriskie: Awesome, vì vậy chúng tôi sẽ chuyển từ JavaScript.
Vì vậy, chúng tôi đã nói về một số các yếu tố cần thiết của JavaScript,
và đó là những biến, chức năng, đối tượng, chức năng như các biến,
tải không đồng bộ.
Đây là tất cả những điều mà bạn sẽ thấy xem như bạn sử dụng Web Audio.
Vì vậy, chúng tôi chỉ cần đi để nói chuyện về nó đầu tiên ở mức cao.
>> Nó là một API, do đó, nó là một cái gì đó đó là xây dựng, như Sam cho biết,
ngay vào JavaScript mà bạn sử dụng trong giao diện điều khiển.
Và nó thực sự giống như C ++ đó là thực sự được xây dựng vào Chrome
và Firefox, và tất cả các trình duyệt.
Vì vậy, ý tưởng chính với Web Âm thanh là bạn có
loại đường ống dẫn âm thanh, phải không?
Vì vậy, dữ liệu âm thanh của bạn đi kèm trong một số hình thức.
>> Có ba loại forms-- chính bạn có dao động, mà
tạo ra một làn sóng sin, cos sóng, chúng ta sẽ xem làm thế nào mà làm việc.
Một số khác rất phổ biến, Tất nhiên, là một MP3.
Vì vậy, có thể bạn bắt đầu với một bài hát, và sau đó bạn
muốn làm một số bộ lọc để đó và đầu ra
that-- đó có thể là một nguồn có thể.
Và sau đó là một thực sự mát mẻ một là microphone.
Vì vậy, bạn có thể sử dụng một số rất cuộc gọi cơ bản trong JavaScript
để có được quyền truy cập vào các microphone, và do đó, nếu bạn
muốn làm cho một ứng dụng như một máy dò sân,
ví dụ, mà mất trong thoại và số liệu ra của bạn
các pitch-- cách rất dễ dàng để đó.
Bạn có thể chỉ cần loại đọc nó trong, tìm ra các tần số,
và sau đó sản lượng một số.
Vì vậy, chúng tôi sẽ xem làm thế nào mà làm việc, là tốt.
>> Các điểm đến là về cơ bản nơi mà các dữ liệu âm thanh được xuất ra.
Vì vậy, nói chung, đó là giống như loa máy tính xách tay của bạn.
Các tùy chọn khác là như thế một ScriptProcessorNode--
chúng tôi sẽ nhận được để các nút trong một second-- nhưng về cơ bản,
hoặc là bạn đang đặt ra âm thanh thông qua máy tính của bạn thông qua loa,
hoặc bạn đang loại ghi lại nó, vì vậy bạn đang lưu trữ nó như dữ liệu âm thanh.
Vì vậy, có lẽ nếu ai đó tạo ra âm nhạc trong ứng dụng của bạn và sau đó
bạn muốn ghi lại điều đó và có lẽ như xuất khẩu nó vào SoundCloud, cho example--
đó sẽ là một cách để làm điều đó.
Tất cả những thứ vui vẻ, mà chúng tôi sẽ nói về,
xảy ra giữa hai điểm này, nơi chúng ta nạp trong âm nhạc
và sau đó ra nó.
>> Vì vậy, tôi sẽ nói về năm giai đoạn của sản xuất âm thanh trong một giây.
Chúng tôi có điều này được gọi là một AudioContext, mà
là wrapper nhỏ này, chúng ta thấy ở đây.
Về cơ bản những gì AudioContext is-- nếu chúng tôi đi đến bảng điều khiển JavaScript ngay bây giờ,
chúng ta có thể tạo ra một ngay bây giờ.
Chỉ cần một ví dụ về REPL, phải không?
Chúng tôi đang đọc, đánh giá, và nó in.
>> AudioContext là một nhà nước toàn cầu.
Đó là một cấu trúc, nó là một đối tượng ở đây, và nó giữ thông tin
về những điều đang diễn ra trên màn hình liên quan đến âm thanh.
Một ví dụ là thời gian hiện tại.
Điều này sẽ cho bạn biết số lượng giây, rất chính xác,
kể từ khi trang web được tải.
Vì vậy, đây là một thực sự hữu ích ít tài sản mà bạn có thể sử dụng.
Nó đọc only-- Tôi nghĩ rằng thực sự bạn có thể cố gắng thiết lập giá trị cho nó.
Nó sẽ cho bạn thiết lập nó, và sau đó nếu bạn in nó
again-- nó đã không thực sự hoàn toàn làm việc.
Vì vậy, có được chỉ đọc tài sản trong JavaScript.
Điều này thực sự hữu ích nếu bạn đang loại đồng bộ
rất nhiều khác nhau thông tin, khi bạn
loại chơi âm thanh khác nhau.
>> Một số khác thực sự hữu ích là điểm đến bối cảnh.
Chắc chắn, nếu bạn quan tâm, được cố gắng này tại giao diện điều khiển quyền riêng của bạn
bây giờ.
Vì vậy, đây là một AudioDestinationNode.
Về cơ bản những gì này nói là, mà là đầu ra đi?
Vì vậy, có hai tùy chọn thực sự ở đây.
Thường là mặc định chỉ là loa của bạn,
vì vậy AudioDestinationNode về cơ bản chỉ nói
có không kết quả cho âm thanh đến, gửi đến các loa.
Vì vậy, nói chung, bạn không phải chơi với điều đó.
Nếu bạn quan tâm đến thực tế sử dụng các ScriptProcessorNode để ghi chép,
chắc chắn bắn cho tôi một email sau này bởi vì đó là
hơn một chút phức tạp.
Nhưng nói chung, bạn chỉ cần loại xuất ra âm thanh trong một số hình thức.
Vì vậy, mát mẻ, chúng tôi sẽ nhảy trở lại đây.
Đung Tôi xin lỗi.
HUGH Zabriskie: Yeah.
Đung Tôi biết bạn nói để nói chuyện cho bạn sau này về việc ghi.
Bạn có thể giao tiếp mà với Pro Tools?
>> HUGH Zabriskie: Với Pro Tools?
Chúng ta hãy xem.
Tôi không nghĩ vậy.
Vì vậy, đi giữa các khách hàng, đó là JavaScript
giao diện điều khiển, và thực tế của bạn máy tính, thường là
một cái gì đó là loại off giới hạn, nếu bạn
sẽ, loại bởi bản chất của the-- nó là loại một điều thiết kế,
nhưng bạn cố gắng để giữ cho trình duyệt riêng từ máy tính thực tế của người dùng.
Nói chung, điều duy nhất bạn có thể truy cập là microphone hoặc camera.
Bạn không thể, tôi không nghĩ rằng, sử dụng Pro Tools.
Tuy nhiên, nếu bạn đã tạo một ca khúc trong Pro Tools,
xuất khẩu đó, bạn có thể tải mà ở đây, lọc nó, ví dụ,
quá trình đó, và ghi lại rằng vào một Âm thanh Destination-- hay, no-- một Sphere
Bộ vi xử lý Node.
Và rồi từ đó, bạn có thể xuất khẩu mà để SoundCloud, bạn
có thể gửi nó trong một email, hoặc bất cứ điều gì bạn thích từ đó.
>> Nhưng có một loại rào nhẹ giữa làm cho âm nhạc trên máy tính của bạn
và làm cho âm nhạc trực tuyến.
>> SAM GREEN: Và đó là riêng API này.
Đó là một tính năng bảo mật của Chrome, và Tôi nghĩ rằng mọi trình duyệt hiện đại khác.
Trình duyệt là khép kín.
Vì vậy, ví dụ, một trang web có thể không sử dụng JavaScript để chuyển âm thanh
vào trên loa của bạn, ví dụ.
Hoặc nó không thể biến máy tính của bạn đi.
Và không có điểm trung gian giữa hai điều này, phải,
do đó, hoặc bạn có một trừu tượng đầy đủ,
hoặc bạn mở lên lỗ hổng bảo mật của phép
một lập trình viên có ý định xấu làm bất cứ điều gì họ muốn với máy tính xách tay của bạn.
Và đó là lý do tại sao Chrome là khép kín.
>> HUGH Zabriskie: Yeah.
Điều đó có ý nghĩa?
Hay hay.
Tôi vừa định cho thấy một ví dụ về một.
Điều này là khá nhiều như xa như bạn có được, trong điều kiện
truy cập máy tính của người dùng.
Nếu bạn có một bàn phím USB cắm vào, bạn có thể sử dụng một cái gì đó gọi là Web
MIDI API, mà chúng tôi sẽ không thực sự nói về đây,
nhưng đây là một API đó là được xây dựng vào ít nhất Chrome-- một lần nữa,
đây là lý do tại sao chúng tôi yêu Chrome-- Tôi nghĩ rằng Firefox hay Safari,
đây là một điều dễ dàng để trình duyệt khác nhau google-- có
hỗ trợ khác nhau mà API họ đã thực hiện.
Nhưng nếu bạn muốn cắm vào một bàn phím và làm việc với các thông tin đó,
loại bàn phím gửi thông tin qua máy tính
và sau đó sử dụng trực tuyến, API này là nơi bạn muốn được làm việc đó.
>> Mát.
ĐƯỢC.
Vì vậy, nhanh chóng di chuyển về đây.
Làm thế nào chúng ta thực hiện đúng thời hạn?
>> SPEAKER 1: Khoảng 15.
>> HUGH Zabriskie: 15 phút còn lại?
OK, mát mẻ.
Vì vậy, chúng tôi sẽ chạy đua trước đây.
>> Vì vậy, về cơ bản, những điểm chính của suy nghĩ về điều này như một đường ống
là mỗi bước trong đường ống là một loạt các nút âm thanh.
Nguồn của chúng tôi, hãy nói, là một dao động.
Chúng ta cần phải tạo ra một nút dao động.
Và đó chỉ là loại của function-- chút
và tất cả chúng đều dựa trên của bối cảnh âm thanh ở đây.
>> Đung Khi nó nói Dao động, không có nghĩa
nó thực sự theo nghĩa đen đi từ hai cực khác nhau qua lại?
>> HUGH Zabriskie: Không, nó giống như một đại diện kỹ thuật số.
Nó thực sự thực hiện trong C ++.
Tôi thực sự không biết các thông số kỹ thuật của nó như thế nào thực sự thực hiện,
nhưng tất cả điều này đang làm việc như là dữ liệu nhị phân.
Trên thực tế, yeah.
Đó có thể nói rằng, tôi có thể trên thực tế, nếu bạn quan tâm,
Tôi có thể gửi cho bạn nhiều hơn một chút thông tin về cách dạng sóng
được lưu giữ có một định dạng kỹ thuật số.
OK, mát mẻ.
>> Vì vậy, chúng tôi đang tạo ra một giai điệu như một sin làn sóng hoặc một cái gì đó như thế, có lẽ
440 Hertz.
Chúng tôi tạo ra một dao động.
Nếu chúng ta muốn cài đặt âm lượng, chúng tôi kết nối bất cứ điều gì để một GainNode,
mà chúng ta có thể làm gì với .creategain.
Điều đó đặt khối lượng của bạn.
Bạn có thể vượt qua mà vào bất kỳ các khác options-- tốt,
do đó, một nguồn đệm âm thanh nút là nơi mà có lẽ bạn
lưu trữ một MP3 mà bạn đã nạp vào.
>> Lọc biquad là để lọc nếu bạn muốn lấy tất cả các cơ sở ra
của một bài hát, hoặc một cái gì đó như thế.
Thiên Chúa cấm bạn muốn đi các cơ sở hiện của một bài hát.
Và nút AudioDestination là, một lần nữa, như nơi quyết toán của chúng tôi là.
Nếu bạn đã từng quan tâm nhìn thấy tất cả các tùy chọn có thể khác nhau,
chỉ cần đi đến các tab và để auto-complete đi lên.
Và nếu bạn tạo ra, bạn sẽ thấy tất cả các điều khác nhau mà bạn có thể tạo ra.
Bạn có thể tạo ra năng động bộ vi xử lý kịch bản,
Tôi thậm chí không biết những gì mà là, để pha trộn sáp nhập kênh
và bộ tách kênh và tất cả điều đó.
Mát.
>> Vì vậy, đây chỉ là một là ví dụ về một đường ống.
Vì vậy, chúng tôi có ba nguồn đến ở.
Có lẽ đây là những dạng sóng, có lẽ đây là những MP3.
Một sẽ thông qua một bộ lọc, một số khác của
bị bóp méo khác một của panning trái và phải.
Bạn có thể làm tất cả các loại của sự vật và tất cả đều được trộn lẫn với nhau xung quanh,
và sau đó đi ra âm thanh ở cuối, như là điểm đến.
Đây là một ví dụ về những gì nhiều hơn phức tạp Web mã âm thanh như thế nào.
Bạn đang tạo ra tất cả các các đối tượng khác nhau ngay here--
Tôi không chắc chắn về điều này.
Không, nó không phóng to.
ĐƯỢC.
>> SAM GREEN: Bạn làm Control, Scroll-Up.
HUGH Zabriskie: Control Scroll--
SAM GREEN: Không, không.
Kiểm soát--
>> HUGH Zabriskie: Oh, Control, Cuộn?
Oh, Gotcha.
Yeah.
Wow, nope, nope.
ĐƯỢC.
Tôi sẽ không làm điều đó.
>> Vì vậy, yeah, trong này đầu tiên phần ở đây, bạn sẽ thấy
chúng tôi đang tạo ra tất cả những khác nhau các nút ra khỏi ngữ cảnh.
Chúng tôi chỉ vẽ ra chúng với nhau trong phần thứ hai
Với chức năng này được gọi là Connect.
Đó là một thực sự chủ chốt chức năng trong Web Audio.
Nó chỉ có nghĩa là một khi bạn đã thực hiện một cái gì đó với những âm thanh trong một nút,
vượt qua nó về đến nút tiếp theo.
Vì vậy, chúng tôi có nguồn gốc, nó kết nối với các phân tích,
phân tích làm điều gì đó với nó, nó đi để bóp méo, và như vậy,
và đến đích ở dưới cùng bên phải ở đây.
Mát.
OK, vì vậy chúng tôi sẽ tiếp tục di chuyển trên.
>> Các pipeline-- một lần nữa, các là những đường ống phổ biến nhất,
vì vậy chúng tôi nói về tất cả những thứ như biến dạng, di chuyển màn hình, tất cả các công cụ này.
Nếu bạn đang thực sự quan tâm trong việc sử dụng điều Pro Tools,
những người có thể quan tâm đến bạn.
Nếu không, có thể bạn chỉ muốn chơi âm thanh,
hoặc có thể bạn chỉ muốn cài âm lượng âm thanh này.
Đó là hai loại phổ biến nhất của đường ống trong sản xuất âm thanh.
>> Một lần nữa, những cách bạn có thể mang nó trong khi một oscillator-- như vậy, chúng ta hãy
làm một bản demo của quyền ở đây.
Vì vậy, chúng ta sẽ tạo ra một bối cảnh âm thanh đơn giản ở đây,
và từ đó chúng ta sẽ để tạo ra dao động của chúng tôi.
Vì vậy, đó là, một lần nữa, chúng tôi chỉ sẽ gọi Tạo Oscillator.
Chúng tôi sẽ thiết lập một tần số trên rằng, 440 Hertz, yêu thích của mọi người.
Sau đó, chúng tôi kết nối mà đến đích point-- đó là người nói, vì vậy
đích bối cảnh.
Cuối cùng, chúng tôi chỉ nói, bắt đầu bằng không giây từ bây giờ, và chúng ta đã nghe?
>> [Ringing]
>> HUGH Zabriskie: Ở đây chúng tôi đi.
Nó chỉ là một sóng sin.
OK, mát mẻ.
Và sau đó chúng tôi sẽ dừng lại.
>> Đung Trường hợp đã làm phản hồi đến từ đâu?
>> HUGH Zabriskie: Các phản hồi?
Oh, có lẽ micro của chúng tôi.
Vì vậy, yeah, đó là cách bạn làm điều đó.
Và trên thực tế, nếu tôi đã có giữ cho nó chạy, bạn
có thể có tần số giá trị như nó đang chạy,
vì vậy đó là một điều thú vị để chơi xung quanh.
Mát.
Đó là luôn luôn một cái rất dễ để trình bày.
>> SAM GREEN: Chúng tôi đã làm không nghĩ về điều đó, đã làm chúng tôi?
HUGH Zabriskie: Yeah, đó là một khó chịu.
Vì vậy, đệm loading-- tôi sẽ đưa ra một ví dụ đó vào lúc cuối cùng.
Đó là tải một MP3.
Và microphone, bạn chỉ cần sử dụng một chức năng gọi Navigator.getUserMedia ()
để yêu cầu quyền truy cập cho người sử dụng của microphone cho thông tin đó.
>> Dưới đây là lọc, tôi sẽ chỉ tiếp tục di chuyển từ này.
Đây là mức khá cao, nhưng bộ lọc chỉ cho phép bạn
>> [Bíp]
Lọc cũng cho phép bạn để tạo ra những thứ như màu hồng
tiếng ồn, tiếng ồn nâu, tiếng ồn trắng.
Nếu bạn muốn tạo ra tiếng ồn trong sạch, mà một số người thích để mess xung quanh với,
bạn có thể sử dụng Web âm thanh lọc để làm điều đó.
>> Âm thanh Panning-- để tưởng tượng nếu bạn đang viết một trò chơi
và bạn muốn âm thanh để âm thanh như nó đến, như thế,
chụp trên màn hình, bạn có thể sử dụng các panning của âm thanh
để tạo ra loại hình nón, mà like-- nó mathy khá,
nhưng nó thực sự thực sự mát mẻ, nếu bạn nhận được nó làm việc,
và có một số tốt hướng dẫn về nó tôi có thể gửi cho bạn.
Về cơ bản, bạn có thể loại của tạo những âm thanh
của một cái gì đó đi theo một cách 3D.
Và nếu bạn có một sự quan tâm DJ, bạn có thể bắt đầu trộn và qua bài hát mờ dần.
>> Đây chỉ là một số rất cơ bản mã, về cơ bản những gì tôi đã làm trước đây.
Điều này đặt ra khối lượng của Dao động, vì vậy chúng tôi tạo ra dao động của chúng tôi
mà tạo ra các dạng sóng.
Chúng tôi tạo ra GainNode của chúng tôi, thiết lập tần số của chúng tôi,
và sau đó kết nối với Dao động GainNode, mà sau đó về cơ bản thay đổi
bao nhiêu tín hiệu được phép thông qua.
Nhưng thực sự, đó là một kỹ thuật số điều, vì vậy nó còn hơn just-- yeah.
Đó không phải là những gì đang thực sự xảy ra, nhưng đó là những gì xảy ra trong cuộc sống thực
với một tăng.
>> Đung --quantization của tham số khối lượng?
HUGH Zabriskie: Xin lỗi?
Đung có phải là một lượng tử hóa tham số khối lượng?
HUGH Zabriskie: Yeah.
Và đây là một điều tôi thực sự thiếu về kiến ​​thức của tôi,
cách tăng hoạt động trên một mức độ kỹ thuật số.
Tôi biết với thực tế tín hiệu, nó là cơ bản
kiểm soát có bao nhiêu bạn khuếch đại tín hiệu.
Vì vậy, yeah.
Tôi sẽ gửi cho bạn thêm thông tin về rằng, vì tôi tò mò muốn được thực sự
để biết thêm về điều đó.
Nhưng về cơ bản các thông số là, một là fold--
các signal-- to hơn và không có tín hiệu, hoặc bạn sẽ không nghe thấy bất kỳ âm thanh.
Chúng tôi sẽ bỏ qua thời gian demo cho vì đó nó về cơ bản những gì tôi đã làm trước đây.
Và một lần nữa, các Context.Destination là node đích âm thanh.
Awesome, OK.
>> Vì vậy, tôi sẽ làm một cách nhanh chóng hai bản demo.
Làm thế nào chúng ta thực hiện đúng thời hạn?
>> SPEAKER 1: Khoảng 10 phút.
>> HUGH Zabriskie: 10 phút?
Thật tuyệt!
Thật tuyệt vời.
>> Vì vậy, một trong những đầu tiên tôi sẽ làm, nó được gọi là My Sông yêu thích.
Vì vậy, đây chỉ là một là ít JavaScript HTML.
Chúng ta sẽ có hai nút trên trang chơi các bài hát yêu thích của tôi
và dừng bài hát yêu thích của tôi.
Tôi sẽ thay đổi điều này.
>> Đung Che microphone của bạn.
>> HUGH Zabriskie: Yeah.
Và tôi đã tải ở đây một kịch bản mà basically--
và điều này là thực sự hữu ích xếp dỡ MP3,
vì vậy điều này chỉ làm cho tải MP3 cách nhanh hơn.
Đó là cơ bản chỉ là một wrapper.
Nó chỉ làm cho quá trình tải trong MP3 nhanh hơn nhiều,
nếu không bạn đang sử dụng yêu cầu HTTP, loại giống như những gì chúng tôi đã làm
trên mảnh hiện hành với Server.
Nó thực sự xấu xí, bạn không muốn làm điều đó.
>> Vì vậy, anh chàng này, Boris bộ cấp nguồn, đã viết một thực sự ít công cụ hữu ích được gọi BufferLoader.
Tất cả các bạn làm chỉ đơn giản là vượt qua nó ngữ cảnh, bạn vượt qua nó một list--
hay, yeah, nó là một danh sách trong JavaScript?
SAM GREEN: Một mảng.
HUGH Zabriskie: Oh, đó là một mảng, đó là đúng.
Đây là một mảng các đường dẫn để các tập tin khác nhau.
Và sau đó bạn vượt qua nó một chức năng.
Đây là gọi lại chúng tôi đã nói chuyện về với tải không đồng bộ.
Điều đó sẽ được gọi là khi các tập tin được tải.
Và chức năng đó được gọi là khi của tập tin được tải mất như một vành đai
một mảng của bộ đệm được nạp.
Vì vậy xảy ra ở đây.
Về cơ bản, BufferList là sẽ là một value--
hoặc nó sẽ là một mảng của chiều dài một, mà đã ở trong đó trong chỉ số
bằng không toàn bộ tập tin được tải của MP3.
Vì vậy, những gì tôi làm khi tôi hoàn thành tải là, tôi chỉ đơn giản
tạo ra một nguồn đệm, mà là một nút nguồn đệm âm thanh.
Bước tiếp theo là tôi tải trong source.buffer như bộ đệm được nạp đầy đủ
từ BufferList-- nó là rất nhiều buffers--
và sau đó bạn kết nối âm thanh đệm để đến đích.
Vì vậy, những gì nó sẽ làm gì chỉ đơn giản là đặt MP3
thẳng thông qua các đầu ra, và bắt đầu nó ngay lập tức
khi nhận được cuộc gọi này.
>> Cool, vì vậy hãy xem điều này xảy ra trong hành động.
My [Không nghe thấy] ở đây, chúng ta hãy xem.
Vì vậy, tôi chỉ cần đi tới bắt đầu một máy chủ cơ bản.
Đó là một cái gì đó bạn cần phải làm gì nếu bạn
làm cho các yêu cầu để tải file.
Tôi sẽ bắt đầu một máy chủ cơ bản.
Điều này về cơ bản là toàn bộ của bạn PSET ngay bây giờ trong một dòng,
nhưng nó chỉ mới bắt đầu một máy chủ trên cổng 80/80.
Vì vậy, chúng tôi đi qua đây, chúng tôi sẽ load 80/80,
chúng ta sẽ đi đến My Sông yêu thích.
Vì vậy, nếu tôi nhấn "Play của tôi yêu thích bài hát "ngay bây giờ,
nó sẽ tải của tôi Bài hát yêu thích và chơi it--
[MUSIC - THE EAGLES, "LIFE IN THE NHANH LANE "]
--which sẽ xảy ra là "Life in Fast Lane "của The Eagles.
Bây giờ, tôi có thể nhấn "Stop của tôi yêu thích bài hát "và phát lại nó.
>> [MUSIC - THE EAGLES, "LIFE IN THE NHANH LANE "]
>> Và nếu tôi đi qua để an ủi, bởi vì Tôi đã sử dụng một biến toàn cầu ở đây
để theo dõi các giá trị này, nó thực sự bây giờ sẽ được ghi nhận trong giao diện điều khiển.
Vì vậy, nó tự động tạo ra cho tôi.
Vì vậy, đó là những gì đang chơi ngay bây giờ, và tôi chỉ có thể gọi source.stop ()
trong vấn đề này.
Vâng, bạn biết những gì?
Chỉ cần như vậy các bạn đã nghe điều này song-- bạn có thể nhận ra bài hát này.
>> [MUSIC - Rick Astley, "Never Gonna GIVE BẠN UP "]
[MUSIC - THE EAGLES, "LIFE IN THE NHANH LANE "]
Chúng tôi bây giờ tất cả được Rickrolled.
OK, tuyệt vời, di chuyển trên.
Mát.
Vì vậy, đây là cơ bản một ví dụ về chỉ là cách bạn có thể tải một MP3 file--
[MUSIC - THE EAGLES, "LIFE IN THE NHANH LANE "]
--and chơi nó, và dừng lại và bắt đầu nó.
Tôi đã có thể làm nhiều hơn nữa [Không nghe thấy]
>> Người cuối cùng tôi sẽ làm là, Tôi sẽ chỉ cho bạn một [không nghe được].
>> [MUSIC CHƠI]
>> Nó giống như, ogg.wave.mp3.
Tôi nghĩ, nếu tôi nhớ chính xác, Tôi đã chạy vào một số vấn đề với .m4a,
nhưng tôi không chắc chắn về điều đó.
Tôi nghĩ mp3.wave--
>> [MUSIC - Rick Astley, "Never Gonna GIVE BẠN UP "]
>> Tuyệt.
Tôi không nên nói như thế.
Dù sao, xin chào.
Vì vậy, chúng tôi đã mở này.
Vì vậy, bây giờ tất cả tôi làm là, tôi về cơ bản tạo một cú pháp cơ bản cho việc tạo ra âm nhạc.
Vì vậy, nếu tôi làm một cái gì đó như thế, thêm g4 trên 1 2, điều đó có nghĩa là,
thêm nốt piano, G4, đó là G thứ tư
lên trên cây đàn piano từ phía dưới.
Vì vậy, đây là loại MIDI nói tiếng, vì vậy đối với những người dựa trên âm nhạc,
đây là ghi chú chỉ MIDI.
>> Đung Đó là G Trung C, phải không?
>> HUGH Zabriskie: Đây là G trên Trung C, đó là đúng.
>> Đung Trên Trung C.
>> HUGH Zabriskie: Yeah.
Trên thực tế, có.
Tôi nghĩ rằng tôi thực sự thực hiện nó một [không nghe được],
vì vậy đây có thể là một quãng tám trên đó.
Vì vậy, chúng ta hãy xem.
Nếu tôi nhấn Play--
[Lặp đi lặp lại PIANO NOTE]
--we're sẽ nghe thấy điều đó.
Ý tưởng là nó hoạt động giống như một dòng lệnh sẽ,
vì vậy nếu tôi đi lên và xuống trên bàn phím của tôi, bạn
có thể quay lại trang trước lệnh, mà là khá hữu ích.
Và dưới đây là danh sách các bài hát, mà tất cả đều chạy trên vòng lặp.
>> Đung Bạn đã giả định 88-key bàn phím vào đó, phải không?
>> HUGH Zabriskie: Câu hỏi là, Tôi giả định một bàn phím 88-key,
và vâng, tôi.
Tôi những gì tôi đã làm là về cơ bản mất 88 mẫu
của cây đàn piano, một cho từng lưu ý.
Và do đó, mỗi lần bạn nghe một lưu ý từ bây giờ,
đó thực sự là một vòng lặp mà trông like-- này là nhận được chơi trên vòng lặp,
do đó, cho tất cả các nốt, điều này đang chạy.
, Những gì xảy ra là tôi tạo ra một bộ đệm một lần nữa,
Tôi tạo ra một nút được để thiết lập âm lượng.
Đây chỉ là một thực sự cách phức tạp của tôi nói
lưu trữ các bộ đệm trong một source.buffer.
Tôi cho nó đạt được, tôi kết nối nó với tăng,
đạt được được kết nối với đầu ra, và sau đó tôi chơi nó.
Vì vậy, đó là loại của quá trình chụp trong một nguồn đệm.
>> Đung bạn có thể thực sự đi mà âm thanh khô và làm cho nó ướt [Không nghe thấy]?
>> HUGH Zabriskie: Bạn có thể, yeah.
Có re-động từ, có chậm trễ, biến dạng.
Về cơ bản bạn có thể đặt bất cứ điều gì trong giữa trong bánh sandwich mà of-- tốt,
đường ống là một phép ẩn dụ tốt hơn, nhưng bạn có thể thêm bất cứ điều gì trong đó.
Mát.
>> Vì vậy, tôi sẽ hoàn thành bản demo ở đây để cung cấp cho bạn một cảm giác
các chỉ số tuyệt đối của thời gian bạn có thể chạy chức năng mà tất cả cùng một lúc.
Vì vậy, tôi sẽ loại bỏ điều này.
Tôi sẽ tạo ra một máy phát điện that-- về cơ bản những gì does-- này thực sự là
loại một syntax-- phức tạp nhưng nó sẽ tạo ra các ghi chú trên bay,
và chỉ bắt đầu chơi chúng như là nó đánh giá họ.
[Interposing PIANO]
>> Vì vậy, chúng tôi chỉ có thể làm cho một nhạc nhỏ ở đây.
[Interposing PIANO]
>> Vì vậy, những gì lệnh này không có gì, ví dụ, là
phải mất những ba ghi chú cho các piano và sau đó đặt chúng trên B3.
Cú pháp này có thể làm cho một chút cảm giác hơn
cho những người có một nền âm nhạc ở đây.
>> Tôi có thể thêm một cú đá trống.
Tôi có thể--
>> [Interposing INSTRUMENTS]
>> --just chơi xung quanh với điều đó.
>> Vì vậy, bạn có thể make--
[Interposing INSTRUMENTS]
Một trong đó là một chút khó chịu hơn.
[Interposing INSTRUMENTS]
>> Vì vậy, cho biết thêm rằng ngẫu nhiên một cymbal khô trên từng nốt thứ 16, với 16%
[Không nghe thấy].
>> [Interposing INSTRUMENTS]
>> Yeah, vì vậy cách này works-- nó luôn luôn trong 4: 4.
[Interposing INSTRUMENTS]
>> Yeah, vì vậy trong bốn quý, và 16/8.
[Interposing INSTRUMENTS]
>> Vì vậy, trên trung bình, bạn sẽ có được 60% các số truy cập trên các ghi chú 16.
>> Anyways, đây là chỉ loại để khoe
một số trong những điều bạn có thể xây dựng với Web âm thanh API.
Nó thực sự mạnh mẽ, nó thực sự nhanh, và bạn có thể làm rất nhiều thứ mát mẻ
với nó.
Vì vậy, một lần nữa, bất kỳ câu hỏi mà bạn có, email myself-- Hugh-- hay Sam,
và trung thực, Google có một tấn các nguồn lực tốt.
Bất kỳ câu hỏi cuối cùng?
Yeah.
>> Đung Vì vậy, bạn có thể truy cập microphone tích hợp.
Điều gì nếu bạn muốn sử dụng một micro tốt hơn?
HUGH Zabriskie: Nếu bạn muốn sử dụng micro tốt hơn?
Vì vậy, một lần nữa, đây là một phần của trừu tượng giữa Chrome
và phần còn lại của máy tính của bạn.
Trừ khi nó có sẵn thông qua một API, như Web MIDI API,
bạn có thể có thể tìm thấy một số hacks, nhưng nói chung là không khả thi.
>> SAM GREEN: Bạn có thể also-- tất cả các Chrome biết
là những gì microphone mặc định của bạn là, và nó truy cập đó.
Vì vậy, nếu bạn đã có một microphone bạn có thể thiết lập như microphone mặc định của máy tính,
bạn có thể truy cập nó theo cách đó và nó có lẽ sẽ làm việc.
HUGH Zabriskie: Đó là một điểm tốt.
Tôi chưa bao giờ cố gắng đó, nhưng bạn có thể có thể loại
of-- nếu bạn chuyển hướng các loa đầu vào, bạn có thể có thể làm điều đó, yeah.
>> Bất kỳ câu hỏi cuối cùng?
Mát.
Vâng cảm ơn các bạn rất nhiều cho xem.
Tôi Hugh.
SAM GREEN: Tôi là Sam.
HUGH Zabriskie: Và đây là CS50.