[Música tocando] 

Doug LLOYD: Entón, por agora estamos vellos profesionais en programación web, non? E nós Cubrimos varios linguas en vídeos individuais. E agora imos facer un máis, JavaScript. 

Primeiro a boa nova, JavaScript é unha programación moderna linguaxe moi parecida PHP cuxas sintaxe deriva desde C, de xeito que é un bo lugar para comezar. É sobre tan antiga como PHP, así como, sendo en torno a uns 20 anos. Foi inventado en torno a á vez como o PHP. E JavaScript é realmente moi fundamental para a experiencia do usuario web. En realidade, hai tres linguas que diría que tipo de compoñen o experiencia do usuario de interactuar co sitio web, html, CSS e JavaScript. E agora imos falar un pouco JavaScript. 

A mala noticia, porén, con JavaScript que define unha serie de regras para si mesmo, e despois se rompe-los. E JavaScript realmente pode ser tipo de desafío para aprender, porque é diferente de C e PHP, que son moi ben estruturada e ter regras moi ríxidas de como as cousas poden funcionar. JavaScript ten tipo de concluír tan flexible que quizais as cousas non están indo traballar a forma que esperamos que eles, e quizais nós realmente non podemos aprender nosa primeira linguaxe de programación como JavaScript. Entón, talvez porque non fixou regulamentos, e realmente non reforzar os bos hábitos de codificación. Pero agora esperamos que desenvolveron uns bos hábitos de codificación, e para que poidamos comezar a incursión en JavaScript un pouco. 

Para escribir JavaScript, semellante á apertura un ficheiro C cunha extensión dot C ou un ficheiro PHP cunha extensión dot PHP todo o que necesitamos facer é abrir un ficheiro con extensión de arquivo do punto js. Non necesitamos ter calquera especial delimitadores como fixemos en PHP. Este tipo de ángulo soporte de punto de interrogación PHP que estamos afeitos a iso, o camiño dicimos ao noso navegador que o que temos é JavaScript é a través da inclusión Lo nunha etiqueta HTML, e veremos un pouco sobre como facelo en só un momento. 

A outra cousa que fai JavaScript diferente, pero é que é executado no lado do cliente. Entón, recordamos con PHP que nunca podería realmente ver PHP que subliñou un sitio. Se algunha vez viron o fonte da páxina, só faría ver o html que era xerado polo que o PHP. Pero JavaScript execútase ao lado do cliente. Seu JavaScript execútase no seu ordenador. E é por iso que pode facer cousas como engadir bloqueadores. Non? Bloqueo de anuncios xeralmente é feito por matando todos a JavaScript que está a ser executado en un sitio web. E xa que tería que executado no seu lado do cliente máquina, pode simplemente deixar a JavaScript para realizar enteiramente. Isto tamén significa que cando usa un sitio web que inclúe JavaScript, ten que enviar a fonte de JavaScript código como parte da súa resposta http ao cliente cando soliciten. E para que non pode quero usar JavaScript para facer cousas realmente sensibles como pasar información sobre os contrasinais dos usuarios atrás e atrás, porque son, de feito, recibirá todo o código fonte, non só o html que se xera, como sería o caso, por exemplo co PHP. 

Entón, como imos incluír JavaScript na nosa html para comezar? Ben, semellante ao CSS, en realidade, é unha especie de como o facemos aquí. CSS temos etiquetas de estilo. E dentro desas etiquetas de estilo, podemos definir unha folla de estilo CSS. Así mesmo con JavaScript podemos abrir etiquetas de guión, outra etiqueta html que non fixo falar na nosa vídeo html, e escribir en JavaScript entre esas etiquetas de script. Ademais, con todo, como CSS, nos podería conectar no exterior arquivos CSS e trae-los para o noso programa desta maneira. CSS nós tamén podemos, Desculpe-me, con JavaScript nós tamén pode especificar a orixe atributo da etiqueta script para conectar en JavaScript separado, para que non ten que escribir nos entre as etiquetas de script, nós pode vincula-lo no uso que tag script tamén. E, así como co caso con CSS onde recomendamos que foi, probablemente, no seu mellor interese para escribir seu CSS nun ficheiro separado no caso necesitará cambia-lo, do mesmo xeito que recomendamos que escribe o seu JavaScript en arquivos separados e utilizar a fonte de etiquetas de script asignar a amarrar o seu JavaScript no seu html, a súa páxina web. 

Entón variables JavaScript, imos comezar a falar da sintaxe aquí. E nós imos pasar por este tipo de forma rápida, porque nós fixemos iso en PHP, polo iso debe ser moi familiar. Entón variables en JavaScript son moi semellante ao PHP variables. Non hai ningún tipo de especificador, e cando introduce unha variable, vostede prefixo coa palabra clave var. En PHP fariamos algo así, sinal de dólar x. Isto é como nós indicada unha variable, pero non, non mencionan o tipo da variable de todo. Queremos dicir algo como dólar sinal x é igual a 44 en PHP. Se estabamos facendo o mesmo en JavaScript, diriamos var x é igual a 44. Entón var é unha especie de medio do camiño da introdución dunha variable. Isto é quizais un pouco máis intuitivo que só variable cifrão. 

De novo, xa que non hai ningunha tipos de datos, poderiamos facelo con calquera tipo de datos, cordas, calquera outra cousa serían todos var. Condicionais, toda a nosa vellos amigos de C e PHP aínda están dispoñibles, polo que temos que, else if, else, rede e pregunta marca de colon. Cambiar resto tan flexible como estaba en PHP, pero todo isto é familiarizados con agora. E do mesmo xeito con loops son os antigos favoritos de tempo, facer agora, e por aínda dispoñibles para nós. Entón xa sabemos moito do tipo básico de JavaScript fundamentos só en virtude de ter un pouco de coñecemento agora sobre C e PHP. 

Que sobre as funcións en JavaScript? Ben, similar ao PHP cada función é a palabra chave introducida coa función. Vostede di función, e entón comezar a definir a súa función. ¿Que é un pouco diferente sobre JavaScript, con todo, é a posibilidade de ter o que se chama unha función anónima. Así, pode definir funcións que non ten un nome. Isto é algo que realmente non teña visto antes. Nós realmente vai utilizar o concepto dunha función anónima un pouco máis adiante neste vídeo, porque vai facer un pouco máis de sentido en contexto cando o vemos nunha situación particular que eu creei aquí. Pero imos só dar un ollo co que un simple JavaScript función pode parecer. 

Entón eu fun adiante e abri miña CS50 IDE e eu xa executado Apache para comezar a miña carreira servidor. E eu teño ese ficheiro aberto chamado home.html. E eu vou facer zoom un pouco aquí. E, basicamente, pode ver o Home.html é só unha morea de botóns. E eu digo arriba aquí que esta é a sección JavaScript materiais. Polo tanto, hai unha morea de botóns aquí, pero o que estes botóns realmente facer? 

Ben, imos dirixir a miña IED, e eu home.html abrir aquí. En principio, aquí é onde eu estou conectando en todos os meus arquivos de orixe de JavaScript. Non? Entón, eu teño anonymous.js, clock.js, Eu estou usando o atributo de orixe da etiqueta script para conectar no arquivo. Entón eu non teño escrito calquera JavaScript directamente con esta imaxe, pero eu tirado en todo o JavaScript que escribín por separado. E se rolar para abaixo aquí, este todos deben ollar un pouco familiarizado cun pouco de nova sintaxe. Temos aquí tag cabeceira para funcións e, a continuación, un botón. Eu teño unha entrada que é un tipo de botón, e ao parecer cando premer nel, Vou chamar algúns funcionar data alerta. E é así que podemos clasificar de mesturar a un pouco de JavaScript e HTML. Realmente xogar moi ben xuntos, e así, ao parecer, cando Eu premer neste botón, eu vou para chamar algunha data alerta función. E do mesmo xeito que eu teño definido comportamentos para todos os outros botóns que están nesta páxina home.html, que nós imos manter volver para durante o curso dun vídeo. Pero imos volver a subir aquí e bótalle un ollo en clock.js, que é a Arquivo JavaScript que escribiu que esta primeira función imos dar un ollo. Como verás, eu comezo a miña JavaScript funcionar coa palabra clave función, e eu dei un regalo un nome, chama-se data de alerta. Dentro alí, eu parecer crear un nova variable local chamado data actual. E eu vou asignar igual a unha nova data. E poderiamos entrar en un monte de detalle sobre o que é unha data, e realmente é tan JavaScript grande que non podemos posiblemente cubrir todo nun vídeo. Pero basta dicir, que vai para volver para min un elemento de datos que encapsulado a data e hora actual. Estou almacenando que nunha variable que eu son parecer vai alertar data actual. 

Ben, o que fai alerta ollar data actual como? Imos dar un ollo ao ficheiro en si parte traseira do da xanela do navegador. Entón, de novo, este é o botón que eu ter amarrado a esa función nomeada. E eu premer nel alí e mira o que fixo, el advertiu. Apareceu este tipo de caixa dicindo me que o tempo actual é, ao parecer, é 04 de novembro a 10:43:43 pola mañá. E se eu premer nel de novo, agora é de uns segundos máis tarde, non? Entón, iso é todo o que esta función fai. Cando eu premer neste botón, el aparece unha mensaxe de alerta para min. Entón non hai realmente máis para funcións que é distinto de PHP, só un pouco de nova sintaxe que vén co traballo con JavaScript. 

Arrays en JavaScript son moi sinxelo. Para declarar unha matriz, pode utilizar A sintaxe corchetes que estamos familiarizados coa dende PHP. E semellante ao PHP, nós Tamén pode mesturar tipos de datos. Polo tanto, este array, ambos destas matrices faría ser perfectamente lexítimo JavaScript. Un que é todos os enteiros, e que confúndese diferentes tipos de datos. 

¿Que é algo moi diferente en JavaScript, aínda? Esa é a noción dun obxecto. Por iso, é posible que teña oído falar programación orientada a obxecto. Nós non facemos unha morea de que en CS50, pero imos facer un pouco dela aquí no contexto Javascript. Agora JavaScript ten a capacidade de comportarse como unha programación orientada a obxecto idioma, pero que non é ela propia exclusivamente orientada a un obxecto linguaxe de programación. E iso vén de novo ao por iso que eu dixen, pode ser moi reto para aprender JavaScript como a súa primeira programación lingua, por que non fai realmente se encaixan nun paradigma particular. 

C, en cambio é un linguaxe de programación funcional. Se queremos, as funcións son especie do gran xefe, non? Eles ditan o que pasa o resto. Queremos cambiar variables, que chamamos funcións. Nós facemos as cousas de funcións. Obxectos vez, nunha linguaxe orientada a obxectos, obxectos tipo de chegar a ser a estrela e funcións fan a unha especie de secundario. Pero o que é un obxecto, o que é esta noción dun obxecto? Ben, se iso axuda, pense sobre el en primeiro ordenar como unha estrutura de C ou un struct que aprenden sobre antes. En C, contén unha estrutura de un número de campos, e quizais nós agora pode comezar a chamar esas propiedades campos. Pero as propiedades nunca ir por conta propia, non? Definir unha estrutura dun coche así coas dúas seguintes campos ou propiedades, unha an enteiro para o ano do coche e outra un carácter 10 cadea para o modelo do coche, Podo dicir algo como isto, Podo declarar unha nova variable Tipo de coche struct Herbie. E entón eu podo dicir algo como herbie.year é igual a 1963, e herbie.model igual Beetle. Está ben. Eu estou usando os campos na contexto da estrutura, pero eu nunca podería só dicir algo así. Non? Non pode usar o nome do campo independente da estrutura. É unha especie de unha cousa fundamental. 

Así sendo campos fundamental para estruturas C son moi similares ás propiedades sendo fundamental para obxectos JavaScript. Pero o que os fai particularmente interesante é que os obxectos poden ter o que son chamados métodos, que son realmente só unha palabra chique para funcións que son inherentes ao obxecto ben. Polo tanto, é unha función que só se pode chamado no contexto dun obxecto. Só un obxecto que teña definido esta función dentro da súa, se pensar sobre un struct, a función defínese dentro as que definen claves da estrutura. Por iso, só significa algo á estrutura. E iso é unha especie do que estamos facendo aquí con obxectos e métodos. É basicamente como estamos definindo unha función que só ten sentido nun en particular obxecto, e por iso, chamada que un método de obxecto. E nós non pode chamar iso función independente do obxecto, así como non podemos dicir ano ou modelo independente da struct en C. 

Entón programación funcional paradigmas algo coma isto. Función e, a continuación, cando pasa no obxecto como un parámetro. Nunha programación orientada a obxecto linguas, este tipo de recibe capotou, e queremos pensar Lo como este, object.function. Por iso, que tipo de punto operador de novo implicando que é algún tipo de propiedade ou atributo do propio obxecto. Pero iso é o que un obxecto linguaxe de programación orientada pode facer para facer unha función recorrer a un método, unha vez máis, que é só unha palabra especial para unha función que é inherente a un obxecto. Isto é o que que sintaxe pode parecer. E así imos comezar a ver algúns dos isto no contexto Javascript. 

Tamén pode pensar en un obxecto como unha especie de matriz asociativa, que estamos familiarizados coa dende PHP. Teña en conta que de unha matriz asociativa permite nós ter pares de valores clave, en vez de índices 0, un, dous, tres, etc., como estamos afeitos desde C matrices. As matrices de asociación pode mapear palabras, como no vídeo PHP que estaban falando sobre cubertas de pizzas. E por iso, tivemos un array chamados de pizzas, e nós tivo queixo era unha chave e $ 8,99 foi o valor, e logo pepperoni era unha clave, $ 9.99 era un valor, e así por diante. E así, tamén podemos pensar nun obxecto tipo de semellante a un asociativa array. E así esta sintaxe aquí crearía un novo obxecto chamado Herbie con dous propiedades dentro del. Ano, o que se lle atribúe o valor 1963, e modelo, que se lle atribúe a cadea Beetle. 

E teña en conta aquí que eu estou usando comiñas simples en JavaScript. Podes usar comiñas simples ou dobres cando está falando de cordas. É só convencionalmente O caso que a maioría das veces cando está escribindo JavaScript, acaba de usar comiñas simples. Pero eu podería usar as comiñas aquí, e que sería perfectamente ben tamén. 

Entón lembre-se como en PHP tivemos esa noción de un para cada loop que nos permitiría para repetir todos o valor da clave pares de un asociativa matriz, porque non teñen esa capacidade de iteración mediante 0, un, dous, tres, catro, etcétera? JavaScript ten algo moi semellante, pero non se chama un para cada loop, é chamado un no loops. Entón, se eu dixo-me que tanto, a chave var en obxecto, que é unha especie de semellante a dicir para cada algo algo. Pero todo o que eu estou facendo aquí é a iteración a través de todas as claves de meu obxecto. E dentro do crespos cintas alí, eu o faría usar obxecto de clave entre corchetes para referir- ao valor nese lugar clave. 

Alternativamente, hai aínda outra visión. Se eu simplemente só se preocupan o valores, o que podo dicir para a clave de obxecto, e só usar clave dentro. Así, para chave var en obxecto, eu teño para usar obxecto corchetes clave dentro do loop. Para a tecla de var de obxecto, podo non necesitará empregar clave dentro do loop, porque eu son só especificamente falando sobre os valores alí. 

Entón, imos quizais dea unha ollar para a diferenza só para amosar-lle rapidamente a diferenza entre catro na e para a de un moi específico matriz, que temos aquí, semana matriz. Entón eu teño que atopar unha nova matriz que Explique sete cordas, Luns, martes, mércores, Xoves, venres, sábado, domingo. E quero agora unha iteración a través desta matriz, imprimir determinadas informacións. Se eu usar un lazo no para imprimir a información, o que pensas que eu vou conseguir? Ben, imos dar un ollo. E antes de ir sobre a miña xanela do navegador, só sei que console.log é unha especie de un forma de facer un F para impresión en JavaScript. Pero cal é a consola? Ben, iso é o que imos para ir dar un ollo agora. 

OK, entón estamos de volta aquí na miña xanela do navegador, e eu estou indo para abrir as miñas ferramentas para desenvolvedores. Unha vez máis, estou só batendo F12 para abrir ferramentas para desenvolvedores. E teña en conta que aquí no arriba Eu escollín consola. Polo tanto, esta é a noción dun consola de creador, e que vai permitir imprimir información para fóra, como o tipo de terminal, pero como podes ver un pouco máis tarde, nós tamén pode introducir información en para interactuar coa web. Eu estou indo a facer zoom e un pouco aquí, e eu estou indo agora, prema a proba. E catro en test-- eu non vou amosar-lle o código para el agora, pero vai obtelo se descargar o código fonte que está asociado a este video-- é só iso no lazo que vimos só unha segundo atrás no slide. 

Entón, eu vou clic que botón, e aquí, aquí está o que foi impreso en consola, 0, un, dous, tres, catro, cinco, seis. Non imprimir a información esas localizacións dentro da matriz, porque eu usei un no loop. E dentro do corpo do lazo, I só impreso chave non clave do obxecto. Pero se eu agora limpar o meu consola, e eu para cambiar a proba, e pola proba de catro Eu digo que eu uso para malla en vez e imprimir clave, se eu premer en que, agora estou tendo o elementos reais dentro do meu obxecto ou miña matriz neste caso. Miña serie de días de semana. Eu imprimir luns Martes, mércores. Entón esa é a diferenza entre un no loop, que imprime só as chaves se só usa clave dentro do corpo do lazo, e un para de lazo, que imprime os valores se usa só clave dentro do corpo do ciclo. 

Todo ben, como é que imos agora comezar a concatenar cadeas de caracteres e quizais mesturar algunhas variables con interpolación como fomos capaces de facer en PHP? Ben, nós estamos moi familiarizados con iso dende PHP. É deste xeito que o faría usando o operador punto para concatenar cadeas. En JavaScript, aínda que, nós realmente usar algo chamado operador plus, que é quizais ata un pouco máis intuitivo, non? Estamos engadindo unha morea de cordas xuntos. Entón, imos volver e ver que esta imprimirase se estamos tentando imprimir toda a información a semana matriz. Todo ben, entón so aquí baixo concatenación de cadeas, Teño dúas opcións, construción corda V1 e V2, a continuación, edificio secuencia. E veremos porque Debe V2 nun segundo. Pero eu vou facer clic en corda edificio V1, que é o código nós só un ollo, o console.log con todo triunfos. A ver se isto supoñer a impresión o que esperamos. 

Luns é o día número 01 da semana, Martes é o día número 11 da semana. Ben, o que eu estaba tentando facer houbo obter Lo para imprimir luns é o día número un, martes é o día número dous. Pero parece que eu son sempre imprimir un. Ben, por que isto? Ben, ao parecer, ter outro ollar neste pequeno fragmento de código aquí. Teña en conta que estamos a usar a máis operador en dous contextos diferentes. 

E aquí é onde quizais as cousas que tipo de estado que dicir, Oh, é tan grande. Non xestione tipos de datos máis. Pero aquí é onde o feito que perdemos tipos de datos realmente pode ser un pouco dun problema para nós. Agora que o operador é utilizado ademais concatenar cadeas de caracteres e engadir números xuntos, JavaScript ten para facer o mellor palpite sobre o que quero que faga para min. E neste caso, el adiviñar mal. É día só concatenada, o que sería 0, un, dous, tres, catro, cinco, ou seis, e el só concatenado e, a continuación, que un concatenados. Non chegou a engadila los xuntos. E así estes idiomas, PHP e JavaScript, que abstrai esa noción de tipos, non ten que tratar con isto. Eles aínda teñen tipos baixo o capó. E podemos, en situacións así, aproveitar este feito dicindo algo como quizais esta, que Está dicindo JavaScript, por forma, tratar isto como un número enteiro, non trata-lo como unha cadea, mesmo aínda estamos mesturando cordas e enteiros aquí. 

É só unha desas cousas que parece tan grande no contexto que non ten por xestionar tipos máis, pero ás veces correr nunha situación exactamente como este, onde o feito de que non ten control sobre os tipos pode volver contra ti se non ten coidado. E así se nós pop ao IDE, eu son vai limpar a miña consola de novo, e eu estou indo a facer clic cadea edificio versión dous, que é onde eu usar esa función de análise int. Agora que está imprimindo información que eu estou esperando. Número un día de luns, terça- é o número de dous días, e así por diante. 

Entón imos falar sobre as funcións de novo. Eu prometín que ía falar anónimo funcións, e agora o contexto para que finalmente chegou. Entón, antes de facelo, imos falar de novo sobre matrices para só un segundo. Así, as matrices son unha especial caso dun obxecto. En realidade, todo en JavaScript é en realidade un obxecto. Así, as funcións son un caso especial dun obxecto, enteiros son unha especial caso dun obxecto, pero especialmente matrices ten un número de métodos. Teña en conta que, porque son obxectos, que poden ter propiedades e métodos. Teñen un certo número de métodos que pode aplicarse a estes obxectos. Hai un método chamado tamaño, array.size, que pode voltar ao vostede como podería esperar o número de elementos na súa matriz. Array.pop, tipo de como nosa noción de estalo fóra dunha pila, se recorda do noso vídeo pilas, elimina o último elemento da matriz. Array.push engade un novo elemento ao final dunha matriz. Array.shift é unha especie de como DQ, el emendas para fóra o primeiro elemento dunha matriz. 

Pero hai tamén outro especial método dun array chamado mapa. E esta é unha especie de concepto interesante. Entón, cal é a idea dun mapa? Vai realmente ver iso en varias linguas, e non estamos falando dun tipo de cartógrafos mapa aquí, estamos falando dunha función de cartografía. No contexto que estamos falando aquí, un mapa que é unha operación especial Pode realizar nun array para aplicar unha determinada función para cada elemento desta matriz. e por iso que temos que dicir en Neste caso, quizais Array.map, e dentro del, nós estamos pasando en mapa é unha función que queremos para aplicar a cada elemento individual. Entón, é unha especie de análogo a usar un loop para iterado sobre cada elemento e aplicar unha determinada funcionar para cada elemento, só JavaScript ten este construído en noción de cartografía que se poden aplicar. E este é un gran contexto para falar dunha función anónima. 

Entón, digamos que temos este array de enteiros. Chama-se N.º, e ten cinco as cousas nel, un, dous, tres, catro, cinco. Agora quero mapear algúns función desta matriz. Eu quero ter unha función de aplicar para cada elemento da matriz. Ben, imos dicir que o que quero facer é só dobrar todos os elementos. O que eu podería facer é só usar un loop para var I é igual a 0, I é inferior a ou igual a 4, eu, máis, máis, e logo dobrar cada número único. Pero eu tamén podo facer algo coma isto. Podo dicir N.º era antigamente un, dous, tres, catro, cinco, Agora, porén, me gustaría que aplicar un mapeamento sobre esta matriz onde me gustaría que para dobrar cada número. E iso é o que está pasando aquí. Pero teña en conta o que eu estou pasando como argumento para o mapa. Esta é unha función anónima. E repare que eu non lle deses esta función un nome, Só dei-lle unha lista de parámetros. E así, este é un exemplo dunha función anónima. 

Nós xeralmente non chamaría tanto función fóra do contexto do mapa. Estamos definíndoa como un parámetro para mapear, e así nós realmente non Debe ter un nome para el, o único que preocupa é o mapa e defínese dereita dentro do mapa. E polo que esta é unha función anónima. Non fomos capaces para facelo antes. Mapa algunha función que acepta un parámetro, nun, e que esa función fai é retorno Nun veces 2. E así, despois desta cartografía foi aplicada, este é agora o que N.º looks como, dous, catro, seis, oito, 10. E nós imos estalar sobre a miña xanela do navegador e só bótalle un ollo neste moi rapidamente tamén. 

Entón, eu teño un outro botón aquí na miña páxina de inicio chamada dobre. E cando eu premer dúas veces, e di- me antes de que fose un, dous, tres, catro, cinco tras dous, catro, seis, oito, 10. E se eu volver e dobre clic unha vez máis, dúas, catro, seis, oito, 10. E, despois, catro, oito, 12, 16, e, a continuación, 20. E o que eu estou facendo nesta función? Ben, se nós só pop para IDE, e Eu puxo a miña función anónima, aquí na liña de sete a 13 anos, eu son facendo un pouco de traballo elaborado aquí, pero eu só estou imprimindo o que está actualmente na matriz. A continuación, na liña 16, 17, e 18, non é o meu mapa. Aquí é onde eu estou aplicando esta duplicación función de cada elemento. E, a continuación, un pouco máis abaixo, Eu só estou facendo o mesmo Eu estaba facendo antes, só que agora eu son imprimir o contido da matriz despois. Pero todo o que eu teño feito aquí é non necesitará empregar unha función anónima para mapear a través dunha matriz enteira. 

Entón, unha gran tema para falar en JavaScript é a noción de un evento. Un evento é algo que simplemente pasa cando un usuario interactúa co seu web A páxina, entón quizais eles prema en algo, ou que a páxina é rematar de cargar, ou que cambiaron rato sobre algo, ou que escribiu algo nun campo de entrada. Todas estas cousas son eventos que están ocorrendo na nosa páxina web. E ten o JavaScript capacidade para soportar algo chamado un manipulador de eventos, que é unha función de retorno de chamada que responde a un evento HTML. E o que é unha función de retorno? Ben, é xeralmente só un nome para unha función anónima. É unha función que responde a un evento. E é aquí onde chegamos á idea de certas funcións de conexión para un determinado atributo html. A maioría dos elementos HTML teñen apoio para un atributo que non falamos no html video de algo así como no prema ou en foco ou carga, Todos estes eventos que pode entón escribir funcións que lidan con estes eventos cando estes eventos ocorrer na súa páxina web. 

E quizais por iso o seu html é algo así. E eu teño dous botóns aquí, botón e un botón de dous, e aquí eu teño actualmente nada definido, pero este é o lugar onde o atributo en clic é aparentemente parte da miña tag html. Entón, ao parecer, cando definir o que é pasando dentro dese atributo, que vai haber algún JavaScript función que responde ao evento presuntamente de premer en botón de un ou dous botóns. 

O que é legal sobre iso é que nós pode escribir un manipulador de eventos xenérico. E este evento vai Handler crear un obxecto de evento. E o obxecto de evento vai dicir cal dos dous botóns foi premendo. Agora, como é que funciona? Ben, pode ser algo así. Entón, imos primeiro definir nosos botóns para ter unha resposta de chamada de retorno para o función que será chamada cando o botón é premendo, imos chama evento nome de alerta. E teña en conta en calquera caso estamos pasando neste parámetro evento. Entón, nós chamamos esta función ou cando esta función é accionado polo evento a suceder, que vai crear este obxecto de evento e pasalo como un parámetro para advertir nome. E que é obxecto de evento vai conter información sobre cal botón foi premendo. E como fai iso? Ben, pode ser algo así. Entón, agora na miña separado Arquivo JavaScript, eu podería ten que atopar este función nome de alerta, que novo acepta que parámetro de evento. E, a continuación, aquí é onde eu estou detectando cal botón foi accionado, var gatillo é igual a evento dot elemento de orixe. Cal foi a fonte que creou este obxecto de evento que foi transmitido? Foi un botón ou era botón dous? 

E entón aquí todo o que eu estou facendo é imprimir trigger.innerhtml. Ben, neste caso, no presente contexto, trigger.innerhtml é só o que está escrito no botón. Isto só acontece se nós saltamos volver unha segunda, que sería ser o que hai entre estas etiquetas de botón. Será botón ou un botón de dous. E imos dar un ollo como iso sería manipulador de eventos mirar se tivésemos lo funcionando na práctica. 

Entón, primeiro de todo, ten abriron events.js, que é o ficheiro JavaScript onde Teño definido esta función. E como se pode ver, é moi bonito o que que acabamos de ver no slide un segundo atrás. E eu vou pasar ao páxina principal que estamos a usar. E eu teño aquí botón un e dous botóns. E eu vou prema o botón un. Premeu nun botón, se pode ver aquí no alerta. Aceptar. Preme o botón dous, premendo no botón dous. 

Así, ambos os botóns teñen a mesmo chamada de función, non? Ambos eran nome de alerta evento, pero este obxecto de evento que é creada cando prememos ela dinos cal botón foi premendo. Non temos que escribir dous separados funcións ou xestionar ter para pasar calquera información adicional. Estamos só contando con o que vai JavaScript facer por nós, que é o de crear ese tipo de evento obxecto no noso nome. Hai moito máis que a JavaScript o que nós Cubrimos neste vídeo, pero tendo estes fundamental que chegar un longo formas de todo o que vai aprender Debe saber sobre este linguaxe interesante. Eu son Doug Lloyd. Este é CS50.