SAM 녹색 : 안녕하세요, 여러분. 우리의 세미나에 오신 것을 환영합니다. 내 이름은 샘입니다. 휴 자브리스키 : 나는 휴입니다. SAM 녹색 : 그리고 오늘 우리가 이야기하는거야 자바 스크립트와 웹 오디오 API에 대한. 그냥 시작,이 개요는 세미나에 대한 우리의 의제. 우리는 이야기로 시작하는거야 왜 웹에 관심을 가져야 오디오 API, 왜 자바 스크립트입니다 당신이 그것을 필요로하는 언어, 다음 자바 스크립트에 대해 이야기 , 같은 essentials-- 몇 가지를 안내 언어의 기초, 다음에 대해 이야기 높은 수준의 오디오 API. 그런 다음, 휴 몇 가지에 대해 이야기합니다 오디오 생산의 단계 다음이 멋진 시퀀서 데모 프로젝트 그는 내장하고 당신에게 코드를 보여줍니다. 그리고, 우리는 시간이있을 것이다 사람들의 말에 질문 여기 사는 사람들. 

휴 자브리스키 : 차가운. 

SAM 녹색 : 차가운. 

휴 자브리스키 : 차가운. 나는 백업합니다. 

SAM 녹색 : 그래서, 먼저 첫 번째 것들. 위대한 것들 중 하나 그래서 웹 오디오 API에 대한 필요하지 셋업이 없기 때문이다. 그것은 내장되어 제공에 가장 현대적인 브라우저, 크롬, 에지, 전체 포함 others-- 모든 사람의 무리 의 많은 부분 사람들은 오늘을 사용하고 있습니다. 그래서 더,이 설정되지 것 옆 단지 받고에서 웹 서버에 대한 것 당신은 작업을 시작하는 대단한 프로젝트에. 

우리는 꽤 좋습니다 크게 당신이 고려하는 것이 대한 크롬을 사용하여 자바 스크립트 웹 개발, 단지의 개발로 인해 도구는 정말 강하다. 우리가 의미하는 것의 단지 예로서 말하여 자바 스크립트를 열어 당신이 크롬에 가면 console-- 당신은 어떤 웹 페이지를 보면, 당신은 왼쪽 클릭 다음 요소를 검사하고 당신은이 작은 드롭 다운으로 이동 여기 당신이 콘솔을 클릭 당신은 업을 보이는 것을 열어 볼 수 있습니다 명령 프롬프트 같은 많은 당신을 Mac에서 참조하거나 ID에 있습니다. 그냥 그렇게, 우리는 할 수 있습니다 유형은 지우기처​​럼, 여기에 명령 와 같은 다른 명령. 우리는 같은 변수를 만들 수 있습니다 우리는 자바 스크립트에서 나중에 볼 수 있습니다. 그래서 무엇이든 우리는에서 할 수있는 자바 스크립트, 우리는 콘솔로 할 수있는 그리고 그에게 매우 편리한 방법 API를 사용하여 주변의 재생을 시작 그리고 편안 점점 바로 박쥐 자바 스크립트. 어떤 셋업이 필요하지 않습니다, 이는 정말 좋은 것입니다. 시원한. 신난다. 

그래서 한 가지 더 추가 할 수 있습니다. 당신이 가지고있는 경우가있다 questions-- 여기에없는 사는 당신의 많은 us--이 이메일을 보내 주시기 우리의 이메일 주소입니다. 당신은 질문이있는 경우 당신은 우리에게 싶지 않아, 같은, 오, 나는 버그가 내 코드에서, 또는 뭔가 즉, 좀 더 특정의 아마 먼저 구글. 훌륭한 자원이 많이 있습니다 거기에 웹 오디오 API에 대한. 정말 잘입니다 문서화이 되 고 사람들의 톤에 의해 사용 그냥있는 산업, 사람들 자신을 위해 재미있는 건물입니다. 그래서 많은이 있어야한다 거기에 자원. 신난다. 

쿨, 왜 웹 오디오 API? 이 그림은 조금입니다 방법의 진화 웹 소리는 시간이 지남에 따라 성장하고있다. BGSOUND은 원래의 HTML 태그 같았다 Internet Explorer가 지원하는 데 사용. 그것은 단지, 아주 기본적인 사운드 허용 기능은 매우 강력 아니었다 당신은 할 수 없었다 복잡한 시퀀싱, 소리가 시작할 때 또는 제어 매우 견고 중단했다. 그래서, 특히 아니었다 잘 개발. 그 후, 플래시 , 있었다는 - 어느왔다 나는 너희들이 모두 잘 알고 있다고 확신합니다 Flash-- 아마 작동하지 방법과, 하지만 당신은 확실히 그것을 보았다. 당신은 당신의 플래시를 업데이트 할 수있어 플러그인, 물건의 모든 종류를, 그 확실히 범위를 확장 기능을 사용할 수였습니다. 그러나 사용자 만들기 설치 플러그인은 확실히 포함 플래시 단점 응용 프로그램에서 마우스 오른쪽? 다음 있기 때문에 당신에 의존있어 사용자 가서이 플러그인을 발견, 아마 전원이 켜진 이 추가 단계로 떨어져 그들은 당신의 응용 프로그램을 사용하기 위해 수행해야합니다. 그리고 업데이트가 될 수있다 즉, 전체 응용 프로그램을 깰 수있을 거라, 그것은 악몽이 될 수있을 테니까요 너무 개발자를위한. 그래서 바리케이드이었다. 

그리고 그 다음은, 함께 온 후 HTML 오디오 태그, 어떤 현대 HTML--의 특징이다 확실히 더 많은 물건을 허용, 그러나 심지어 일이 당신이 할 수있는 약간은이 제한되었다 일의 결과로 그 HTML은 할 수 있었다. 그래서 때 자바 스크립트 API, 웹 오디오 API, 표준이되었다 브라우저에서 연습, 정말 세트를 확대 개발자를위한 기회 정말 건물에 들어가 웹 멋진 물건. 오랫동안 존재했다 되어 정말 강력한 도구 기본 오디오 응용 프로그램, 모두가 GarageBand를 알고 그때 엔, 다음 분명 더있다 전문 오디오 믹싱 애플리케이션, 물건의 종류. 그러나 거기에 없었다 정말 좋은 Cloud--하지 클라우드, 네, 그런 것 같아요 Cloud-- 웹 기반 플랫폼 즉, 개발자를 허용 사람들을위한 응용 프로그램을 구축 오디오 믹싱을 할 수 있습니다. 그리고 그 방법을 보여줍니다로 나중에, 웹 오디오 API 정말 강력한 수 있습니다 물건은 정말 간단하게 일이 이는 꽤 멋지다. 그래서 당신이 왜 명령이다 세미나의 나머지 부분을주의해야, 원래. 

그리고 지금, 나는에 대해 이야기하려고 해요 일부 JavaScript-- 단지 기본 요소 언어, 그래서 우리는 동일한 페이지에있을 수도 우리는에 대해 이야기 할 때 API 조금 이상. 시원한. 

그래서,이 요약이다. 나는이 여기에 있었다 잊어 버렸습니다. 네. 

휴 자브리스키 : 여기에 두 개의 슬라이드가있다. 

SAM GREEN :이 요약 제한의 일부 다른 바인딩, 오래된 방법. 그리고 지금, 우리는이 일을해야합니다. 시원한. 신난다. 

그래서, 자바 스크립트 필수. 첫 번째 일 첫 번째, 거기에 꽤 큰 차이 자바 스크립트 대에 방법으로 C와 같은 언어, 것이 변수가 생성됩니다. C에서 그래서, 우리는 데 사용하고 우리의 변수를 입력하려면 오른쪽? 그리고 내가 좋아하는 유형을 의미하지 않는다 를 입력, 나는 형을 의미 같은 그들에게 유형 선택 - 의미를 할당 같은, INT, 플로트, 문자. C에서, 우리는 정말로 사용되었다 변수를 만들 필요 다음에 대한 해당 유형에 충실 우리가 그 변수를 사용하여 전체 시간. 그리고 그것은 반드시 나쁜되지 않습니다 하지만 사용하는 아마 어렵습니다. 멋진 기능 중 하나 자바 스크립트는의 변수라고 어떤 것을 "동적으로 입력"하는 나는를 만들 수 있다는 것을 의미한다 그 구문 변수 varX 예를 들어, 5와 동일. 즉 원래 생성 정수 variable-- 바로 아래에 후드 somewhere--하지만 그 변수를 변경할 수 있습니다 문자열을 참조하는 처럼 아무것도하지 않고 새 변수를 작성. 나는 걱정할 필요가 없습니다 유형 변경에 대한. 자바 스크립트는 그 유형을 알고있다 변화, 그리고 동적으로 발생합니다. 

그래서, 이점이 있습니다 그에게 단점, 에서 일 것 같은 사람 잠시 동안 자바 스크립트를 알 수 있습니다. 시간 때이 있습니다 당신은 실수로 수도 변수의 종류를 변경하고 해당 유형의 변화를 처리하지, 다음 자바 스크립트 crash-- 또는 예외 수 당신이있을 것이기 때문에, 슬로우 잘못된 유형의 하나의 유형을 기대합니다. 시원한. 

그래서, 어떤 scoping--는 경우처럼 우리 과정에서 초기 주 기억, 얼마나 눈에 보이는 변수를 참조 이며, 코드의 어떤 영역에서. 그 모두는 매우 비슷 이 C로 보이는 방법에 그래서 변수는 일반적으로 범위가된다 함수 내에서 중괄호 ({}), 다음도 있습니다 전 세계적 범위의 변수가 당신이 변수를 쓰면으로 죠 함수의 외부, 이 텍스트 전체에서 볼 수 있습니다. 

사이의 한 가지 차이점 특히 자바 스크립트와 C, 당신은 세계를 선언하는 경우이다 텍스트 파일에서 변수 어디서나 그것은 어떤 기능에서 볼 수 있어요 텍스트 파일 내. 그건 바로, 올바른입니까? 

휴 자브리스키 : 그래. 

SAM 녹색 : 그래서 그 또한 약간의 C에 비해 펑키 비트, 우리는 항상 있어야했다 경우 우리의 장소 위의 변수 정의 이들은 사용 하였다. 즉 시행있어 규칙이 아니다 더 이상, 그래서, 조금 다른. 그리고 다시 바로 재 강조하고, 지역 variables-- 대 글로벌 C. 매우 유사 당신은 할 수 같은 이름을 가진 두 개의 변수, 자신의 이름 중 하나가 그림자 수있다 지역 변수에 의해 그들 중 하나가 글로벌였다. 너무 비슷한 종류 문제가 당신의 일부가 일부에 실행 한 수 문제의 지금까지 설정합니다. 쿨, 그래서 변수입니다. 

제어 흐름과 같은 의미 IF-else-- 논리들 이예요 및 루프. 그래서 시작하는,이 무슨 경우 - 다른 문은 자바 스크립트처럼 보인다. 여러 가지의 배치 라인에 중요하지 않습니다. 이것은 단지 규칙 중 하나입니다 방법 우리 구조 코드. 그냥 C처럼, 우리는이 괄호 문 "의 경우". 그건 내가 할 무엇을 의미하지 않습니다. 나는 그것을 다시했다. 

휴 자브리스키 : 종료하려고? SAM 녹색 : 아니, 난 단지 확대하려고합니다. 그것은 중요하지 않습니다. 

그래서, 우리는 "만약"문이 있고 우리는 그것의 내부 상태를 즉, true 또는 false로 평가 그리고 그 여부를 판정한다 우리는 코드 블록을 입력합니다. 그리고 마찬가지로, 우리가 다른-경우, 그리고 우리는 C에서 사용하는 것처럼 다른, 

당신은 또한 꽤 편안해야 바로 루프와 박쥐, 그들은 또한 보이기 때문에 C와 같은 많은 보인다. 하지만 당신은 다시 발견하는 것이다 우리 대신 초기화 INT의,이, 우리는 VAR의 초기화를해야합니다. 그리고 나는 당신이 생각 만들 조심해야 반드시이 값을 변경하지 마십시오 나는 지능에서 문자열로, 예를 들어, 그 때문에 것 이상한 동작이 발생할 당신은 그렇지 않을 수 있습니다 배고 있다. 하지만이 보일 것입니다 꽤 익숙한뿐만 아니라. 

일이에 시작하는 곳 그래서이다 자바 스크립트에 약간 미친 사람을 누가로부터 것입니다 C의 배경 기능이 있습니다 자바 스크립트에서, 하나의 방법이 보이는 함수를 선언합니다 C와 유사한의 정렬 및 다음 다른 하나는 거기에 그 가지 다른 보인다. 

첫 번째 버전, 우리는 여기에서 볼 수있는, 여기서 어떤 종류의 C-같​​다 우리는이 함수, 말 그것에게 이름을 부여, 부여 인수의 수, 함수의 다음 내용물 그 중괄호 내부 이동합니다. 우리의 예를 볼 수 있습니다 단지 두 번째의 인수. 

다음 줄에있는 반면, 우리는 오, 참조 여기라는 변수 "하여 myFunction은,"이다 우리는이에 동등 일반 누군지 모르겠지만, function-- 그 아무 일을하지 않는 것. 다른의 이유 보다 C가 있다는 것입니다 자바 스크립트 기능적인 언어라고 것입니다, 또는 어떤 의미, 기능적인 요소를 가지고 기능은 실제로 값 있음. 그리고 우리가 설정할 수 있다는 것을 의미한다 변수는 동일 기능을하는 다음 해당 기능을 이동 주위 인수로 전달, 물건의 모든 종류의 작업을 수행 기능이있다. 

또 한가지는 note--하기 기능 기록 인수의 특정 번호. 우리는 함수의 예를 볼 수 있습니다 다음 슬라이드에 인수. 하지만 자바 스크립트는하지 않습니다 당신이 시도하는 경우에 소리 가진 함수를 사용하는 인수의 수가 잘못되었습니다. 그것은 단지 수 있도록 최선을 다하겠습니다 당신이 전달하는 경우 즉, 수행, 당신은 필요한 함수를 호출 인수없이, 모두와 함께 인수하는 그것의 최선을 다하겠습니다되어 발생합니다 시도하고 그 코드를 실행하기 위해, 그것은 결국 실행되면 예외 또는 오류로, 그것은 그 예외를 던질 단지하겠습니다 이 딴 단지 방법 중 하나입니다 자바 스크립트를 작동하는지. 네. 

청중 : 어떤 경우에 발생 너무 많은 인수가있어? SAM 녹색 : 그래서 문제는 어떤 일이 발생했다 너무 많은 인수가 존재하는 경우? 그리고 그 대답은 것입니다 자바 스크립트는 것 있는 사람을 무시 그것을 기대하는 사람 후. 이 기능을 실행하도록 시도 할 것이다 그냥 처음 두 것처럼 호출합니다. 권리? 

휴 자브리스키 : 그건 그래, 맞아. 마찬가지로, 만약이 너무 적은 인수가 있습니다, 그냥 가지 모두에 널 (null) 제공 인수는 어떤 값이없는 에 대한. 

SAM 녹색 : 수 실제로, 편리 할 당신 경우 함수를 작성하도록 가변 수의 인수를 취합니다. 당신의 기본 값을 설정할 수 있습니다 기능의 정의, 그리고 사실 무시해 그 입력이 아니다. 그래서 나는 조금 얘기하고 싶어요 이 마지막 총알에 대한 자세한 기능입니다 점은 값입니다. 이다 예입니다 약간의 압도적 당신은 단지 그것을 읽고, 생각하지 않는 경우 초 동안 무슨 일이 일어나고 있는지에 대해. 그래서, 그냥 살펴 보자 여기에 첫 번째 줄. 우리는 우리가 말하는 것으로,이 변수, F1을 이 일을하는 기능입니다. 및 기능의 내용 ( '안녕하세요') CONSOLE.LOG된다. 당신은 같은 CONSOLE.LOG 생각할 수 printf와의 자바 스크립트와 동일합니다. 그래서 무슨 일이 일어날 경우이며, 우리 우리의 브라우저에서이 코드를 실행, 그것은 문자열을 출력합니다. 나는 그것을 입증 할 수 있습니다. 청중 : 로그에 의해,하지만 것을 수행 그것은 어딘가에 기록되는 뜻? SAM 녹색 : 그래. 그래서 무슨 일이 일어날을 보여 드리겠습니다. 그래서 질문은 무엇을 의미 로그 않는다이었다? 

휴 자브리스키 : 그래서 CONSOLE.LOG C의 printf와 같다 SAM 녹색 : 그래서 CONSOLE.LOG , printf와 같다 그래서 ( '안녕하세요')이 CONSOLE.LOG이있는 경우, 내가 부르는, 문자열 "안녕하세요" 콘솔에 인쇄됩니다. 이 콘솔입니다. 그것은 단지의 printf처럼, 이 표준 출력에 인쇄합니다. 그리고 우리는 분에 볼 수 있습니다, 그러나 이것은 실제로 콘솔 객체를 참조, 그 객체의 메소드를 호출. 그게 더 의미가 있습니다 때 분에 우리 이야기에 도착 자바 스크립트의 객체, 하지만 난 그냥 말할 거라 생각 했어요. 휴 자브리스키 : 우리는있어 C로 사용, right-- 우리는 일반적으로 큰 프로그램을 작성 메인에 아무것도 할 수 있습니다. 하지만 자바 스크립트로 멋진 당신입니다 이런 종류의 인터프리터를 갖도록 실행을 실시간으로, 그것 때문에 선으로 만 선을 소요, 그냥 그 자리에서 그 해석 할 수 있습니다. 그리고 그것은 추적 이전에 실행 한 것, 그래서에 매우 유용한 도구입니다 , CONSOLE.LOG, 또는 콘솔을 사용하여 일반적으로, 단지 재생 주위에 자바 스크립트. 

SAM 녹색 : 그래서이 다시 가고 코드의 두 번째 줄을 example-- 여기에 내 머리에 예쁜 마음을 불허입니다. 처음 나는이 읽기, 이 같은, 무슨 일이야되었다? 그래서 무슨 일이 일어나고 있는지이있다 함수 선언은 말한다 나는 함수 호출 F2를 즉, F를 하나의 인수를 예상하고있어, 후 그 호출 함수 F, 어느 인자로 전달되었습니다 인수 자체. 그래서, 그 혼란되었을 수 있습니다. F2는 F1을 걸립니다 우리는 이것을 이해한다면 인수로 다음 F2의 내부, F는 called--하는 수단을 가져옵니다 이 코드 줄이, 이들 두 줄 이후 코드 "안녕하세요"결과 콘솔에 인쇄된다. 

우리가 통과 할 수 있다는 사실 주위 함수 값으로 가장 중 하나가 될 수있을 테니까요 자바 스크립트의 강력한 기능 프로그래밍 언어로. 모두의 외부 그것을 할 수있는 멋진 일, 단지의 기능으로 방법의 측면에서 언어 이 일을 쉽게하는 것이 프로그램 및 허용한다 특히 수없는 것들에 대한 웹에 매우 적합, 함수형 프로그래밍 및 기능 자바 스크립트 프로그래밍 측면 가장 중 하나입니다 강력한 개념이 당신이 저를 요구하는 경우에 JavaScript-- 존재합니다. 시원한. 

그래서, 다음 일은. 기능적 것에 더하여, 자바 스크립트의 요소도 있습니다 객체 지향하고 있는지, 이는 매우 중 하나입니다 컴퓨터 과학에서 인기 유행어. 객체 지향 프로그래밍 정말 인기있는 것입니다. 자바 스크립트는 그 버전이, 나는 모든 값도 믿는 곳 모든 개체 것을 의미 객체, 일부 값 수를 함께 래핑합니다. 단순 값, 등에 그래서 , varX 같은 정수, 5와 동일 그 목적은 단지 하나의 값을 랩합니다. 

그러나 우리는 또한 상황을 상상할 수 우리는 C의 상황을 생각할 수 where-- 우리가하고 싶었던 곳 구조체 뭔가, 예를 들어, 그 몇 랩 함께 가치와 브랜드 정말 쉽게 주위에 물건을 전달하는. 객체가 자바 스크립트에있는 때이다. 

그것은 기억하는 것이 중요 나는 개체 포장 말할 때 함께 값의 일부 개수 기능도 있음 기능을 할 수 있다는 것을 의미 값, 또한 자바 스크립트 객체의 내부에. 그리고 중요한 이유 , 즉 흔히 우리 반면 메소드를 호출 생각 의 객체에 다른에서 인기있는 용어의 인기있는 객체 지향 언어, 차이점 중 하나가 여기에 있다는 것입니다 방법은 자바 스크립트에 모두 있다는 값은 오브젝트의 내부에 저장된 그 가능성이 일부 action--을 수행 내부에 다른 값을 사용하여 해당 개체의, 그러나 반드시. 그래서 나는 상황을 상상할 수 미친 방법의 약간의 생각, 하나의 방법이라고 어디 예를 들어, 다른 개체에 개체. 그래서, 그 방법으로 펑키 조금이다. 

그리고 당신은 또한 방법을 변경할 수 있습니다 객체와 관련된되는 그 방법을 지정하여 또한 새로운 기능, 서로 매우 다른 객체 지향 언어, 우리는 객체를 선언하면 그것을 인스턴스화, 우리는 방법을 변경할 수 없습니다 더 이상 그 객체와 연관된. 그래서 꽤 다르다. 시원한. 

그래서 여기에 처음으로, 예제, 행동의 개체. 이라고 무엇인가 일반 객체, 어떤 그것은 어떤을 가지고 있지 않음을 의미 특정 이름은 클래스가 없습니다 이 값을 그냥 포장입니다. 그리고 보이는 방법은 우리가있다 곱슬이 외부 쌍은 여기 교정기 자바 스크립트에 표시하는 이 객체이다,라고. 그것의 내부 값 각각의 값은 내부에 객체의는해야 함께 포장 될 수있다. 그리고 그 객체의 내부, 그리고 나서, 키 값 쌍을 가지고 키 이름을 참조 곳 물체의 내부 값, 다른 쪽 ... 대장 here-- 반대 실제 값은 그 보관해야합니다. 

그래서 우리는이 것을 여기 참조 키 값 샘과 fn을 호출, 쉼표, 다음 항목에 말. 그런 다음 LN이라는 키, 녹색의 값, 쉼표, "인쇄"다음에 함수 값이 예정되어있는 그 코드의 라인을 수행 할 것입니다. 의이 단계를 다시 보자하고 여기에 무슨 일이 일어나고 있는지 압축을 풉니 다. 그래서이 조금 복잡하다 우리는 새로운 무언가를보고있다 처음으로. "이"키워드는 새로운 일이 우리는 여기에서보고, 이것이 무엇을하고 인 전류를 지칭 권리 범위에 반대? 그래서 우리는이 말을 할 때 다시 모든 방법을 가리 킵니다 이 전체 object--에 우리가 this.fn 할 때, 우리는 다시 모든 길을 갈거야 이 개체에, FN 값으로 이동 샘을 얻을, 그것을 모든 방법을 당겨 다시, 여기 스틱, 다음에 이동합니다. 

청중 : 검색과 그래서이다 그 때문에 매개 변수의 수행 정의? SAM 녹색 : 질문은 그래서,이다 검색 때문에 매개 변수의 수행 정의? 네, 절대적으로. 무엇이며, 여기에 일어날 이 점은, 자바 스크립트로 말한다 확인, 좀 값을 받고 있어요 자신에서이 객체. 그리고 그것은 항목을 살펴 보겠습니다 FN을 호출하고, 그것을 찾으면 그것은 샘, 그래서 그 value-- 돌아갑니다. 그러나 나는 또한 입력 한 수 여기에 정의되지 않은 것을, 다음 그냥 것 undefined--을 반환하는 점은 자바 스크립트를 할 수있다 이점을 가질 수있는, 할, 당신이 오타를하면하지만, also--의 그것은 이상한 오류가 발생할 수 있습니다. 그래서 그냥 찾기 위해 노력할 것이다 당신이 찾는 그에게 어떤 그것은에 없을거야 그것을 발견하지 않는 경우 불평하고있다. 그것은 단지 내가하지 않았다라고 말할 것이다 그것을 발견 한 다음에 이동합니다. 그래서이 정의되지 않은 것 플러스 빈 플러스 성. 네. 그리고 우리는 볼 수 있다면 우리 다음 내려 가서 access-- 수 우리는 괄호 tf.print ()를 호출합니다. 그것은 그 인쇄를 호출하는거야 인수와 기능, 오른쪽? 그러나 경우에 우리가 방금 말한 tf.print () 세미콜론, 괄호없이, 했을 것 모두가 당겨입니다 값에서 함수 밖으로, 하지만 실제로 호출되지 않습니다. 시원한. 휴 자브리스키 :할까요 우리는 개체를 만들? SAM 그린이 : 물론, 이제 그렇게 할 수 있습니다. 그래서 나는이 이동할 수 있습니다 콘솔에 예. 우리는 내가 객체를 가지고 상상할 수있다. 그래서 이것은 단순한 목적으로한다. 이 두 가지를 포함하는 객체입니다 두 개의 키와 값이 키 값 한 쌍. 그래서 나는 다음 저장된 값에 액세스 할 수 있습니다 x.x1을 수행하여이 객체의 내부, 예를 들어, 나는 1 등을 얻을. 마찬가지로, x.x2는, 그 값을 다시 얻을. 

그리고 지금 정말 멋진 일이 내가 할 수있다 실제로이 개체에 뭔가를 추가 나는 그것을 만든 후. 그래서 당신의하자, 상상할 수있는 내가하는 기능을 갖고 있다고. 

휴 자브리스키 : 당신 - 입력 Shift 키해야한다. 

SAM 녹색 : 아, 짜증나. 그것은 무엇을 좋아하지 않았어요? 오. 여기에서 우리는 간다. 시원한. 

그래서 난 그냥 만든 이 함수 F, 즉 현재에 갈 것입니다 대상 및 인쇄 this.x1. 그래서 난 그냥 의해 F를 호출하는 경우 자체는 아무것도 않을거야 어떠한 X1이 없기 때문에, 바로 일어날 이 참조있어 객체​​의 필드. 그러나, 나는 그 때, x.f = F, 그리고 말을하면 내가 x.f ()를 호출, 내가 다시 1 얻을거야. 즉, F 기능은 지금 오브젝트와 연관​​된 X, 키라고 X1이있는 값 1과 연관된 우리가 this.x1를 호출 할 때, 그것은이다 그것은을 찾고 찾을 것 과 값을 인쇄 할 수 있습니다. 그래서 단지 하나의 예입니다 미친 가지 종류의 당신은 자바 스크립트 객체로 할 수 있습니다. 

그래서 버전이었다 일반 버전, 의미 우리는이를 사용하여 객체를 만들었습니다 , notation-- 중괄호 표기법을 괄호 rather-- 및 그건 편리한 우리가 원하는 경우 특정 객체의 하나의 인스턴스 만 우리가 하나 이상 갖고 싶어 같은 종류의? 그리고 그 대답 문제는, 일이있다 뿐만 아니라 자바 스크립트 클래스를했다. 우리는 함수를 만들 수 있습니다 초기화의 일종을 수행 이물질에 대한, 우리는 같은 말 것 이름 나의 그 수업 재사용 object--의 그것을 설정 기능을 동일합니다. 그래서이 동등 할 것이 무엇 에 객체를 생성된다 같은 단지 것, 중괄호, STR, 대장, 이 문자열입니다, 세미콜론, 중괄호. 즉, 일반적인 것 우리가 초기화 개체, 한 차이가에있는와 옆에 선 우리는 프로토 타입을 생성하는 이 기본 키의 의미 우리는 우리의 목적에 추가하는 여기에 나열된 값을 갖는다. 의미, 그 나는 새를 만들 때 이 MyClass에 객체의 인스턴스 그것은 내부에 미리 구축 한 것 이 값은 STR이라는 또 다른 가치 이다라는 myPrint, 가는 기능을합니다. 신난다. 

큰. 그래서 마지막에 자바 스크립트에 대해 말할 그것이 무엇을 정말 유용 것입니다 비동기 작업이라고합니다. 비동기 수단은 우리가 일부 동작을 기다릴 수 우리가 이동하기 전에 완료 우리가 기다리는 동안에, 그러나 이동 다음 뭔가 나중에 일이 있습니다. 그리고 내가 그 뜻은 당신입니다 상황 곳을 상상할 수 당신은 요청을 보낼 어딘가에 일부 웹 서버, 그리고 그것은 당신을 다시 보낼 것 데이터의 일부 큰 덩어리, 오른쪽? 그리고 사용자는 기다릴 수 그동안 그렇게하기 위해서는, 아무것도 할 수 없었다 그 시간에 일어나고. 하지만 그 좋은 디자인, 오른쪽이 아니다? 당신은 웹 페이지를 고정하지 않습니다. 어떤 사용자가 원한다면 드롭 다운 메뉴를 클릭? 그것은 좋은 디자인 패턴이 아니다. 대신, 기본적으로 무엇을 자바 스크립트는 말한다된다 않습니다 확인을 비동기 적으로이 작업을 수행. 그래서 같은 배경에서 대기, 다음 동작이 행해질 때 콜백을 호출 function-- 어떤 함수를 호출, 몇 가지 action-- 신호를 어떻게 우리는이를 위해 기다리고 있었다 조작 이상입니다. 슈퍼 강력 이유이며 우리는 무언가를 인수를 전달할 수 있습니다, 뭔가를하고 기다립니다 뭔가 일이 있었하려면. 그런 다음, 뭔가 한 번 우리는 콜백을 호출 할 수 있습니다 완료됩니다. 그것을 할 수 있기 때문 정말 편리합니다 우리는 웹 오디오 API를 사용하여 일을 예를 들어, 부하 등 원격 서버에서 오디오 파일 기다리지 않고도 전체 오디오 파일을로드 할, 정말 할 것이다 사용자 경험에 대한 나쁜. 시원한. 

마지막으로 부부에 대한 참고 사항 디버깅,이 이후 당신이해야 할 겁니다 것입니다 프로젝트의 일환으로, 보장. 나는 자바 스크립트 콘솔을 언급했다. 그것은 매우 유용한 기능이다 모든 현대적인 브라우저, 그리고 우리는 정말로 얻을하는 것이 좋습니다 콘솔을 사용하여 편안하고, 당신은 자바 스크립트에서 좋은 얻으려면. 그것은 슈퍼 편리합니다 디버깅뿐만 아니라있어 계산 정말 유용 밖으로 방법 API를 사용합니다. 정말 가능 쉽게 실험 일부를 입력 할 필요없이 코드는, 다음 컴파일. 당신은 모든 단계를 수행 할 필요가 없습니다. 당신은 쓸 수 있습니다 라인에 일부 코드, 다음에 즉각적인 피드백을 얻을 코드 행 여부 매우 편리 worked--. 

또한, 하나의 기술 note-- 자바 스크립트 콘솔은 예입니다 즉, REPL을 R-E-P-L 그래서 REPL--의, 읽기를 의미하는 평가 인쇄 루프. 당신은 몇 가지 물건을 입력거야 에, 그것은 당신이 입력 한 내용 읽어 줄 테니, 그것을 평가하는 것, 그리고 인쇄 거 출력 한 다음 다시 시작합니다. 그것은 당신이 신속하게 들어갈 수 있습니다 원은 정말 멋진 인 반복. 

나는이 note-- 진짜 마지막을 추측 네, 실제 마지막 주입니다. 우리는 어떻게 실제로 자바 스크립트를 사용합니까? 그래서 첫째, 우리는 가져올 수 있습니다 그 스크립트 태그를 사용하여 HTML의 상단이나 하단에 file-- 어딘가에 HTML 파일의 내부, 정말로. 그리고 스크립트 태그 안에있다 자바 스크립트를 가져 오는 두 개의 하위 방법. 첫째를 갖는 것입니다 별도의 자바 스크립트 파일 우리는 전체를 가져, 또는 스크립트 등의 코드 영역을 가짐으로써 다음 시작하고 백 슬래시 스크립트는 종료합니다. 그리고 우리는 단지 쓰기 HTML 파일 내부에 자바 스크립트. 사람들은 두 가지 방법이 있습니다. 당신은 HTML의 내부를 가질 수 없습니다. 관객 : 다른 쪽보다 더 나은 무엇입니까? SAM 그린이 : 질문이었다, 다른 쪽보다 낫다. 그래서, 그래, 코딩 스타일 연습으로, 또한이 디자인 연습처럼. 두 가지 이유가 있습니다 왜 더 좋을 수 있습니다. 첫 번째는 당신의 코드를하게된다 더 많은 읽을 수는 HTML의 모든 경우 하나 대신에, 당신의 CSS 모두에 다른 장소, 자바 스크립트의 모든 3 위입니다. 권리? 나는 우리가 이미 이야기해야 생각 sections-- 등에는 약 CSS-- 무엇 그 is--하고 간다 종종 다른 파일. 그래서, 여기 개념의 유사한 종류. 또한 상상할 수있는 자바 스크립트 하나 이상에 재사용 될 HTML 페이지, 또는 아마도 수많은 HTML 페이지, 그 자바 스크립트를 갖는 하나에 리팩토링 가져올 수있는 파일 하나 이상의 장소에 코드는 할 수 있습니다 방법이 더 유지 보수. 당신은 하나를 만드는 상상할 수 자바 스크립트로 변경 하고있는 것은 그것을 변경 (100) 다른 파일. 그리고 대신에 우리는 단지 그것을 변경할 수 있습니다 방법이 더 강력 하나에. 나는 귀하의 질문에 대답 했습니까? 시원한. 

우리는 또한, 콘솔에 입력 할 수 있습니다 우리는 앞서 언급 한 바와 같이. 그리고 다시, 마지막 note-- 오디오가 내장되어 웹, 당신은 아무것도를로드 할 필요가 없습니다. 시원한. 어떤 질문이 있습니다 당신이 할 자바 스크립트에 대한 더 많은 질문, 우리는에 이동하기 전에? 

청중 : [들리지] SAM 녹색 : 좋아, 멋진. 그래서 지금은 API에 대해 이야기 할 것입니다. 

휴 자브리스키 : 차가운. 감사합니다, 샘. 

SAM 녹색 : 물론. 휴 자브리스키 : 최고, 그래서 우리는 자바 스크립트에서 이동합니다. 그래서 우리는 몇 가지에 대해 이야기했습니다 자바 스크립트의 필수 요소, 이들 변수는, 함수이며, 객체 변수로서 기능 비동기로드. 다음은 당신이거야 모든 것들 웹 오디오를 사용으로 참조하십시오. 그래서 우리는 단지 이야기하는거야 높은 레벨에서 먼저 약. 

그것은 API, 그래서 그것은 뭔가 샘이 말한대로 그이 내장 것, 바로 자바 스크립트로 콘솔에 사용하는 것이. 그리고 그것은 단지 C와 같은 ++ 코드 사실이다 그 정말 크롬에 내장되어 파이어 폭스, 이들 브라우저의 모든. 웹과 주요 아이디어 그래서 오디오는 당신이 가지고있다 오디오의 파이프 라인의 종류, 오른쪽? 그래서 오디오 데이터 어떤 형태로 제공됩니다. 

세 가지 주요 forms--의 종류가있다 당신은 오실레이터를 가지고있는 사인파가 생성, 코사인 파, 우리가 어떻게 작동하는지 보게 될 것입니다. 또 다른 매우 일반적인 하나, 물론, MP3이다. 그래서 어쩌면 당신은 시작 노래, 다음 일부 필터링을 수행 할 그 출력하도록 그 that-- 가능한 원천이 될 수있다. 그리고 정말 멋진 하나는 마이크로폰이다. 그래서 당신은 매우를 사용할 수 있습니다 자바 스크립트의 기본 통화 에 액세스하려면 마이크, 만약 그렇다면 당신 응용 프로그램을 만들고 싶었다 피치 검출기 등, 예를 들어, 그에 소요 당신의 목소리와 아웃 인물 그에게 pitch-- 아주 쉬운 방법. 당신은 가지를 읽을 수 있습니다 에, 주파수를 파악, 다음 출력 번호. 그래서 우리는 그 작동 방식을 볼뿐만 아니라 수 있습니다. 

대상은 기본적으로 여기서, 음성 데이터가 출력된다. 그래서 일반적으로, 그처럼 노트북 스피커. 다른 옵션은 같다 ScriptProcessorNode-- 우리는 노드에 도착합니다 second--하지만 기본적으로, 하나는 소리를 퍼팅 컴퓨터를 통해 스피커를 통해, 또는 당신의 종류 그래서, 그것을 기록하고 당신은 오디오 데이터로 저장하고 있습니다. 그래서 어쩌면 누군가가 만드는 경우 음악 앱에서 다음 당신은 어쩌면 같은 것을 기록 할 example--를 들어, 사운드 클라우드로 내보낼 즉, 그 작업을 수행하는 하나의 방법이 될 것이다. 모든 재미 물건, 우리가 얘기하자하는, 이들 두 지점 사이에서 일어나는 우리는 음악을로드 할 경우 그리고 다음 출력. 

그래서 다섯 가지에 대해 이야기하려고 해요 두 번째 오디오 생산의 단계. 우리는 호출이 일이 AudioContext, 어떤 우리는 여기에서 볼이 작은 래퍼입니다. 우리가 경우 기본적으로 무엇은 ... - AudioContext 지금 자바 스크립트 콘솔로 이동 우리는 지금을 만들 수 있습니다. REPL 그냥 예를 들어, 오른쪽? 우리는 읽고, 평가, 그리고 인쇄합니다. 

AudioContext는 글로벌 상태입니다. 그것은, 그것은 객체 구조체의 것 여기서,와는 정보를 유지 것들에 대해 진행되는 오디오 관련 화면. 하나의 예는 현재의 시간이다. 이것은 당신에게 번호를 알려줍니다 초, 매우 정밀, 웹 페이지부터로드. 그래서 이것은 정말 유용 당신이 사용할 수있는 작은 호텔입니다. 그것은 only-- 읽은 나는 실제로 생각 당신은 그것을 값을 설정하려고 할 수 있습니다. 그것은 당신이 그것을 설정 말할 것이다, 그리고 당신은 그것을 인쇄 할 경우 again-- 실제로 잘 작동을하지 않았다. 그래서 거기에서 읽기 전용 자바 스크립트의 속성. 이 경우 정말 유용 당신은 종류의 동기화하고 다른 많은 정보, 때 당신이있어 종류의 서로 다른 소리를 재생합니다. 

또 다른 매우 유용 하나 콘텍스트 대상이다. 당신이 관심이 있다면 확실히, 수 자신의 콘솔 오른쪽이 시도 지금. 그래서이 AudioDestinationNode이다. 기본적으로이가 말하는, 출력은 어디로 가고 있는가? 그래서 여기에 두 개의 실제 옵션이 있습니다. 일반적으로 기본 당신의 스피커이며, 그래서 AudioDestinationNode 기본적으로 그냥 말한다 사운드 제로 출력이 있습니다 오고, 스피커로 전송. 그래서 일반적으로, 당신은하지 않습니다 그와 함께 플레이해야합니다. 당신은 실제로 사용에 관심이 있다면 기록 ScriptProcessorNode, 확실히 저를 촬영 이메일은 그건 나중에 때문에 조금 더 복잡합니다. 그러나 일반적으로, 당신은 친절 어떤 형태의 사운드를 출력. 그래서 멋진, 우리는 여기에 다시 이동합니다. 청중 : 미안 해요. 휴 자브리스키 : 네. 청중 : 당신이 얘기라고 알고 당신에게 나중에 기록에 대한. 당신은 프로 도구와 인터페이스 할 수 있습니까? 

휴 자브리스키 : 프로 도구? 어디 보자. 그렇게 생각하지 않아요. 그래서 클라이언트 사이에 가고, 이는 자바 스크립트입니다 콘솔 및 실제 컴퓨터는 일반적으로 종류 뭔가 의 제한을 해제, 당신 경우 종류 짓이야의 성격에 의해, 윌 그것은, 디자인 물건의 종류의 하지만 당신은 별도의 브라우저를 유지하려고 사용자의 실제 컴퓨터. 일반적으로, 유일한 것은 당신이 할 수있어 액세스는 마이크 나 카메라입니다. 당신은 할 수없는 것, 내가 생각하지 않는다, 프로 도구를 사용합니다. 그러나, 당신이 만든 경우 프로 도구에서 트랙, 당신이를로드 할 수 있음을 수출 여기에서, 예를 들어, 필터링, 과정이, 그리고에 그 기록 오디오 Destination--하거나, 구를 말아요 - 프로세서 노드. 거기에서 그리고, 당신은 할 수 , 사운드 클라우드에 당신을 그 수출 이메일로 보내거나 수 당신이 무엇을 거기에서 좋아한다. 

그러나 약간의 장벽 가지가있다 컴퓨터에 음악을 만드는 사이 온라인으로 음악을 만들기. 

SAM 녹색 : 그리고 그건 이 API에 고유하지 않습니다. 그것은 크롬의 보안 기능, 그리고 나는 다른 모든 현대적인 브라우저를 생각합니다. 브라우저 자체에 포함 된 것입니다. 그래서 예를 들어, 웹 페이지 못해 사운드를 다시 켜 자바 스크립트를 사용 예를 들어 스피커에에. 아니면 컴퓨터를 끌 수 없습니다. 그리고 어떤 중간 지점이 없습니다 그 두 가지 사이에, 오른쪽, 그러니 당신은이 완전한 추상화, 또는 당신은 최대 열 시키는의 보안 결함 나쁜 의도를 가진 프로그래머 할 무엇이든 그들이 당신의 노트북과 함께합니다. 크롬은 자체에 포함 된 이유입니다. 

휴 자브리스키 : 네. 말이 돼? 쿨, 쿨. 난 그냥 가고 있었다 하나의 예를 나타낸다. 이 같은 꽤 많이 있습니다 지금까지 당신은 측면에서 얻을로 사용자의 컴퓨터에 액세스. 당신이있는 경우 USB 키보드에 연결 당신은 웹이라는 것을 사용할 수 있습니다 미디 API를하는 우리는하지 않습니다 정말 여기에 대해 이야기 하지만이의 또 다른 API입니다 다시 적어도 Chrome--에 내장, 우리가 Chrome--을 좋아하는 이유입니다 나는 파이어 폭스 나 사파리 생각 이에 쉬운 일입니다 google-- 다른 브라우저는이 다른 지원 API를 그들은 구현했습니다. 당신이 원하는하지만 키보드를 연결합니다 그 정보와 함께 작동, 종류의 키보드를 보내 컴퓨터를 통해 정보 다음,이 API를 그 온라인을 사용 당신이 작업 할 것 곳입니다. 

시원한. 그래. 그래서, 빨리 여기에 이​​동. 우리가 어떻게 시간에 뭐하는거야? 

스피커 1 : 약 15. 

휴 자브리스키 : 15분 왼쪽? 그래 좋아. 그래서 우리는 여기에 앞서 경주 할 것이다. 

그래서 기본적의 요점 파이프 라인으로이 생각 있다는 파이프 라인의 각 단계 오디오 노드의 시리즈이다. 우리의 소스는,의 말을하자, 발진기이다. 우리는 발진기 노드를 작성해야합니다. 그리고 그것은 단지 종류 작은 function--의 그들은 모든 기반을 둔 것 여기에 오디오 문맥. 

청중 : 그것은 말했을 때 오실레이터, 그 의미 하는가 실제로 문자 그대로에서거야 앞뒤로 두 개의 서로 다른 극? 

휴 자브리스키 : 아니, 그것은처럼 디지털 표현. 그것은 실제로 C ++로 구현합니다. 실제로 사양을 모르는 그것을 실제로 구현 어떻게의, 하지만이 모든 바이너리 데이터로 노력하고 있습니다. 사실, 그래. 그게 내가 할 수있는 말 것 실제로, 당신이 관심이 있다면, 나는 당신에게 조금 더 보낼 수 있습니다 방법 파형에 대한 정보 디지털 포맷을 갖는 유지됩니다. 그래 좋아. 

그래서 우리는 사인과 같은 톤을 생성하고 어쩌면, 파도 또는 그런 일 440 헤르츠. 우리는 발진기를 만들 수 있습니다. 우리는 볼륨을 설정하려면, 우리 GainNode에 아무것도 연결 이는 우리가 .creategain와 함께 할 수 있습니다. 즉, 볼륨을 설정합니다. 당신은 어떤에 그것을 전달할 수 있습니다 options-- 아니라 다른, 그래서 음성 버퍼 소스 노드는 어디 수도있다 당신이로드 한 MP3 파일을 저장합니다. 

바이 쿼드 필터는 필터링 경우입니다 당신은 밖으로 모든 기지를 먹고 싶어 같은 노래, 또는 무엇인가. 하나님은 당신이 먹고 싶어 금지 노래 중 기본. 및 AudioDestination 노드는 다시 인 같은 우리의 마무리는입니다. 당신은 보는 이제까지 관심이 있다면 모든 다른 가능한 옵션, 그냥 탭으로 이동하자 자동 완성은 올. 당신이 만들 경우, 당신은 모두를 볼 수 있습니다 만들 수있는 여러 가지. 당신은 동적를 만들 수 있습니다 스크립트 프로세서, 난 무엇을 알고하지 않습니다 채널 합병을 혼합한다 채널 쪼개기 및 모든. 시원한. 

그래서 이것은 단지입니다 파이프 라인의 예. 그래서 우리는 세 가지 소스가 들어오고 있습니다. 어쩌면 이러한 파형은, 어쩌면 이러한 MP3 파일입니다. 하나는을 통해거야 필터, 다른 하나의의 왜곡지고 다른 하나의 팬은 왼쪽과 오른쪽. 당신은 모든 종류의 것들을 할 수 있으며, 그들은 모두 함께 주위에 혼입 다음 밖으로 오디오를 제공 대상으로 단부에서. 이것은 무엇을 더의 예입니다 복잡한 웹 오디오 코드처럼 보인다. 당신은 모든을 만드는 다른 개체 바로 here-- 나는이의 확실하지 않다. 아니, 확대하지 않습니다. 그래. 

SAM 녹색 : 당신은 제어, 스크롤 업을한다. 휴 자브리스키 : 제어 Scroll-- SAM 녹색 : 아니, 아니. 제어-- 

휴 자브리스키 : 아, 제어, 스크롤? 잡았다, 오. 네. 아니, 아니, 와우. 그래. 나는 그렇게하지 ​​않을 것이다. 

그래서 그래,이 첫 번째 여기 섹션, 당신은 볼 우리는 모든 다른를 만드는 문맥 노드. 우리는 단지 그들을 조립할있어 함께 두 번째 부분에서 연결이라는 기능에 의해. 그건 정말 열쇠 웹 오디오의 기능. 당신이 한 번 그냥 의미 하나의 노드에서 소리와 함께 무엇인가, 다음 노드에게 전달. 그래서 우리는 소스를 가지고, 그것을 분석기에 연결 분석기는, 그것으로 무언가를 또한, 왜곡 등을 진행하고, 그리고 대상에 바로 여기 바닥에. 시원한. 좋아, 그래서 우리는에 이동하겠습니다. 

pipeline-- 다시,이 가장 일반적인 파이프 라인은, 그래서 우리는 같은 모든 것들에 대해 이야기 왜곡, 패닝,이 모든 것들. 당신은 정말 관심이 있다면 사물 프로 도구를 사용에서, 사람들은 아마 당신이 관심. 그렇지 않다면, 어쩌면 단지 소리를 재생하려면, 또는 어쩌면 당신은 원하는 소리의 볼륨을 설정합니다. 이들은 가장 일반적인 두 일종 오디오 생산 파이프 라인. 

다시, 방법은 당신이 그것을 걸릴 수 있습니다 oscillator-- 그래서,하자로 바로 여기에 그 데모 않습니다. 그래서 우리는을 만들거야 여기에 간단한 오디오 문맥, 그에서 우리는거야 우리의 오실레이터를 만들 수 있습니다. 즉 그래서 다시, 우리는 그냥있어 오실레이터를 만들기 전화 것. 우리는에 주파수를 설정하는거야 440 헤르츠, 모두가 좋아하는 그. 그 다음 우리는 목적지에 그 연결 point-- 스피커 때문에, 이는 상황에 맞는 목적지. 마지막으로, 우리가 말을, 영을 시작 지금부터 초, 우리는 소리가 있습니까? 

[울리는] 

휴 자브리스키 : 여기 우리는 간다. 그냥 사인파입니다. 그래 좋아. 그리고 우리는 그것을 중단됩니다. 

청중 : 않았다 그 피드백에서 온? 

휴 자브리스키 : 피드백? 아, 아마 우리의 마이크. 당신이 그것을 어떻게 그래서 그래, 그건. 그리고 실제로 나는이 있다면 당신, 보관을 실행 주파수를 가질 수있다 이 실행중인 같이 값, 그래서 놀 수있는 재미있는 일이다. 시원한. 즉, 항상 존재하는 사랑스러운 하나입니다. 

SAM 녹색 : 우리는하지 않았다 우리는 그것에 대해 않았다고 생각? 휴 자브리스키 : 네, 그 더러운 하나입니다. 그래서, 버퍼 loading-- 내가 보여주지 맨 마지막에 그 예. 즉, MP3를로드합니다. 그리고 마이크, 당신은 단지 기능을 사용 ) (Navigator.getUserMedia라고 사용자의 액세스를 요청하는 그 내용은 마이크입니다. 

여기 필터링 것, 나는거야 그냥에서 계속 이동. 이 꽤 높은 수준이다 하지만 필터는 단지 당신에게 허용 

[삐 '소리] 필터링은 또한 수 있습니다 핑크 같은 것들을 만들 수 있습니다 소음, 갈색 잡음, 화이트 노이즈. 당신은 순수한 소음을 만들려면 어떤 어떤 사람들은, 주위를 혼란에 사랑 당신은 웹 오디오를 사용할 수 있습니다 필터링은 그렇게 할 수 있습니다. 

오디오 Panning-- 그렇게 상상 당신은 게임을 작성하는 경우 당신은 소리를 원하는 이 같은오고 같은 소리, 화면을 가로 질러 촬영, 당신 오디오의 패닝을 사용할 수 있습니다 콘의이 종류를 만들려면 이는 꽤 mathy의 그때 엔, 하지만 정말 사실이다 멋진 당신이 일을 얻는 경우에, 어떤 좋은있다 그것에 자습서 난 당신을 보낼 수 있습니다. 기본적으로, 당신은 종류의 수 소리를 만들 3D 방식으로가는 뭔가. 당신이 DJ의 관심이 있다면, 당신은 할 수 있습니다 혼합 시작하고 페이딩 노래를 교차. 

이것은 단지 아주 기본적인 코드, 내가 전에했던 기본적으로 무엇을. 이것의 체적을 설정 오실레이터, 그래서 우리는 우리의 발진기를 만들 어떤 파형을 생성한다. 우리는 우리의 GainNode를 작성, 우리의 주파수를 설정, 다음에 오실레이터를 연결 다음 기본적으로 변경 GainNode, 얼마나 많은 신호를 통해 허용됩니다. 하지만 실제로, 그것은 디지털의 일,이, 그래 그냥 ... 더 그렇게. 즉 실제로 일어나고있는 일이 아니다, 하지만 실제 생활에서 일어나는거야 이득. 

청중 : --quantization 볼륨 파라미터? 휴 자브리스키 : 죄송합니다? 청중 : 그것은인가 양자화 된 볼륨 매개 변수? 휴 자브리스키 : 네. 그리고 이것은 정말이야 한 것입니다 내 지식의 결핍, 어떻게 이득은 디지털 수준에서 작동합니다. 나는 실제와 알 신호, 그것은 기본적있어 제어 얼마나 당신이있어 신호를 증폭. 그래, 좋아. 난 당신에 대한 자세한 정보를 보내드립니다 나는 실제로 싶은데요 때문에, 그 그에 대한 자세한 내용을 알고. 그러나 기본적으로 매개 변수 하나는 fold--입니다입니다 크게 signal-- 제로가없는 신호, 또는 당신은 어떤 소리를들을 수 없습니다. 우리는 그 때문에에 대한 데모 시간을 건너 뛸 수 있습니다 내가 전에했던 기본적으로거야. 그리고 다시, Context.Destination 오디오 목적지 노드이다. 신난다, 확인을 클릭합니다. 

그래서 빠른 두 데모를 할거야. 우리가 어떻게 시간에 뭐하는거야? 

스피커 1 : 약 10 분. 

휴 자브리스키 : 십분? 큰! 신난다. 

그래서 내가 갈거야 첫 번째 그것은 내가 제일 좋아하는 노래라고 않습니다. 그래서 이것은 단지입니다 작은 HTML 자바 스크립트. 우리는 두 개의 버튼을 가지고거야 페이지에서 내가 제일 좋아하는 노래를 재생 내 좋아하는 노래를 중지합니다. 나는이 변경됩니다. 

청중 : 마이크 커버. 

휴 자브리스키 : 네. 그리고 여기에로드 한 basically-- 스크립트 이것은 정말 유용 MP3를로드하는, 그래서 이것은 단지 만든다 빠른 MP3 파일 방법을로드. 그것은 기본적으로 그냥 래퍼입니다. 그것은 단지 과정을 만든다 훨씬 빠른 MP3 파일에서로드, 그렇지 않으면, HTTP 요청을 사용하고 종류의 우리가 뭘하고 있었는지 등 서버에 설정된 현재의 조각에. 그것은 정말 추한 당신 그렇게하고 싶지 않아요. 

그래서이 사람, 보리스의 SMU는 정말 썼다 BufferLoader라는 유용한 작은 도구입니다. 당신이 모두가 통과 단순히 문맥은, 당신은 그것을 list-- 통과 또는, 그래, 자바 스크립트의 목록입니다? SAM 녹색 : 배열입니다. 휴 자브리스키 : 아, 그것이 배열, 맞아. 이 경로의 배열 다른 파일. 그리고 당신은 그 기능을 전달합니다. 이것은 우리가 얘기했다 콜백입니다 비동기 로딩에 대해. 즉 호출됩니다 로드 된 파일을 한 번. 그리고 그 기능이 때 호출되는 파일의로드가 주변을 취한다 로드 버퍼의 배열. 그래서 여기에 발생합니다. 기본적으로, BufferList입니다 하나 value-- 될 것 또는 그것의 배열이 될 것 인덱스에에이 길이 하나, MP3의 전체로드 된 파일을 제로. 그래서이 끝나면 내가 뭘 로드 내가 단순히이다 버퍼 소스를 생성하는 음성 버퍼 소스 노드이다. 다음 단계는 내가에로드입니다 전체로드 버퍼로 source.buffer BufferList--에서 그것은 buffers-- 많이이다 다음은 오디오 연결 목적지로 버퍼. 그래서 무엇을 할 것 단순히 MP3를 넣어 바로 출력에 이르기까지, 그리고 즉시 시작 이 호출을 받고시. 

쿨, 그래서 보자 이 작업에서 발생. 내 [들림] 여기, 어디 보자. 그래서 난 그냥 갈거야 기본 서버를 시작합니다. 즉, 뭔가 그 당신은 당신이 있다면 할 필요가 로드 파일에 대한 요청을. 나는 기본 서버를 시작하겠습니다. 이것은 기본적으로 전체입니다 지금은 한 줄에 PSET, 그러나 그것은 단지 시작하고 포트 80/80의 서버. 그래서 우리는 여기에 가서, 우리 80/80를로드하는 것, 우리는 내 좋아하는 노래에 갈 것입니다. 내가 공격한다면 "재생 내 지금 좋아하는 노래 " 그것은로드 것 내 좋아하는 노래와 그건 ... 플레이 FAST의 독수리, "생명 - [음악  레인"] 을 실현합니다에 "인생 될 일이 이글스에 의해 빠른 차선 ". 지금, 나는 그만 "칠 수있는 내 좋아하는 곡 "그것을 재생. 

FAST의 독수리, "생명 - [음악  레인"] 

그리고, 때문에 콘솔에 가서 경우 나는 여기에 전역 변수를 사용 실제로,이 값을 추적 할 수 이제 콘솔에서 인식됩니다. 그래서 나를 위해 자동으로 생성합니다. 그래서 지금 재생 무슨이다, 나는 단지)​​ (source.stop 호출 할 수 있습니다 그합니다. 글쎄, 당신은 무엇을 알아? 그냥 그래서 너희들이 들었이 song-- 당신은이 노래를 인식 할 수 있습니다. 

[음악 - 릭 ASTLEY는 "전혀 원하지 GIVE  당신 UP "] FAST의 독수리, "생명 - [음악  레인"] 우리는 지금 모두 Rickrolled했습니다. 확인, 큰,에 이동. 시원한. 그래서 이것은 기본적으로의 예입니다 당신은 MP3를로드 할 수있는 방법을 file-- FAST의 독수리, "생명 - [음악  레인"] - 그리고 그것을 재생, 중지 및 시작합니다. 내가 더 많이 할 수 있었다 [들림] 

내가 할 것이다 마지막이고, 나는 [들림] 당신에게 보여줄 것이다. 

[음악 재생] 

그것은, 같은 ogg.wave.mp3입니다. 내가 정확히 기억한다면 나는 생각한다, 나는 .M4A 몇 가지 문제로 실행했습니다 하지만 난 그것에 대해 확실하지 않다. 나는 mp3.wave-- 생각 

[음악 - 릭 ASTLEY는 "전혀 원하지 GIVE  당신 UP "] 

큰 확인. 나는 그런 말을하지 말았어야. 안녕하세요, 어쨌든. 그래서 우리는이 열려 있습니다. 그래서 지금 내가 모두 기본적으로 내가 만든 것입니다 음악을 만드는 기본 구문. 내가 좋아하는 일을한다면, G4를 추가 1 2에, 그 무엇을 뜻이며, 피아노 노트, G4를 추가 이는 제 G이고 바닥에서 피아노까지. 그래서이 MIDI의 종류 말이며, 그래서 음악을 기반으로 사람들을 위해, 이것은 단지 MIDI 노트입니다. 

청중 : 그 G의 중동 C의 오른쪽? 

휴 자브리스키 :이 G입니다 중간 C 이상, 맞아. 

청중 : 위 중간 C. 

휴 자브리스키 : 네. 사실, 예. 나는 실제로 만들었다 고 생각 그것은 하나 [들림], 그래서 이것은 그 위의 옥타브 수 있습니다. 그래서 보자. 나는 Play-- 충돌하는 경우 [반복 피아노 참고] 듣고가는 않네. 아이디어는 작동한다는 것입니다 다만, 명령 줄 것 같은 그래서 나는 위아래로 이동하는 경우 내 키보드에, 당신 이전으로 돌아갈 수 있습니다 꽤 유용하다, 명령. 그리고 아래 트랙 내 목록입니다, 이는 모든 루프에서 실행된다. 

청중 : 당신은 가정 된 그 키보드 88 키, 오른쪽? 

휴 자브리스키는 : 질문이었다, 내가 88 키 키보드를 가정하고, 그래, 나는 생각합니다. 내가 한 일은 내가있다 기본적으로 88 샘플을했다 피아노, 각 주에 대한 하나의. 그래서 때마다 당신에게 지금부터 메모를 듣고, 즉, 실제로 보이는 루프 이는 루프에서 재생지고 그때 엔 그래서 모든 노트, 이것은 실행 중입니다. 무슨 일 나는 것입니다 다시 버퍼를 생성, 나는 볼륨을 설정하는 이득 노드를 작성합니다. 이 단지 정말 나는 말의 복잡한 방법 source.buffer에 버퍼를 저장합니다. 나는 그것에게 이득을주고, 내가 이득에 연결, 이득에 접속되고 출력 한 다음 그것을 재생할 수 있습니다. 그래서 프로세스의 종류는 버퍼 소스에 복용. 

청중 : 당신은 실제로 걸릴 수 있습니다 건조 소리와는 젖은 [들림] 만들? 

휴 자브리스키 : 당신이 할 수있는, 그래. 재 동사가있다,있다 지연, 왜곡. 당신은 기본적으로 아무것도 넣을 수 있습니다 동행입니다 물론 그 샌드위치 사이에, 파이프 라인은, 더 나은 은유이다 하지만 당신은 아무것도를 추가 할 수 있습니다. 시원한. 

그래서 데모를 완료합니다 여기에 당신에게 느낌을주고 시간의 단지 깎아 지른듯한 숫자 당신 한 번에 모두 해당 기능을 실행할 수 있습니다. 그래서 나는이 문제를 제거하는거야. 나는 발전기를 만들려고 that-- 기본적으로이 정말 does-- 무엇 복잡한 syntax-- 가지 그러나 그것은이다 즉시 메모를 생성하는 것, 그냥 재생을 시작 그들은 그들을 평가로. [개재 PIANO] 

그래서 우리는 단지 여기에 약간의 음악을 만들 수 있습니다. [개재 PIANO] 

그래서이 명령 예를 들면, 수행 그것은에 대한 그 세 메모를 피아노와는 B3에 그들을 저장합니다. 이 구문은 할 수 있습니다 좀 더 의미 이 사람들에게 여기에 음악을 배경. 

나는 킥 드럼을 추가 할 수 있습니다. 저 할 수 있어요-- 

[끼워 악기] 

--just이 함께 놀러. 

그래서 당신은 make-- 수 있습니다 [끼워 악기] 즉, 하나는 좀 더 짜증나. [끼워 악기] 

그 무작위로 건조 심벌을 추가 그래서 16 %와 모든 16 노트에 [알아들을 수 없는]. 

[끼워 악기] 

네, 그래서 방법이 이 4 항상 works-- : 4. [끼워 악기] 

그래, 네 분기 및 16/8 그래서. [끼워 악기] 

따라서 평균적으로는 60 %를 얻을 수 16 일 노트 안타. 

어쨌든, 이것은 단지했다 가지 표현하기 당신이 할 수있는 몇 가지 웹 오디오 API를 구축 할 수 있습니다. 그것은, 정말 빠르다, 정말 강력 당신은 멋진 많은 것들을 할 수 있습니다 그것으로. 그래서 다시, 당신은 어떤 질문, 이메일 myself-- Hugh-- 또는 샘, 솔직히, 구글은이 좋은 자원의 톤. 모든 마지막 질문? 네. 

청중 : 그래서 당신은 액세스 할 수 있습니다 내장 마이크. 당신이 원한다면 무엇 더 나은 마이크를 사용할 수 있습니까? 휴 자브리스키 : 당신이 원한다면 더 나은 마이크를 사용 하는가? 그래서 또한, 이것은의 일부 크롬 사이의 추상화 컴퓨터의 나머지 부분. 그것을 통해 사용할 아니라면 API, 웹 미디 API와 같은, 당신은 아마 해킹을 찾을 수있는, 하지만 일반적으로 가능하지 않습니다. 

SAM 녹색 : 당신은 also-- 수 있습니다 모든 크롬은 알고있다 무엇 기본 마이크 이며, 그 액세스한다. 당신은 마이크가 있다면 당신은 수 있도록 컴퓨터의 기본 마이크로 설정, 당신은 그런 식으로 액세스 할 수 있습니다 그것은 아마 작동합니다. 휴 자브리스키 : 좋은 지적입니다. 그 시도,하지만 적이 당신은 종류에 할 수 있습니다 동행입니다 만약 입력 스피커 리디렉션하면 당신은 그래, 그렇게 할 수 있습니다. 

모든 마지막 질문? 시원한. 그럼 너희들을 감사 보고에 대한 너무 많은. 나는 휴입니다. SAM 녹색 : 나는 샘입니다. 휴 자브리스키 : 그리고이 CS50입니다.