SAM GREEN: Hallo, iedereen. Welkom op onze seminar. Mijn naam is Sam. HUGH ZABRISKIE: Ik ben Hugh. SAM GREEN: En we gaan vandaag praten over JavaScript en de Web Audio API. Gewoon om te beginnen, dit is een schets van onze agenda voor het seminar. We gaan om te beginnen door te praten over waarom je geïnteresseerd bent in het web moet worden Audio API, waarom is JavaScript de taal die u nodig hebt voor het, en dan praten over JavaScript essentials-- zo graag, loop je door een aantal basiskennis van de taal, en dan praten over de audio-API op een hoog niveau. Dan zal Hugh praten over een aantal stadia van de audio-productie en dan demo deze geweldige sequencer project bouwde hij en tonen u de code. En dan zullen we de tijd hebben voor vragen aan het eind mensen die hier wonen. HUGH ZABRISKIE: Cool. SAM GROEN: Cool. HUGH ZABRISKIE: Cool. Ik zal een back-up. SAM GREEN: Dus, eerste dingen eerst. Dus een van de grote dingen over het Web Audio API is dat er geen set-up nodig. Het komt ingebouwd in de meeste moderne browsers, waaronder Chrome, Edge, een hele stelletje others-- al degenen dat grote delen van mensen gebruiken vandaag. Dus er is geen opgezet, afgezien van het net een webserver te gaan, voor je aan de slag te werken op uw project, dat is geweldig. Wij raden vrij zwaar dat je bedenkt met behulp van Chrome voor JavaScript webontwikkeling, gewoon omdat de ontwikkelaar tools zijn echt sterk. Als een voorbeeld van wat we bedoelen door te zeggen open uw JavaScript console-- als je in Chrome en je kijkt naar een webpagina, en je klikt links Inspecteer Element, en vervolgens je naar deze kleine drop-down hier en u klikt op Console, je zult zien wat opent ziet er een partij zoals een opdrachtprompt die u zou kunnen zien op je Mac, of op de ID. En net als dat, we kunnen soort commando hier, zoals Clear, en andere commando's zoals dat. We kunnen variabelen, zoals we zullen later zien in JavaScript. En dus alles wat we kunnen doen in JavaScript, kunnen we doen met de console, en dat is een super handige manier om beginnen te spelen rond met API's en het krijgen van comfortabel met JavaScript recht uit de vleermuis. Geen set-up nodig, dat is echt leuk. Koel. Geweldig. Dus gewoon een ding toe te voegen. Als u nog questions-- er velen van jullie die hier niet wonen, voel je vrij om ons-- deze e-mail zijn onze e-mailadressen. Als u vragen hebt u niet wilt dat om ons te vragen, zoals, oh ik heb een bug in mijn code, of iets dat is een beetje meer specifiek, misschien eerst Google het. Er zijn veel grote middelen over het Web Audio API die er zijn. Het is echt goed gedocumenteerd en het wordt gebruikt door een ton van de mensen in industrie en mensen die net het bouwen van leuke dingen voor zichzelf. Dus er veel moet worden van de middelen die er zijn. Geweldig. Cool, dus waarom het Web Audio API? Dit schema is een beetje een evolutie van de manier geluid op het internet is gegroeid in de tijd. BGSOUND was als de oorspronkelijke HTML-tag dat Internet Explorer gebruikt ter ondersteuning. Het stond alleen voor de vrij basic geluiden, nodig was niet erg robuust, en je kon niet doen ingewikkeld sequencing, of bepalen wanneer het geluid begonnen en stopte zeer robuust. Dus, het was niet bijzonder goed ontwikkeld. Dan na dat, Flash kwam along-- die Ik weet zeker dat jullie allemaal kennen met Flash-- misschien niet hoe het werkt, maar je hebt wel gezien. Je hebt om uw Flash Plug-in, al dat soort dingen, en dat zeker uitgebreid het bereik functionaliteit die beschikbaar was. Maar het maken van de gebruiker te installeren een plug-in is zeker een nadeel waaronder Flash in uw toepassing, toch? Want dan ben je afhankelijk van bent gebruiker te gaan en het vinden van deze plug-in, en waarschijnlijk wordt ingeschakeld uit door deze extra stap ze moeten nemen om uw app te gebruiken. En dan kan er een update worden dat zal je hele applicatie te breken, en het eindigt in een nachtmerrie voor de ontwikkelaar, ook. Dus dat was een barricade. En dan na dat kwam, de HTML-audio-tag, die is een kenmerk van de meer moderne HTML-- die zeker toegestaan ​​voor een veel meer dingen, maar ook de dingen die je zou kunnen doen Er waren een beetje beperkt net als gevolg van de dingen HTML dat in staat was. Dus als de JavaScript- API, het Web Audio API, werd een standaard oefenen in verschillende browsers, die echt verbreed de set mogelijkheden voor ontwikkelaars om echt in de bouw coole dingen voor het web. Voor een lange tijd gehad daar zijn echt krachtige hulpmiddelen native audio-toepassingen, like-- iedereen weet GarageBand, en dan natuurlijk zijn er meer professionele audio mengen toepassingen, en dat soort dingen. Maar er was niet een echt goed Cloud-- niet Wolk, ja, denk ik Cloud-- web-based platform dat wil ontwikkelaars toestaan bouwen van applicaties voor mensen audio mixen. En zoals hij zal laten zien later, het Web Audio API zorgt voor echt krachtig spul echt gewoon gebeuren, die is vrij cool. Dus dat is de opdracht om de reden waarom je moet de rest van het seminar te kijken, principe. En nu ga ik om te praten over sommige JavaScript-- gewoon basiselementen de taal, zodat kunnen we op dezelfde pagina als we praten over de API een beetje later. Koel. Dit is dus een samenvatting. Ik ben hier dit was. Ja. HUGH ZABRISKIE: Er is hier twee glijbanen. SAM GREEN: Dit is de samenvatting van een aantal beperkingen van de andere bindende, oude methoden. En dan nu, hebben we deze dingen. Koel. Geweldig. Dus, JavaScript essentie. First things first, is er een vrij significant verschil in JavaScript versus in een taal als C, in de weg die variabelen worden gemaakt. Dus in C, zijn we gewend aan onze variabelen te typen, toch? En dan bedoel ik niet het type zoals typt u deze in, dan bedoel ik het type als een Motortype- betekenis toewijzen als, een int, een vlotter, een char. In C, werden we echt gebruikt om met een variabele creëren en dan vasthouden aan dat type voor de hele tijd dat we die variabele. En dat is niet per se slechter, maar het is waarschijnlijk moeilijker te gebruiken. Een van de coole functies JavaScript is die variabelen zijn wat heet "dynamisch getypeerde," die betekent dat ik kan creëren variabele met die syntaxis varX gelijk aan 5, bijvoorbeeld. Die oorspronkelijk ontstaat een integer variable-- recht onder de hood somewhere-- maar ik kan die variabele veranderen om te verwijzen naar een string zonder iets te doen als een nieuwe variabele. Ik heb geen zorgen te maken over het type veranderen. JavaScript weet dat het type's veranderd, en die dynamisch gebeurt. Dus, er zijn voordelen en nadelen die, als iedereen die werkte in JavaScript voor een tijdje zou kunnen weten. Er zijn momenten waarop je misschien per ongeluk Wijzig het van een variabele en niet overweg met dat soort veranderen, en dan uw JavaScript kan crash-- of een uitzondering worden geworpen, want je moet de verkeerde type wanneer u verwacht een type. Koel. Dus, scoping-- die is als, als we herinner me de eerste weken in de loop, verwijst naar hoe toegankelijk een variabele is en in welk deel van de code. Dat alles ziet er zeer gelijkaardig aan de manier waarop het eruit ziet in C. Dus variabelen algemeen scoped binnen accolades binnen een functie, en dan zijn er ook wereldwijd scoped variabelen die zijn-- als u een variabele schrijven buiten een functie, Het zichtbaar in de gehele tekst zijn. Een verschil tussen de JavaScript en C in het bijzonder, is dat als je een globale declareren variabele overal in een tekstbestand het zichtbaar in een functie binnen die tekstbestand. Dat is juist, nietwaar? HUGH ZABRISKIE: Yep. SAM GROEN: Dus dat is ook een beetje beetje funky in vergelijking met C, waar we altijd naar onze variabele definities boven de plaatsen ze werden gebruikt. Dat is niet een regel die is opgelegd meer, dus, een beetje anders. En weer gewoon te reemphasize, globale versus lokale variables-- vergelijkbaar met C. Je kon twee variabelen met dezelfde naam, en hebben een van hun namen worden geschaduwd een lokale variabele als een van hen was globaal. Dus, zelfde soort problemen die sommigen van jullie kunnen in hebben gelopen in een aantal van uw probleem stelt tot nu toe. Koele, dus dat is variabelen. Control flow, wat betekent dat als, if-else-- logische stuff-- en loops. Dus om te beginnen, dit is wat als-else uitspraken lijken in JavaScript. De plaatsing van de verschillende dingen op de lijnen is niet belangrijk. Dit is slechts één van de conventies voor de manier waarop we structuur code. Net als in C, hebben we een "als" een haakje verklaring. Dat is niet wat ik bedoelde te doen. Ik deed het alweer. HUGH ZABRISKIE: Proberen om af te sluiten? SAM GREEN: Nee, ik ben gewoon proberen om in te zoomen. Het maakt niet uit. Dus, we hebben een "if" statement en wij hebben een aandoening binnen van het dat evalueert naar waar of onwaar, en dat bepaalt of gaan we dat blok van de code. En ook hebben we een anders-als, en Een andere, net zoals we gewend zijn in C. Je moet ook vrij comfortabel recht uit de vleermuis met lussen, omdat ze er ook veel op C lijkt. Maar je zult merken dat we weer , in plaats van int initialisaties, we hebben var initialisaties. En ik denk dat je moet voorzichtig te zijn ervoor dat u niet de waarde te wijzigen van I van een int naar een string, bijvoorbeeld, want dat gaat veroorzaken raar gedrag dat u misschien niet verwachten. Maar dit moet kijken redelijk bekend, als goed. Dus dit is waar de dingen beginnen te krijg je een beetje gek in JavaScript voor iemand die gaat van een achtergrond van C. Er zijn functies in JavaScript, en er is een manier een functie die lijkt te verklaren soort vergelijkbaar met C, en dan is er nog een die ziet er soort van verschillende. De eerste versie, die kunnen we hier zien, is een soort van C-achtig, waarbij we zeggen, dit is een functie, geef het een naam geven het aantal argumenten, en vervolgens de inhoud van de functie ga binnen die accolades. We zullen een voorbeeld van te zien argumenten in slechts een seconde. Overwegende dat op de volgende regel, zien we, oh, hier is een variabele genaamd "myFunction," en we gelijk aan deze generieke thing-- function-- dat lijkt niet iets gaande is. De reden is dat anders dan C is dat JavaScript is wat heet een functionele taal, of heeft functionele elementen, waardoor dat functioneert eigenlijk waarden. En dat betekent dat we kunnen stellen een variabele een functie gelijk en verplaats die functie rond, doorgeven als een argument, doen allerlei dingen als dat met functies. Een ander ding om note-- functies geschreven met een aantal argumenten. We zullen een voorbeeld van een functie te zien met een argument op de volgende dia. Maar JavaScript zal niet schreeuwen tegen je als je probeert een functie met het gebruik verkeerde aantal argumenten. Het zal gewoon zijn best doen om te doen, wat betekent dat als je langs, een functie die een verwacht noemen ruzie met geen argument, dat alles zal gebeuren is het zal haar best doen om te proberen en uit te voeren die code, en als uiteindelijk draait in een uitzondering of een fout, het zal gooien deze uitzondering en gewoon blijven going-- dat is slechts een van de manieren dat JavaScript werkt. Ja. Publiek: Wat gebeurt er als er is te veel argumenten? SAM GROEN: Dus de vraag was, wat er gebeurt als er te veel argumenten? En het antwoord is dat JavaScript zal net negeren de degenen die na de degenen verwacht. Het zal proberen om de functie uit te voeren noemen alsof het was gewoon de eerste twee. Rechts? HUGH ZABRISKIE: Dat klopt, ja. Ook als er zijn te weinig argumenten, is gewoon een soort van nul geeft aan alle argumenten het geen waarden voor. SAM GROEN: dat kan eigenlijk handig, als je een functie wilt schrijven dat neemt een variabel aantal argumenten. U kunt de standaardwaarden in de definitie van de functie, en het kan voorbijgaan aan het feit dat de input is er niet. Dus ik wil een beetje praten Meer over dit laatste kogel punt, dat is functies zijn waarden. Dit is een voorbeeld dat is een beetje mind-blowing als je net gelezen, en denk niet over wat er aan de hand voor een tweede. Dus, laten we eens kijken alleen op de eerste regel hier. We hebben deze variabele, f1, dat we zeggen: is een functie die dit ding doet. En de inhoud van de functie zijn console.log ('hallo'). U kunt denken aan console.log als JavaScript equivalent van printf. Dus wat er zal gebeuren is, als we lopen deze code in onze browser, zal het afdrukken van een string. Ik kan aantonen dat. Doelgroep: Door log, hoewel, dat doet bedoel het wordt ergens geregistreerd? SAM GROEN: Ja. Dus ik zal je laten zien wat er gaat gebeuren. Dus de vraag is, wat betekent logboek betekenen? HUGH ZABRISKIE: Dus console.log is net als printf voor C. SAM GROEN: Dus console.log is als printf, dus als ik dit console.log ('hallo'), en ik noem dat de string "hello" wordt afgedrukt op de console. Dit is de console. Het is net als printf, waarbij drukt standaard uit. En we zullen zien in een minuut, maar dit is eigenlijk verwijzend naar de console object, en het aanroepen van een methode op dat object. Dat zal meer zin in een minuut als we krijgen over objecten in JavaScript, maar ik dacht dat ik zou gewoon zeggen dat. HUGH ZABRISKIE: We zijn gebruikt in C, right-- we meestal schrijven een groot programma in de belangrijkste om iets te doen. Maar wat is cool in JavaScript is dat je dit soort tolk die runs in real time, zodat duurt slechts regel voor regel, het kan gewoon uitleggen dat op de plek. En het houdt dingen die eerder hebt uitgevoerd, dus het is een vrij nuttig instrument om Gebruik console.log of de console, het algemeen, voor gewoon spelen rond met JavaScript. SAM GROEN: Dus terug te gaan naar deze example-- de tweede regel van de code hier is vrij verbijsterend in mijn hoofd. De eerste keer dat ik dit, Het was alsof, wat is er aan de hand? Dus wat er gebeurt is, deze functie verklaring zegt: Ik heb een functie genaamd f2 dat wordt verwacht één argument, f, en dan roept dat functie f, die werd doorgegeven als een argument zonder argumenten zichzelf. Dus, dat zou verwarrend zijn. Als we begrijpen dit als f2 neemt f1 als argument, en dan de binnenkant van f2, f krijgt called-- welke middelen dat deze regel code, Na deze twee lijnen van code, resulteert in "hello" wordt op de console. Het feit dat we kunnen doorgeven functies rond als waarden eindigt als een van de meest krachtige functies van JavaScript als een programmeertaal. Buiten alle vreselijke dingen kan doen, net als functie van de taal in termen van de manier dat maakt de dingen eenvoudig programmeren en maakt voor dingen die niet bijzonder goed geschikt voor het web, functioneel programmeren en functionele programmering aspecten van JavaScript is een van de meest krachtige concepten die bestaat in JavaScript-- als je het mij vraagt. Koel. Dus, volgende ding. Behalve functioneel, er zijn ook elementen van JavaScript die objectgeoriënteerde, die een van de populaire buzz woorden in de informatica. Object georiënteerd programmeren is echt een populaire ding. JavaScript heeft een versie van dat, waar ik denk dat elke waarde is ook een object, wat betekent dat elk object wraps samen een aantal aantal waarden. Dus voor waarden die eenvoudig zijn, zoals een geheel getal is, zoals varX gelijk aan 5, dat object slechts wraps dat één waarde. Maar we kunnen ook denken aan een situatie where-- we kunnen bedenken situaties C waar we wilden doen iets met structuren, bijvoorbeeld dat verscheidene wraps waarden elkaar en merken het heel gemakkelijk om dingen te passeren. Dat is wanneer een object in JavaScript. Het is belangrijk om te onthouden als ik zeg dat objecten verpakt sommige aantal waarden samen, dat functioneert ook waarden, waardoor functies ook de binnenkant van een JavaScript-object. En de reden dat is belangrijk is dat, terwijl we vaak denk aan het aanroepen van een methode op een object dat van een populaire term uit andere populaire objectgeoriënteerde talen, Een van de verschillen is dat alles werkwijze is in JavaScript wordt een waarde opgeslagen in een object dat voert enkele Action-- mogelijk met behulp van de andere waarden die binnen zijn van dat object, maar niet noodzakelijkerwijs. Dus je kunt je voorstellen een situatie, ik denk in een beetje een gekke manier, waar u een methode om een ​​zogenaamde object op een ander voorwerp, bijvoorbeeld. Dus, het is een beetje funky op die manier. En u kunt ook de methoden te wijzigen die zijn geassocieerd met een object door aan die methode een nieuwe functie, die ook vrij verschillend van andere objectgeoriënteerde talen, waarbij zodra we verklaren een object en instantiëren het, we kunnen niet de methoden die zijn gewijzigd geassocieerd met dat object meer. Dus dat is behoorlijk anders. Koel. Dus hier is een voorbeeld, de eerste, een object in actie. Dit is wat heet een algemeen object, die betekent dat het geen heeft bepaalde naam, niet een klasse, het is slechts enkele verpakking van waarden. En zoals dat eruit ziet is, we Deze buitenste paar accolades hier die aangeven JavaScript en zeggen: dit is een object. De waarden erin zijn elk waarden binnen van het object dat moet samen worden verpakt. En de binnenkant van dat object, we dan hebben belangrijke waarde paren, waarbij de sleutel verwijst naar de naam waarde van de binnenkant van het voorwerp, en de andere side-- tegenover de dikke darm hier-- de werkelijke waarde die moeten worden opgeslagen. Zo zie je hier dat we een key genoemd fn met waarde sam, gevolgd door een komma, zegt op het volgende item. Dan is een sleutel genaamd ln, met een waarde van groene, gevolgd door een komma, gevolgd door "print" die gaat naar een functie waarde dat gaat deze regel code te doen. Laten we een stap terug en uitpakken wat er hier aan de hand. Dus dit is een beetje ingewikkeld, en we zien iets nieuws Voor de eerste keer. De "dit" keyword is het nieuwe ding we hier zien, en wat dit doet is, verwijst naar de huidige object in omvang, toch? Dus als we zeggen, dit wijst helemaal terug deze hele object-- als we dat doen this.fn, we gaan helemaal terug te gaan Om dit voorwerp, ga dan naar de fn-waarde en krijg sam, trek het helemaal terug, blijf hier, en ga dan verder. Publiek: Dus met het ophalen, is dat gedaan door de parameter definitie? SAM GROEN: Dus de vraag is, is de retrieval gedaan door de parameter definitie? Ja, absoluut. Wat gaat er hier is gebeurd, Dit punt zegt tegen de JavaScript, Oké, ik krijg een bepaalde waarde van dit object uit mezelf. En dan zal het op zoek naar een vermelding riep fn, en als het vindt, het zal terugkeren dat value-- zo, het is sam. Maar ik zou ook hebt getypt iets dat niet hier is gedefinieerd, en dan zou het net terug undefined-- die is een ding dat JavaScript kan te doen, die de voordelen kan hebben, maar het is also-- als je een typefout maakt, kan leiden tot rare fouten. Dus het zal gewoon proberen te vinden wat je ook vertellen te vinden en het is niet van plan om klagen als niet vinden. Het zal alleen maar zeggen, ik heb niet vinden, en ga dan verder. Dus het zou worden ongedefinieerd, plus leeg, plus achternaam. Ja. En dan kunnen we zien dat als we kan dan naar beneden en access-- en we tf.print () met haakjes noemen. Het gaat om die druk te bellen functie zonder argumenten, toch? Maar als we zeiden gewoon tf.print () puntkomma zonder haakjes, dat alles zou hebben gedaan is trekken de functie van de waarde, maar niet eigenlijk heet het. Koel. HUGH ZABRISKIE: Indien we een object te maken? SAM GREEN: Tuurlijk, laten we dat doen. Dus ik kan deze verplaatsen Bijvoorbeeld de console. We kunnen ons voorstellen dat ik een object. Dit is dus een eenvoudig object. Dit is een object dat beide bevat waarden met twee sleutels, twee belangrijke waarde pairs. Dus ik kan dan toegang tot de opgeslagen waarde binnenkant van dit object door het doen van x.x1, bijvoorbeeld, en ik krijg 1 terug. Ook x.x2, krijgen die waarde terug. En nu het echt cool ding is, kan ik daadwerkelijk iets toevoegen aan dit object nadat ik heb geschapen. Dus je kunt je voorstellen, laten we zeggen dat ik een functie hebben. HUGH ZABRISKIE: U hoeft te doen Shift-Enter. SAM GREEN: Oh, dat is vervelend. Wat heeft het niet leuk? Oh. Daar gaan we. Koel. Dus ik heb zojuist Deze functie f dat gaat naar het huidige object en afdrukken this.x1. Dus als ik gewoon f bellen via zelf, niets gaat gebeuren, rechts, want er is geen x1 veld in het object dat het verwijst. Maar, als ik zeg, x.f = f, en dan heb ik noemen x.f (), ga ik terug 1 te krijgen. Dat f-functie is nu bij het object x, die een belangrijke genaamd X1 in verband met de waarde 1, dus toen we this.x1 noemen, het is gaan om te vinden wat hij zoekt en in staat om een ​​waarde af te drukken. Dus dat is slechts één voorbeeld van de soort gekke dingen je kunt doen met objecten in JavaScript. Zodat versie was generieke versie, betekenis dat we een object met behulp van deze hebt gemaakt haakjes notation-- brace notatie, rather-- en dat is handig als we willen gewoon één instantie van een bepaald object, maar wat als we willen meer dan één hebben van dezelfde aard? En het antwoord op die vraag is, zijn er dingen riep klassen in JavaScript ook. We kunnen een functie te creëren die doet een soort van initialisatie voor een vreemd voorwerp, en we zouden zeggen, als, mijn class-- dus de naam van de herbruikbare object-- is gelijk aan de functie die hij stelt. Dus wat dit zou gelijkwaardig zijn om is het creëren van een object dat zou net als, accolade, str, colon, Dit is een string, puntkomma, accolade. Dat zou de generieke zijn object we initialiseren met het enige verschil dat op de volgende lijnen creëren we een prototype, dat betekent dat het een standaard sleutel die we toevoegen aan onze object dat heeft de hier vermelde waarde. Wat betekent dat wanneer ik een nieuwe exemplaar van deze MyClass object, het gaat om pre-built binnenkant van het een waarde genoemd str en andere waarde genaamd myPrint, dat is zal een functie zijn. Geweldig. Grote. Dus het laatste wat aan zeggen over JavaScript is dat het echt nuttig voor wat asynchrone bewerkingen worden genoemd. Asynchrone betekent is dat we kan wachten voor sommige operatie om te voltooien voordat we verhuizen op, maar verder gaan terwijl we wachten en hebben dan is er iets gebeuren later. En wat ik bedoel is, je kan een situatie waarin stel u een verzoek te sturen sommige webserver ergens, en het gaat om je terug te sturen enkele grote brok van gegevens, toch? En uw gebruiker kan wachten in de Ondertussen om dat te laten gebeuren, en niets zou kunnen zijn er op dat moment. Maar dat is niet een geweldig design, toch? Je wilt niet dat de webpagina te bevriezen. Wat als de gebruiker wil Klik op een drop-down menu? Het is niet een geweldig design patroon. In plaats daarvan, eigenlijk wat JavaScript doet is zegt: Oké, doe deze bewerking asynchroon. Dus als, wachten in de achtergrond, en dan wanneer de operatie wordt gedaan, bel de callback function-- noemen een functie, sommige Action-- om aan te geven dat de operatie waren we wachten tot het einde is voorbij. En de reden dat is super krachtig is, kunnen we iets doen, passeren een argument, iets te doen, en dan wachten tot er iets gebeurt. Dan, als er iets voltooit, kunnen we een callback noemen. Dat is erg handig, omdat het laat ons dingen met Web Audio API te doen, bijvoorbeeld, zoals een belasting audio-bestand van een externe server zonder te hoeven wachten op de volledige audio-bestand moet worden geladen, die echt zou zijn slecht voor de gebruikerservaring. Koel. Laatste paar notities over debugging, aangezien is een ding dat je gaat moeten doen als onderdeel van uw project gegarandeerd. Ik noemde de JavaScript-console. Het is een super handige functie van alle moderne browsers, En we raden u aan te komen comfortabel gebruik van uw console, als je wilt goed te krijgen op JavaScript. Het is super handig voor debuggen, maar het is ook erg handig voor het uitzoeken hoe een API gebruiken. Het maakt werkelijk makkelijk experimenteren zonder enige vorm code, en het compileren daarna. Je hoeft niet al die stappen te doen. Je kunt gewoon schrijven enkele code in een lijn, en dan heb je meteen feedback over ongeacht of die regel code worked-- erg handig. En ook, maar een technische note-- de JavaScript-console is een voorbeeld van een REPL-- dus dat is R-E-P-L, VERVANGEN, wat staat voor lezen, te evalueren, afdrukken lus. Je gaat om wat spullen te typen in, het zal lezen wat u hebt getypt in, het zal evalueren en zal het afdrukken van de output, en dan zal het opnieuw beginnen. Die u toelaat om snel te gaan in cirkels iteratie, dat is echt cool. Ik denk dat dit echt de laatste note-- is de eigenlijke laatste noot, ja. Hoe gebruiken we eigenlijk JavaScript? Dus eerst, kunnen wij importeren met behulp van een script-tag aan de bovenkant of onderkant van een HTML file-- ergens in een HTML-bestand, echt. En binnen een script-tag, zijn er twee sub-manieren importeren JavaScript. De eerste is door een afzonderlijk JavaScript-bestand dat wij importeren in zijn geheel, of door het hebben van een gebied van code, zoals script om te beginnen, en dan backslash script te eindigen. En dan schrijven we gewoon JavaScript in het HTML-bestand. Dat zijn de twee manieren. Je kunt het niet hebben binnenkant van HTML. PUBLIEK: Is een beter dan de andere? SAM GROEN: De vraag was, één beter dan de andere. Dus ja, als een stijl van coderen praktijk en ook is het als een ontwerppraktijk. Er zijn twee redenen waarom het beter zou kunnen zijn. De eerste is, het maakt de code een veel beter leesbaar als al uw HTML- is op een plaats, al uw CSS is in een andere plaats, al uw JavaScript is in een derde plaats. Rechts? Ik denk dat we nu al moeten hebben gesproken over het in sections-- als CSS-- wat dat is-- en het gaat vaak in een ander bestand. Dus, soortgelijke concept here. U kunt ook voorstellen dat JavaScript worden hergebruikt meerdere HTML-pagina, of misschien een groot aantal HTML-pagina's, en met dat JavaScript herwerkt tot één bestand dat u kunt importeren in meer dan één plaats kan de code worden veel meer onderhoudbaar. Je kunt je voorstellen making wijzigen om de JavaScript- en hoeven veranderen in 100 verschillende bestanden. En in plaats daarvan kunnen we gewoon veranderen één, die veel krachtiger. Heb ik antwoord op uw vraag? Koel. We kunnen ook typen in de console, zoals we eerder hebben gezegd. En nogmaals, een laatste note-- Web Audio wordt ingebouwd, je niet nodig om iets te laden. Koel. Zijn er vragen, heb je meer vragen over JavaScript, voordat we verder gaan? PUBLIEK: [onverstaanbaar] SAM GROEN: Oké, cool. Dus nu gaat hij praten over de API. HUGH ZABRISKIE: Cool. Thanks, Sam. SAM GROEN: Zeker. HUGH ZABRISKIE: Awesome, dus zullen we op uit JavaScript bewegen. Dus we hebben gesproken over een aantal van de essentie van JavaScript, en dat zijn de variabelen functies objecten, functies als variabelen, asynchrone laden. Dit zijn allemaal dingen die je zult te zien als je het Web Audio gebruiken. Dus we gaan gewoon praten erover eerst op een hoog niveau. Het is een API, dus het is iets dat is gebouwd, zoals Sam zei, recht in de JavaScript- die u gebruikt in de console. En het is eigenlijk net als C ++ code dat is echt ingebouwd in Chrome en Firefox, en elk van deze browsers. Dus de belangrijkste idee met Web Audio is dat je dit soort pijplijn van audio, toch? Zodat uw audio data komt in een bepaalde vorm. Er zijn een soort van drie belangrijke forms-- je hebt de oscillator, die creëert een sinus, cosinus golf, we gaan om te zien hoe dat werkt. Een andere veel voorkomende één, Uiteraard is een MP3. Dus misschien je begint met een nummer, en dan moet je willen wat filtering doen dat en output dat-- dat zou een mogelijke bron. En vervolgens een echt cool een is de microfoon. Dus je kunt een aantal zeer gebruiken basic oproepen in JavaScript om de toegang tot het krijgen microfoon, en dus als je wilde een app te maken als een pitch detector, bijvoorbeeld dat neemt in uw stem en cijfers uit de pitch-- zeer eenvoudige manier om dat. Je kunt gewoon een soort van lezen in, achterhalen van de frequentie, en dan de uitgang van een nummer. Dus we zullen zien hoe dat werkt, als goed. De bestemming is eigenlijk waarbij de audiogegevens uitgevoerd. Dus over het algemeen, dat is net als uw laptop luidsprekers. Andere opties zijn als een ScriptProcessorNode-- we knooppunten in een krijgt second-- maar in principe, ofwel je het aantrekken van geluid via je computer via de luidsprekers, of je bent soort van opname, dus je deze opslaan als audio-data. Dus misschien als iemand creëert muziek in je app en vervolgens u wilt dat opnemen en misschien als exporteren naar SoundCloud, voor example-- dat een manier om dat te doen zijn. Alle leuke dingen, die we praten over, er tussen deze twee punten, waarbij we laden muziek en dan de uitgang is. Dus ik ga om te praten over de vijf stadia audio productie in een tweede. Wij hebben dit ding heet een AudioContext, die is dit kleine wrapper we hier zien. Eigenlijk wat AudioContext is-- als we ga naar de JavaScript-console op dit moment, we kan men nu te maken. Slechts een voorbeeld van VERVANGEN, toch? We lezen, evalueren, en het drukt. AudioContext is een globale staat. Het is een structuur, het is een object hier, en het houdt informatie over dingen die aan de gang op het scherm met audio. Een voorbeeld is de huidige tijd. Dit vertelt u het nummer seconden, zeer nauwkeurig, aangezien de webpagina geladen. Dus dit is een echt nuttig kleine woning die u kunt gebruiken. Het lezen only-- Ik denk eigenlijk kunt u proberen om het op een waarde. Het zal u vertellen in te stellen, en dan als je het af te drukken again-- het niet eigenlijk heel werk. Dus er zijn alleen-lezen woningen in JavaScript. Dit is echt handig als je bent soort synchroniseren veel verschillende informatie, als je soort van het spelen van verschillende geluiden. Een ander echt nuttig één is de context bestemming. Zeker, als je geïnteresseerd bent, zijn proberen dit op uw eigen console rechts nu. Dus dit is een AudioDestinationNode. Eigenlijk wat dit zegt is, wanneer wordt de output gaat? Dus zijn er twee reële opties hier. Vaak standaard is gewoon uw luidsprekers, dus AudioDestinationNode eigenlijk gewoon zegt er nul uitgangen het geluid binnenkomt, naar de spreker. Dus over het algemeen, je niet hebben om te spelen met die. Als u geïnteresseerd bent in het daadwerkelijk gebruik van bent de ScriptProcessorNode voor het opnemen, me een zeker schieten e-mail later, want dat is een beetje ingewikkelder. Maar over het algemeen, je bent gewoon een soort van geluid weergeven in een bepaalde vorm. Zo cool, we zullen hier terug te springen. Publiek: Het spijt me. HUGH ZABRISKIE: Ja. Publiek: Ik weet dat je zei te praten om u later over het opnemen. Kun je dat interface met Pro Tools? HUGH ZABRISKIE: Met Pro Tools? Laten we eens kijken. Ik denk het niet. Dus gaan tussen de opdrachtgever, dat is de JavaScript- console, en uw werkelijke computer, meestal iets dat is een soort van off limits, als je zal, natura door de aard van the-- het is een soort van een ontwerp zaak, maar je probeert om de browser gescheiden te houden van de werkelijke computer van de gebruiker. In het algemeen, het enige wat je in staat bent om de toegang is de microfoon of de camera. Je bent niet in staat om, I denk niet, gebruik Pro Tools. Echter, als u hebt gemaakt een track in Pro Tools, geëxporteerd dat je zou kunnen laden dat hier, filteren, bijvoorbeeld, proces en nemen dat in een Audio Destination-- of, no-- een Sphere Processor Node. En dan vanaf daar, je kon exporteren die op SoundCloud, u zou het in een e-mail te sturen, of wat je wilt vanaf daar. Maar er is een soort van een lichte barrière tussen het maken van muziek op je computer en het maken van muziek online. SAM GROEN: En dat is niet uniek voor deze API. Het is een beveiligingsfunctie van Chrome, en Ik denk dat elke andere moderne browser. De browser is self-contained. Dus bijvoorbeeld, een webpagina niet kan JavaScript gebruiken om het geluid uit op op de luidsprekers, bijvoorbeeld. Of het kan uw computer niet uitschakelen. En er is geen tussenpunt tussen die twee dingen, rechts, dus ofwel heb je een volledige abstractie, of je het openen veiligheidslek te laten een programmeur met slechte bedoelingen doen wat ze willen met uw laptop. En dat is waarom Chrome is self-contained. HUGH ZABRISKIE: Ja. Slaat dat ergens op? Cool cool. Ik was net van plan om tonen een voorbeeld van één. Dit is vrij veel als Wat je krijgt, in termen van toegang tot de computer van de gebruiker. Als u een USB-toetsenbord is aangesloten, kunt u iets gebruiken zogenaamde Web MIDI-API, die we zullen niet echt praten over hier, maar dit is een API die opnieuw ingebouwd in tenminste Chrome--, Dit is de reden waarom we houden Chrome-- Ik denk dat Firefox of Safari, Dit is een eenvoudig ding om te google-- verschillende browsers verschillende ondersteunende waarvoor API's die zij hebben uitgevoerd. Maar als je wilde om aan te sluiten in een toetsenbord en werken met die informatie, soort sturen het toetsenbord gegevens naar de computer en dan dat online, deze API is waar je zou werken dat. Koel. OK. Zo snel bewegen op hier. Hoe doen we het op tijd? SPEAKER 1: Ongeveer 15. HUGH ZABRISKIE: 15 minuten over? OK, cool. Dus we vooruit hier te racen. Dus eigenlijk, het belangrijkste punt van denk aan dit als een pijpleiding dat elke stap in de pijplijn is een reeks audionodes. Onze bron, laten we zeggen, is een oscillator. We moeten een oscillator knooppunt te maken. En dat is gewoon een soort van de kleine function-- en ze zijn allemaal gebaseerd uit van de audio context here. Publiek: Als het zei oscillator, betekent dat het is eigenlijk letterlijk gaan van twee polen heen en weer? HUGH ZABRISKIE: Nee, het is net als een digitale weergave. Het eigenlijk in C ++ uitgevoerd. Ik heb eigenlijk niet weet wat de specs hoe het daadwerkelijk is uitgevoerd, maar dit wel werkt als binaire data. Eigenlijk, ja. Dat zou zeggen, ik kon eigenlijk, als je geïnteresseerd bent, Ik kon een beetje meer om u informatie over golfvormen worden gehouden met een digitaal formaat. OK, cool. Dus we het genereren van een toon als een sinus golf of iets dergelijks, misschien 440 Hertz. Wij creëren een oscillator. Willen we het volume, we sluit alles om een ​​GainNode, die we kunnen doen met .creategain. Dat stelt het volume. U kunt doorgeven dat op elk van de andere options-- goed, dus een audio buffer bron knooppunt is waar je misschien slaan een MP3 die u hebt geladen. Biquad filter is voor het filteren als u alle de basis nemen van een lied, of iets dergelijks. God verhoede u wilt nemen de basis van een lied. En AudioDestination knooppunt, weer, zoals waar onze voltooiing is. Als je ooit geïnteresseerd in het zien alle verschillende mogelijke opties ga naar het tabblad en laat de auto-complete komen. En als je het maakt, zie je alle verschillende dingen die u kunt maken. Je kunt dynamisch maken script processors, Ik weet niet eens wat dat is, voor het mengen kanaal fusies en het kanaal splitters en dat alles. Koel. Dus dit is slechts een voorbeeld van een pijpleiding. Hebben we dus drie bronnen komen. Misschien zijn golfvormen, misschien deze zijn MP3's. Men gaat door middel van een filter, een iemands krijgen vervormd andere iemands panning links en rechts. Je kunt allerlei dingen te doen en ze krijgen allemaal gemengd samen rond, en vervolgens komt de audio- eind, als de bestemming. Dit is een voorbeeld van wat meer ingewikkeld Web Audio code eruit ziet. Je bent het creëren van al deze verschillende objecten recht hier-- Ik ben niet zeker van. Nee, is het niet in te zoomen. OK. SAM GROEN: Je doet Control, Scroll-Up. HUGH ZABRISKIE: Controle Scroll-- SAM GREEN: Nee, nee. Controle-- HUGH ZABRISKIE: Oh, Control, Scroll? Oh, gotcha. Ja. Wow, nope, nope. OK. Ik zal dat niet doen. Dus ja, in deze eerste sectie hier, zie je we zijn het creëren van al deze verschillende knooppunten uit de context. We zijn ze gewoon patchwork samen in het tweede deel door deze functie genaamd Connect. Dat is echt een sleutel functie in Web Audio. Het betekent gewoon dat als je eenmaal hebt gedaan iets met het geluid in één knooppunt, doorgeven aan de volgende knooppunt. Dus hebben we de bron, is het verbindt met de analysator, de analysator doet iets met het, Het gaat om vervorming, enzovoort, en de bestemming rechtsonder hier. Koel. OK, dus we zullen blijven bewegen op. De pipeline-- opnieuw, deze zijn de meest voorkomende pijpleidingen, dus we praten over al deze dingen zoals vervorming, panning, al deze spullen. Als je echt geïnteresseerd in het gebruik van de dingen Pro Tools, die u waarschijnlijk interesseren. Zo niet, misschien heb je net willen het geluid af te spelen, of misschien wil je gewoon het volume van het geluid. Dat zijn de twee meest voorkomende soort pijpleidingen in audio productie. Nogmaals, de manieren waarop u kunt nemen in als een oscillator-- dus, laten we doen de demo van dat recht hier. Dus we gaan naar een te creëren eenvoudige audio context hier, en vanuit dat we gaan onze oscillator creëren. Dus dat is, nogmaals, we zijn gewoon gaan roepen Maak Oscillator. We gaan naar een frequentie in te stellen op dat, 440 Hertz, ieders favoriete. Toen we die verbinding naar de bestemming point-- dat de luidspreker, zodat de context bestemming. Tot slot, we gewoon zeggen, begin nul seconden vanaf nu, en we hebben klinken? [BELLENDE] HUGH ZABRISKIE: Hier gaan we. Het is gewoon een sinus. OK, cool. En dan zullen we stoppen met dat. Publiek: Waar deed die feedback vandaan? HUGH ZABRISKIE: De feedback? Oh, waarschijnlijk onze microfoons. Dus ja, dat is hoe je het doet. En eigenlijk, als ik had hield het rennen, je kan de frequentie waarde als het draait, dus dat is een leuk ding om mee te spelen. Koel. Dat is altijd een mooie één te presenteren. SAM GREEN: We hebben niet over nadenken, hebben we? HUGH ZABRISKIE: Ja, dat is een nare één. Dus, buffer loading-- ik zal een toon voorbeeld dat aan het eind. Dat is het laden van een MP3. En microfoon, maar een functie te gebruiken u genoemd Navigator.getUserMedia () de toegang tot de gebruiker verzoeken microfoon voor die informatie. Hier is het filteren, zal ik gewoon blijven verplaatsen van dit. Dit is vrij hoog niveau, maar filters je gewoon laten [Pieptoon] Filtering kunt u ook om dingen zoals roze te creëren lawaai, bruine ruis, witte ruis. Als u wilt pure geluid, te creëren die sommige mensen houden om te prutsen met, kunt u Web Audio gebruiken filtering te doen. Audio Panning-- dus voorstellen als je het schrijven van een spel en u wilt dat het geluid klinkt als het komt, zoals, schieten over het scherm, u kan de panning van het geluid te gebruiken dit soort kegel creëren die like-- het is vrij mathy, maar het is eigenlijk echt cool als je het werk, en er is een aantal goede tutorials over het kan ik u sturen. In principe kunt u soort creëren van het geluid van iets aan de hand van een 3D manier. En als je een DJ rente, kunt u start mixen en cross vervagen liedjes. Dit is slechts enkele zeer fundamentele code, eigenlijk wat ik deed voorheen. Dit stelt het volume van de oscillator, dus maken we onze oscillator die ontstaat de golfvorm. We creëren onze GainNode, uiteengezette frequentie, en sluit vervolgens de oscillator op de GainNode, die dan verandert fundamenteel hoeveel signaal wordt doorgelaten. Maar echt, het is een digitale ding, dus het is meer gewoon-- ja. Dat is niet wat er werkelijk gebeurt, maar dat is wat er gebeurt in het echte leven met een winst. PUBLIEK: --quantization van de parameter volume? HUGH ZABRISKIE: Sorry? Publiek: Is het een gekwantiseerde parameter volume? HUGH ZABRISKIE: Ja. En dit is een ding dat ik ben echt tekort in mijn kennis, hoe de winst werkt op een digitaal niveau. Ik weet dat met de werkelijke signalen, het is eigenlijk het controleren hoeveel je bent het versterken van het signaal. Dus ja. Ik stuur je meer informatie over dat, omdat ik eigenlijk nieuwsgierig zou zijn om meer over dat weten. Maar in principe de parameters zijn, een is de fold-- hoe luider signal-- en nul is geen signaal, of je zult geen geluid horen. We zullen demo tijd overslaan omdat het is eigenlijk wat ik deed voorheen. En nogmaals, het Context.Destination is de audio bestemmingsknooppunt. Geweldige, OK. Dus ik ga een snelle twee demo's te doen. Hoe doen we het op tijd? SPEAKER 1: Ongeveer 10 minuten. HUGH ZABRISKIE: 10 minuten? Geweldig! Geweldig. Dus de eerste die ik ga do, het heet My Favorite Song. Dus dit is gewoon een weinig HTML JavaScript. We gaan twee knoppen op de pagina speel mijn favoriete liedje en stop mijn favoriete liedje. Ik zal dit veranderen. PUBLIEK: Bedek je microfoon. HUGH ZABRISKIE: Ja. En ik heb hier geladen een script dat basically-- en dit is echt nuttig voor het laden van een MP3, dus dit gewoon maakt laden van MP3's veel sneller. Het is eigenlijk gewoon een wrapper. Het maakt het proces van laden in MP3's veel sneller, je anders met behulp van HTTP-verzoek, zoiets als wat we deden op de huidige delige set met Server. Het is echt lelijk, je willen niet om het te doen. Dus deze man, Boris MKB, schreef een echt handige kleine tool genaamd BufferLoader. Alles wat je doet is gewoon door te geven aan de context, je een list-- passeren of, ja, is het een lijst in JavaScript? SAM GROEN: Een serie. HUGH ZABRISKIE: Oh, het is een array, dat klopt. Het is een array van paden verschillende bestanden. En dan heb je het een functie passeren. Dit is de callback we praten over met asynchrone laden. Dat zal worden genoemd Zodra de bestanden geladen. En dat de functie die wordt aangeroepen wanneer het bestand geladen is als een perimeter een reeks buffers geladen. Zodat Hier treedt. Kortom, BufferList is gaat naar een value-- zijn of het gaat om een ​​serie van te zijn een lengte, die in index heeft nul het volledige geladen bestand van de MP3. Dus wat ik doe als ik klaar laden is, ik gewoon maak een buffer bron, die is een audio-buffer bron node. De volgende stap I verontreinigen in de source.buffer als de volle geladen buffer van de BufferList-- het is een stuk van buffers-- en dan moet je die audio aansluiten buffer naar de bestemming. Dus wat het gaat doen is gewoon zet de MP3- rechtstreeks naar de uitgang, en onmiddellijk starten na het krijgen van deze oproep. Koele, dus laten we eens kijken Dit gebeurt in actie. Mijn [onhoorbaar] hier, laten we eens kijken. Dus ik ga gewoon start een eenvoudige server. Dat is iets dat u moet doen als u bent het maken van aanvragen voor het laden van bestanden. Ik ga een eenvoudige server te starten. Dit is eigenlijk je hele PSET nu in één lijn, maar het is net begonnen een server op poort 80/80. Dus we gaan hier, we gaan laden 80/80, we gaan naar My Favorite Song. Dus als ik hit "Speel mijn favoriete liedje "nu, het gaat om te laden mijn favoriete liedje en speel het-- [MUZIEK - THE EAGLES, "leven in de snelle  RIJBAAN"] --die toevallig "Leven in de Fast Lane "door The Eagles. Nu, kon ik raakte "Stop mijn favoriete liedje "en replay het. [MUZIEK - THE EAGLES, "leven in de snelle  RIJBAAN"] En als ik ga over naar de console, omdat Ik gebruikte een globale variabele hier om spoor eigenlijk houden van deze waarde, is het zal nu worden opgenomen in de console. Dus het auto-creëert voor mij. Dus dat is wat er nu speelt, en ik kan gewoon bellen source.stop () op dat. Nou, weet je wat? Net zo jullie hebben gehoord lied belden-- u misschien dit nummer herkent. [MUZIEK - Rick Astley, "Never Gonna GEEF  YOU UP "] [MUZIEK - THE EAGLES, "leven in de snelle  RIJBAAN"] We hebben nu allemaal rickrolled. OK, grote, bewegen op. Koel. Dus dit is eigenlijk een voorbeeld van hoe kon je een MP3 laden file-- [MUZIEK - THE EAGLES, "leven in de snelle  RIJBAAN"] --en spelen en stoppen en starten. Ik kon nog veel meer hebben gedaan [onverstaanbaar] De laatste die ik zal doen is, Ik zal je een [onverstaanbaar]. [Muziek] Het is net als, ogg.wave.mp3. Ik denk dat, als ik me goed herinner, Ik heb lopen in een aantal problemen met .m4a, maar ik ben niet zeker over dat. Ik denk mp3.wave-- [MUZIEK - Rick Astley, "Never Gonna GEEF  YOU UP "] OK, geweldig. Ik zou niet hebben gezegd dat. Hoe dan ook, hallo. Dus we hebben deze open. Dus nu alles wat ik doe is dat ik eigenlijk gemaakt een basis syntax voor het maken van muziek. Dus als ik iets doen, zoals, voeg g4 1 op 2, wat dat betekent is dat, voeg de piano nota, G4, die de vierde G op de piano van onderen. Dus dit is een soort van MIDI spreken, dus voor degenen die muziek gebaseerd, dit is gewoon MIDI noten. Publiek: Dat is de G van het Midden-C, toch? HUGH ZABRISKIE: Dit is de G boven de centrale C, dat is juist. PUBLIEK: Boven Midden-C. HUGH ZABRISKIE: Ja. Eigenlijk ja. Ik denk dat ik eigenlijk gemaakt het één [onhoorbaar] dus dit kan een octaaf hoger dan dat. Dus laten we zien. Als ik raakte Play-- [HERHAALDELIJKE PIANO NOTE] --we're gaan om dat te horen. Het idee is dat het werkt net als een command line zou, dus als ik op en neer gaan op mijn toetsenbord, u kunnen teruggaan naar vorige commando, dat is erg handig. En hieronder is mijn lijst van tracks, die allemaal worden uitgevoerd op lus. Publiek: Je was de veronderstelling dat de 88-key toetsenbord op dat, toch? HUGH ZABRISKIE: De vraag was, ga ik ervan uit een 88-key toetsenbord, en ja, ik ben. Wat ik heb is dat ik eigenlijk nam 88 monsters van de piano, een voor elke noot. En dus elke keer dat u vanaf nu te horen van een notitie, dat eigenlijk een lus die lijkt like-- dit wordt steeds gespeeld op loop, dus voor elke noot, dit wordt uitgevoerd. Wat er gebeurt is, ik maak een buffer weer, Ik maak een winst knooppunt om het volume in te stellen. Dit gewoon een heel ingewikkelde manier om te zeggen I Bewaar de buffer in een source.buffer. Ik geef het de winst, I sluit deze aan op de winst, de versterking is verbonden met de output, en dan speel ik het. Dus dat is een soort van het proces van het nemen van in een buffer bron. PUBLIEK: Kunt u daadwerkelijk dat droge geluid en maken het natte [onverstaanbaar]? HUGH ZABRISKIE: U kunt, ja. Er is re-werkwoord, er is vertraging, vervorming. U kunt in principe iets in tussen de in die sandwich van-- goed, pijpleiding een betere metafoor, maar u kunt iets in die voegen. Koel. Dus zal ik de demo te beëindigen hier om je een gevoel te geven van alleen het grote aantal keren dat u die functie tegelijk uitgevoerd. Dus ik ga dit te verwijderen. Ik ga een generator te creëren dat-- eigenlijk wat does-- dit is echt soort van een gecompliceerde syntax-- maar het is gaat om notities te genereren op de vlieg, en gewoon beginnen te spelen ze als evalueert ze. [Onderbreekt hem PIANO] Dus we kunnen gewoon hier een beetje muziek. [Onderbreekt hem PIANO] Dus wat dit commando doet bijvoorbeeld is het duurt die drie nota's voor de piano en zet ze vervolgens op B3. Deze syntaxis zou kunnen maken een beetje meer zin voor degenen die een muziek achtergrond hier. Ik kan een kick drum toe te voegen. Ik kan-- [Onderbreekt hem INSTRUMENTS] --just spelen met die. Dus je kunt make-- [Onderbreekt hem INSTRUMENTS] Die ene is een beetje vervelend. [Onderbreekt hem INSTRUMENTS] Zodat willekeurig voegt een droge cimbaal op elke 16 noot, met een 16% [ONHOORBAAR]. [Onderbreekt hem INSTRUMENTS] Ja, dus de manier waarop dit works-- het is altijd in 4: 4. [Onderbreekt hem INSTRUMENTS] Ja, dus de vier kwartalen, en 16/8. [Onderbreekt hem INSTRUMENTS] Dus gemiddeld, krijg je 60% weergaves van de 16e noten. Anyways, dit was gewoon soort om te pronken sommige van de dingen die je zou kunnen bouwen met de Web Audio API. Het is echt krachtig, het is echt snel, en je kunt een heleboel leuke dingen te maken ermee. Dus nogmaals, alle vragen die u hebt, e myself-- Hugh-- of Sam, en eerlijk gezegd, Google heeft een ton van goede middelen. Elke laatste vragen? Ja. Publiek: Dus jij hebt toegang de ingebouwde microfoon. Wat als je wilde Gebruik een betere microfoon? HUGH ZABRISKIE: Als je wilde beter microfoon te gebruiken? Dus nogmaals, dit is onderdeel van de abstractie tussen Chrome en de rest van de computer. Tenzij het is beschikbaar via een API, zoals Web MIDI-API, kon je waarschijnlijk een aantal hacks vinden, maar over het algemeen minder haalbaar. SAM GROEN: U kunt also-- alle Chrome kent is wat je standaard microfoon is, en toegangen. Dus als je een microfoon had kon je ingesteld als standaard microfoon van de computer, je kon op die manier toegang te krijgen en het zou waarschijnlijk werken. HUGH ZABRISKIE: Dat is een goed punt. Ik heb nog nooit geprobeerd, maar je zou kunnen soort van-- als je de input spreker omleiden, je zou in staat zijn om dat te doen, ja. Elke laatste vragen? Koel. Nou bedankt jongens zo veel voor het kijken. Ik ben Hugh. SAM GROEN: Ik ben Sam. HUGH ZABRISKIE: En dit is CS50.