javascript avanzadoasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... ·...
TRANSCRIPT
![Page 1: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/1.jpg)
JAVASCRIPTAVANZADOADOLFOSANZDEDIEGO
OCTUBRE2015
![Page 2: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/2.jpg)
1ACERCADE
![Page 3: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/3.jpg)
1.1AUTORAdolfoSanzDeDiego
Blog:Correo:GitHub:Twitter:Linkedin:SlideShare:
[email protected]/asanzdiegotwitter.com/asanzdiego
in/asanzdiegoslideshare.net/asanzdiego
![Page 4: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/4.jpg)
1.2LICENCIAEsteobraestábajounalicencia:
Elcódigofuentedelosprogramasestánbajounalicencia:
CreativeCommonsReconocimiento-CompartirIgual3.0
GPL3.0
![Page 5: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/5.jpg)
1.3EJEMPLOSLasslidesyloscódigosdeejemplolospodéisencontraren:
https://github.com/asanzdiego/curso-javascript-avanzado-2015
![Page 6: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/6.jpg)
2JAVASCRIPT
![Page 7: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/7.jpg)
2.1HISTORIALocreaBrendanEichenNetscapeen1995parahacerpáginaswebdinámicasApareceporprimeravezenNetscapeNavigator2.0Cadadíamásusado(clientesweb,videojuegos,windows8,servidoresweb,basesdedatos,etc.)
![Page 8: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/8.jpg)
2.2ELLENGUAJEOrientadoaobjetosBasadoenprototiposFuncionalDébilmentetipadoDinámico
![Page 9: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/9.jpg)
3ORIENTACIÓNAOBJETOS
![Page 10: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/10.jpg)
3.1¿QUÉESUNOBJETO?Coleccióndepropiedades(paresnombre-valor).Todosonobjetos(lasfuncionestambién)exceptolosprimitivos:strings,números,booleans,nulloundefinedParasabersiesunobjetoounprimitivohacertypeofvariable
![Page 11: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/11.jpg)
3.2PROPIEDADES(I)Podemosaccederdirectamenteocomosifueseuncontenedor:objeto.nombre===objeto[nombre]//true
![Page 12: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/12.jpg)
3.3PROPIEDADES(II)Podemoscrearlasydestruirlasentiempodeejecuciónvarobjeto={};objeto.nuevaPropiedad=1;//añadirdeleteobjeto.nuevaPropiedad;//eliminar
![Page 13: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/13.jpg)
3.4OBJETOINICIADORPodemoscrearunobjetoasí:
varobjeto={nombre:"Adolfo",twitter:"@asanzdiego"};
![Page 14: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/14.jpg)
3.5FUNCIÓNCONSTRUCTORAOconunafunciónconstructorayunnew.
functionPersona(nombre,twitter){this.nombre=nombre;this.twitter=twitter;};varobjeto=newPersona("Adolfo","@asanzdiego");
![Page 15: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/15.jpg)
3.6PROTOTIPOS(I)Lasfuncionessonobjetosytienenunapropiedadllamadaprototype.Cuandocreamosunobjetoconnew,lareferenciaaesapropiedadprototypeesalmacenadaenunapropiedadinterna.Elprototiposeutilizaparacompartirpropiedades.
![Page 16: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/16.jpg)
3.7PROTOTIPOS(II)Podemosaccederalobjetoprototipodeunobjeto://FallaenOperaoIE<=8Object.getPrototypeOf(objeto);
//NoesestandaryfallaenIEobjeto.__proto__;
![Page 17: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/17.jpg)
3.8EFICIENCIA(I)Siqueremosquenuestrocódigoseejecuteunasolavezyqueprepareenmemoriatodolonecesarioparagenerarobjetos,lamejoropciónesusarunafunciónconstructorasoloconelestadodeunanuevainstancia,yelresto(losmétodos)añadirlosalprototipo.
![Page 18: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/18.jpg)
3.9EFICIENCIA(II)Ejemplo:
functionConstructorA(p1){this.p1=p1;}
//losmétodoslosponenmosenelprototipoConstructorA.prototype.metodo1=function(){console.log(this.p1);};
![Page 19: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/19.jpg)
3.10HERENCIAEjemplo:
functionConstructorA(p1){this.p1=p1;}
functionConstructorB(p1,p2){//llamamosalsuperparaquenosepierdap1.ConstructorA.call(this,p1);this.p2=p2;}
//HacemosqueBherededeA//PrototipodeFunciónConstructoraBapuntaal//PrototipodeFunciónConstructoraAConstructorB.prototype=Object.create(ConstructorA.prototype);
![Page 20: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/20.jpg)
3.11CADENADEPROTOTIPOSCuandoseinvocaunallamadaaunapropiedad,JavaScriptprimerobuscaenelpropioobjeto,ysinoloencuentrabuscaensuprototipo,ysinoenelprototipodelprototipo,asíhastaelprototipodeObjectqueesnull.
![Page 21: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/21.jpg)
3.12CADENADEPROTOTIPOSDELAINSTANCIAEnelejemploanterior:
instanciaB.__proto__==ConstructorB.prototype//trueinstanciaB.__proto__.__proto__==ConstructorA.prototype//trueinstanciaB.__proto__.__proto__.__proto__==Object.prototype//trueinstanciaB.__proto__.__proto__.__proto__.__proto__==null//true
![Page 22: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/22.jpg)
3.13CADENADEPROTOTIPOSDELAFUNCIÓNCONSTRUCTORA
Enelejemploanterior:expect(ConstructorB.__proto__).toEqual(Function.prototype);expect(ConstructorB.__proto__.__proto__).toEqual(Object.prototype);expect(ConstructorB.__proto__.__proto__.__proto__).toEqual(null);
![Page 23: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/23.jpg)
3.14ESQUEMAPROTOTIPOS
Esquemaprototipos
![Page 24: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/24.jpg)
3.15OPERADORINSTANCEOFLaexpresióninstanciaBinstanceofConstructorAdevolverátrue,sielprototipodelaFunciónConstructorA,seencuentraenlacadenadeprototiposdelainstanciaB.Enelejemploanterior:
instanciaBinstanceofConstructorB;//trueinstanciaBinstanceofConstructorA;//trueinstanciaBinstanceofObject;//true
![Page 25: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/25.jpg)
3.16EXTENSIÓNConlosprototipospodemosextenderlafuncionalidaddelpropiolenguaje.Ejemplo:
String.prototype.hola=function(){return"Hola"+this;}
"Adolfo".hola();//"HolaAdolfo"
![Page 26: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/26.jpg)
3.17PROPIEDADESYMÉTODOSESTÁTICOS(I)Loquesedefinedentrodelafunciónconstructoravaaserpropiodelainstancia.Perocomohemosdicho,enJavaScript,unafunciónesunobjeto,alquepodemosañadirtantoatributoscomofunciones.Añadiendoatributosyfuncionesalafunciónconstructoraobtenemospropiedadesymétodosestáticos.
![Page 27: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/27.jpg)
3.18PROPIEDADESYMÉTODOSESTÁTICOS(II)Ejemplo:
functionConstructorA(){
ConstructorA.propiedadEstatica="propiedadestática";}
ConstructorA.metodoEstatico=function(){console.log("métodoestático");}
![Page 28: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/28.jpg)
3.19PROPIEDADESYMÉTODOSPRIVADOS(I)Lavisibilidaddeobjetosdependedelcontexto.LoscontextosenJavaScriptsonbloquesdecódigoentredos{}yengeneral,desdeunodeellos,solotienesaccesoaloqueenélsedefinayaloquesedefinaenotroscontextosquecontenganaltuyo.
![Page 29: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/29.jpg)
3.20PROPIEDADESYMÉTODOSPRIVADOS(II)Ejemplo:
functionConstructorA(privada,publica){varpropiedadPrivada=privada;this.propiedadPublica=publica;varmetodoPrivado=function(){console.log("-->propiedadPrivada",propiedadPrivada);}this.metodoPublico=function(){console.log("-->propiedadPublica",this.propiedadPublica);metodoPrivado();}}
![Page 30: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/30.jpg)
3.21POLIMORFISMOPoderllamaramétodossintácticamenteigualesdeobjetosdetiposdiferentes.Estoseconsiguemedianteherencia.
![Page 31: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/31.jpg)
4TÉCNICASAVANZADAS
![Page 32: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/32.jpg)
4.1FUNCIONESSonobjetosconsuspropiedades.Sepuedenpasarcomoparámetrosaotrasfunciones.Puedenguardarseenvariables.Sonmensajescuyoreceptoresthis.
![Page 33: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/33.jpg)
4.2THISEjemplo:
varnombre="Laura";
varalba={nombre:"Alba",saludo:function(){return"Hola"+this.nombre;}}
alba.saludo();//HolaAlba
varfn=alba.saludo;
fn();//HolaLaura
![Page 34: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/34.jpg)
4.3CALLYAPPLYDosfuncionespermitenmanipularelthis:callyapplyqueenloúnicoquesediferencianesenlallamada.fn.call(thisArg[,arg1[,arg2[...]]])
fn.apply(thisArg[,arglist])
![Page 35: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/35.jpg)
4.4NÚMEROVARIABLEDEARGUMENTOSLasfuncionesenJavaScriptaunquetenganespecificadounnúmerodeargumentosdeentrada,puedenrecibirmásomenosargumentosyesválido.
![Page 36: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/36.jpg)
4.5ARGUMENTSEsunobjetoquecontienelosparámetrosdelafunción.functionechoArgs(){console.log(arguments[0]);//Adolfoconsole.log(arguments[1]);//Sanz}echoArgs("Adolfo","Sanz");
![Page 37: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/37.jpg)
4.6DECLARACIÓNDEFUNCIONESEstas2declaracionessonequivalentes:
functionholaMundo1(){console.log("HolaMundo1");}holaMundo1();
varholaMundo2=function(){console.log("HolaMundo2");}holaMundo2();
![Page 38: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/38.jpg)
4.7TRANSFIRIENDOFUNCIONESAOTRASFUNCIONES
Hemosdichoquelasfuncionessonobjetos,asíquesepuedenpasarcomoparámetros.functionsaluda(){console.log("Hola")}functionejecuta(func){func()}ejecuta(saluda);
![Page 39: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/39.jpg)
4.8FUNCIONESANÓNIMAS(I)Hemosdichoquelasfuncionessepuedendeclarar.Perotambiénpodemosnodeclararlasydejarlascomoanónimas.
![Page 40: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/40.jpg)
4.9FUNCIONESANÓNIMAS(II)Unafunciónanónimaasídeclaradanosepodríaejecutar.function(nombre){console.log("Hola"+nombre);}
![Page 41: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/41.jpg)
4.10FUNCIONESANÓNIMAS(III)Perounafunciónpuededevolverunafunciónanónima.functionsaludador(nombre){returnfunction(){console.log("Hola"+nombre);}}
varsaluda=saludador("mundo");saluda();//Holamundo
![Page 42: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/42.jpg)
4.11FUNCIONESAUTOEJECUTABLESPodemosautoejecutarfuncionesanónimas.
(function(nombre){console.log("Hola"+nombre);})("mundo")
![Page 43: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/43.jpg)
4.12CLOUSURES(I)Unclosurecombinaunafunciónyelentornoenquesecreó.functioncreaSumador(x){returnfunction(y){returnx+y;};}
varsuma5=creaSumador(5);varsuma10=creaSumador(10);
console.log(suma5(2));//muestra7console.log(suma10(2));//muestra12
![Page 44: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/44.jpg)
4.13CLOUSURES(II)Enunaclosureslafuncióninternaalmacenaunareferenciaalúltimovalordelavariableestablecidocuandolafunciónexternaterminadeejecutarse.
![Page 45: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/45.jpg)
4.14ELPATRÓNMODULOSetratadeunafunciónqueactúacomocontenedorparauncontextodeejecución.miModulo=(function(){
varpropiedadPrivada;
functionmetodoPrivado(){};
//APIpublicareturn{metodoPublico1:function(){},
metodoPublico2:function(){}}}());
![Page 46: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/46.jpg)
4.15EFICIENCIA(I)Siseejecutadesdeelnavegador,sesuelepasarcomoparámetroelobjetowindowparamejorarelrendimiento.Asícadavezquelonecesitemoselintérpreteloutilizarádirectameteenlugardebuscarloremontandoniveles.Ytambiénsesuelepasarelparámetroundefined,paraevitarloserroresquepuedendarsesilapalabrareservadahasidoreescritaenalgunapartedelcódigoysuvalornocorrespondaconelesperado.
![Page 47: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/47.jpg)
4.16EFICIENCIA(II)miModulo=(function(window,undefined){
//Elcódigovaaquí
})(window);
![Page 48: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/48.jpg)
4.17ELPATRÓNMODULOREVELADO(I)ElproblemadelpatrónModuloespasarunmétododeprivadoapúblicooviceversa.Poresemotivoloquequesesuelehaceresdefinirtodoenelcuerpo,yluegoreferenciarsololospúblicosenelbloquereturn.
![Page 49: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/49.jpg)
4.18ELPATRÓNMODULOREVELADO(II)miModulo=(function(){
functionmetodoA(){};
functionmetodoB(){};
functionmetodoC(){};
//APIpublicareturn{metodoPublico1:metodoA,metodoPublico2:metodoB}}());
![Page 50: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/50.jpg)
4.19ESPACIOSDENOMBRES(I)Parasimularespaciosdenombres,enJavaScriptseanidanobjetos.miBiblioteca=miBiblioteca||{};
miBiblioteca.seccion1=miBiblioteca.seccion1||{};
miBiblioteca.seccion1={priopiedad:p1,metodo:function(){},};
miBiblioteca.seccion2=miBiblioteca.seccion2||{};
miBiblioteca.seccion2={priopiedad:p2,metodo:function(){},};
![Page 51: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/51.jpg)
4.20ESPACIOSDENOMBRES(II)Sepuedecombinarloanteriorconmódulosautoejecutables:
miBiblioteca=miBiblioteca||{};
(function(namespace){
varpropiedadPrivada=p1;
namespace.propiedadPublica=p2;
varmetodoPrivado=function(){};
namespace.metodoPublico=function(){};
}(miBiblioteca));
![Page 52: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/52.jpg)
5DOCUMENTOBJECTMODEL
![Page 53: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/53.jpg)
5.1¿QUÉESDOM?AcrónimodeDocumentObjectModelEsunconjuntodeutilidadesespecíficamentediseñadasparamanipulardocumentosXML,yporextensióndocumentosXHTMLyHTML.DOMtransformainternamenteelarchivoXMLenunaestructuramásfácildemanejarformadaporunajerarquíadenodos.
![Page 54: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/54.jpg)
5.2TIPOSDENODOSLosmásimportantesson:Document:representaelnodoraíz.Element:representaelcontenidodefinidoporunpardeetiquetasdeaperturaycierreypuedetenertantonodoshijoscomoatributos.Attr:representaelatrributodeunelemento.Text:almacenaelcontenidodeltextoqueseencuentraentreunaetiquetadeaperturayunadecierre.
![Page 55: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/55.jpg)
5.3RECORRERELDOMJavaScriptproporcionafuncionespararecorrerlosnodos:getElementById(id)getElementsByName(name)getElementsByTagName(tagname)getElementsByClassName(className)getAttribute(attributeName)querySelector(selector)querySelectorAll(selector)
![Page 56: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/56.jpg)
5.4MANIPULARELDOMJavaScriptproporcionafuncionesparalamanipulacióndenodos:createElement(tagName)createTextNode(text)createAttribute(attributeName)appendChild(node)insertBefore(newElement,targetElement)removeAttribute(attributename)removeChild(childreference)replaceChild(newChild,oldChild)
![Page 57: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/57.jpg)
5.5PROPIEDADESNODOS(I)Losnodostienenalgunaspropiedadesmuyútiles:attributes[]classNameidinnerHTMLnodeNamenodeValuestyletabIndextagNametitle
![Page 58: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/58.jpg)
5.6PROPIEDADESNODOS(II)Losnodostienenalgunaspropiedadesmuyútiles:childNodes[]firstChildlastChildpreviousSiblingnextSiblingownerDocumentparentNode
![Page 59: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/59.jpg)
6LIBRERÍASYFRAMEWORKS
![Page 60: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/60.jpg)
6.1JQUERY:libreriaquereducecódigo("writeless,do
more").jQuery
//VanillaJavaScriptvarelem=document.getElementById("miElemento");
//jQueryvarelem=$("#miElemento");
![Page 61: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/61.jpg)
6.2JQUERYUI&MOBILE:diseñointerfacesgráficas.
:versiónadaptadaparamóviles(eventosytamaño).
jQueryUIjQueryMobile
![Page 62: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/62.jpg)
6.3FRAMEWORKSCSSy .
Fácilmaquetación,sistemarejilla,clasesCSS,temas,etc.
Bootstrap Foundation
![Page 63: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/63.jpg)
6.4MVCENELFRONT:ligeroyflexible.
:"ConventionoverConfiguration",muypopularentredesarrolladores .
extiendeetiquetasHML(g-app,ng-controller,ng-model,ng-view),detrásestáGoogle,tienegranpopularidad,abruptacurvadeaprendizaje.
BackboneJSEmberJS
RubyonRailsAngularJS
![Page 64: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/64.jpg)
6.5NODEJSpermiteejecutarJSfueradelnavegador.
Vieneconsupropiogestordepaquetes:NodeJS
npm
![Page 65: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/65.jpg)
6.6AUTOMATIZACIÓNDETAREAS:máspopularidadymásplugins.
:másrápidotantoalescribir("CodeoverConfigure")comoalejecutar(streams).
GruntJSGulpJS
![Page 66: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/66.jpg)
6.7GESTIÓNDEDEPENDENCIAS:paraelladocliente.Puedetrabajarcon
repositoriosGit.:permiteescribirmóduloscomoen
ycompilarlosparaquesepuedanusarenelnavegador.
:lasdependenciassecargandeformaasíncronaysolocuandosenecesitam.
:esunempaquetadordemódulos
Bower
BrowserifyNodeJS
RequeriJS
WebPack
![Page 67: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/67.jpg)
6.8APLICACIONESDEESCRITORIOMULTIPLATAFORMA
,ysufork :losmásantiguos,unpocoabandonados.
:opciónmáspopularymadurahoyendía.:creadaparael :
estácreciendoenpopularidad.
AppJS DeskShell
NW.jsElectron editorAtomdeGitHub
![Page 68: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/68.jpg)
6.9APLICACIONESMÓVILESHÍBRIDAS:unadelosprimeros.Hoyendía,otros
frameworkssebasanenél.:utilizaAngularJS,tieneunaCLI,muypopular.
:reciénliberadoporfacebook.
cordova
ionicReactNative
![Page 69: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/69.jpg)
6.10WEBCOMPONENTSesunaespecificacióndelaW3C
parapermitircrearcomponentesyreutilizarlos.:proyectodeGoogleparapoderempezar
ausarlosWebComponentsentodoslosnavegadores.
WebComponents
polymer
![Page 70: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/70.jpg)
6.11OTROS:libreríahechoporFacebookparacrear
interfacesqueserenderizanmuyrápido,yaseaenclienteoservidor.
:frameworkhechoporFacebookqueutilizaReact.
:esunaplataformaquepermitedesarrollaraplicacionesreal-timeconJSIsomófico(seejecutaenfrontyback)
React
Flux
Meteor
![Page 71: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/71.jpg)
7EVENTOS
![Page 72: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/72.jpg)
7.1ELPATRÓNPUBSUB(I)varEventBus={topics:{},
subscribe:function(topic,listener){if(!this.topics[topic])this.topics[topic]=[];this.topics[topic].push(listener);},
publish:function(topic,data){if(!this.topics[topic]||this.topics[topic].length<1)return;this.topics[topic].forEach(function(listener){listener(data||{});});}};
![Page 73: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/73.jpg)
7.2ELPATRÓNPUBSUB(II)EventBus.subscribe('foo',alert);EventBus.publish('foo','HelloWorld!');
![Page 74: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/74.jpg)
7.3ELPATRÓNPUBSUB(III)varMailer=function(){EventBus.subscribe('order/new',this.sendPurchaseEmail);};
Mailer.prototype={sendPurchaseEmail:function(userEmail){console.log("Sentemailto"+userEmail);}};
![Page 75: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/75.jpg)
7.4ELPATRÓNPUBSUB(IV)varOrder=function(params){this.params=params;};
Order.prototype={saveOrder:function(){EventBus.publish('order/new',this.params.userEmail);}};
![Page 76: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/76.jpg)
7.5ELPATRÓNPUBSUB(V)varmailer=newMailer();varorder=newOrder({userEmail:'[email protected]'});order.saveOrder();"[email protected]"
![Page 77: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/77.jpg)
7.6PRINCIPALESEVENTOS(I)Evento Descripciónonblur Unelementopierdeelfocoonchange Unelementohasidomodificadoonclick Pulsarysoltarelratónondblclick Pulsardosvecesseguidasconelratón
![Page 78: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/78.jpg)
7.7PRINCIPALESEVENTOS(II)Evento Descripciónonfocus Unelementoobtieneelfocoonkeydown Pulsarunateclaynosoltarlaonkeypress Pulsarunateclaonkeyup Soltarunateclapulsadaonload Páginacargadacompletamente
![Page 79: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/79.jpg)
7.8PRINCIPALESEVENTOS(III)Evento Descripciónonmousedown Pulsarunbotóndelratónyno
soltarloonmousemove Moverelratónonmouseout Elratón"sale"delelementoonmouseover Elratón"entra"enelelementoonmouseup Soltarelbotóndelratón
![Page 80: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/80.jpg)
7.9PRINCIPALESEVENTOS(IV)Evento Descripciónonreset Inicializarelformularioonresize Modificareltamañodelaventanaonselect Seleccionaruntextoonsubmit Enviarelformularioonunload Seabandonalapágina
![Page 81: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/81.jpg)
7.10SUSCRIPCIÓNParaañadiroeliminarunListenerdeuneventoaunelemento:varwindowOnLoad=function(e){console.log('window:load',e);};
window.addEventListener('load',windowOnLoad);
window.removeEventListener('load',windowOnLoad);
![Page 82: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/82.jpg)
7.11EVENTOSPERSONALIZADOS(I)Podemoscreareventospersonalizados:
varevent=newEvent('build');
elem.addEventListener('build',function(e){...},false);
![Page 83: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/83.jpg)
7.12EVENTOSPERSONALIZADOS(II)Podemoscreareventospersonalizadoscondatos:varevent=newCustomEvent('build',{'detail':detail});
elem.addEventListener('build',function(e){log('Thetimeis:'+e.detail);},false);
![Page 84: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/84.jpg)
7.13DISPARARUNEVENTOPodemosdisparareventos:
functionsimulateClick(){varevent=newMouseEvent('click');varelement=document.getElementById('id');element.dispatchEvent(event);}
![Page 85: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/85.jpg)
7.14PROPAGACIÓN(I)12||/\+-------------||------------||-------------+|DIV1||||||+---------||------------||---------+|||DIV2||||||||+-----||------------||-----+|||||A\/|||||||+----------------------------+|||+------------------------------------+||FASEDEFASEDE||CAPTURABURBUJA||DEEVENTOSDEEVENTOS|+--------------------------------------------+
![Page 86: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/86.jpg)
7.15PROPAGACIÓN(II)//enfasedeCAPTURAaddEventListener("eventName",callback,true);
//enfasedeBURBUJAaddEventListener("eventName",callback,false);//pordefecto
![Page 87: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/87.jpg)
7.16PROPAGACIÓN(III)//detienelapropagacióndeleventoevent.stopPropagation();
//eliminalasaccionespordefecto(ejemplo:abrirenlace)event.preventDefault();
![Page 88: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/88.jpg)
8WEBSOCKETS
![Page 89: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/89.jpg)
8.1¿QUÉSONLOSWEBSOCKETS?Nospermitencomunicaciónbidireccionalentreclienteyservidor.
![Page 90: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/90.jpg)
8.2SOCKET.IOLibreríaclienteyservidor(NodeJS)parautilizarWebSockets:SimplificalaAPI.Permiteenvíarnosólotexto.Permitecreareventospropios.PermiteutilizarnavegadoressinsoportedeWebSockets.
![Page 91: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/91.jpg)
9AJAX
![Page 92: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/92.jpg)
9.1¿QUÉESAJAX?AcrónimodeAsynchronousJavaScriptAndXML.TécnicaparacrearaplicacioneswebinteractivasoRIA(RichInternetApplications).Estasaplicacionesseejecutanenelcliente,esdecir,enelnavegadordelosusuarios.Mientrassemantienelacomunicaciónasíncronaconelservidorensegundoplano.Deestaformaesposiblerealizarcambiossobrelaspáginassinnecesidadderecargarlas.
![Page 93: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/93.jpg)
9.2TECNOLOGÍASAJAX
![Page 94: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/94.jpg)
AJAXnoesunatecnologíaensímisma,enrealidad,setratadevariastecnologíasindependientesqueseunendeformasnuevasysorprendentes.LastecnologíasqueformanAJAXson:XHTMLyCSS,comoestándaresdepresentación.DOM,paralamanipulacióndinámicadelapresentación.XML,JSONyotros,paralalamanipulacióndeinformación.XMLHttpRequest,paraelintercambioasíncronodeinformación.JavaScript,paraunirtodaslasdemástecnologías.
![Page 95: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/95.jpg)
9.3¿QUÉESELXMLHTTPREQUEST?ElintercambiodedatosAJAXentreclienteyservidorsehacemedianteelobjetoXMLHttpRequest,disponibleenlosnavegadoresactuales.NoesnecesarioqueelcontenidoestéformateadoenXML.Sumanejopuedellegarasercomplejo,aunquelibreríascomojQueryfacilitanenormementesuuso.
![Page 96: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/96.jpg)
9.4EJEMPLOvarhttp_request=newXMLHttpRequest();varurl="http://example.net/jsondata.php";
//DescargalosdatosJSONdelservidor.http_request.onreadystatechange=handle_json;http_request.open("GET",url,true);http_request.send(null);
functionhandle_json(){if(http_request.status==200){varjson_data=http_request.responseText;varthe_object=eval("("+json_data+")");}else{alert("OcurriounproblemaconlaURL.");}}
![Page 97: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/97.jpg)
10JSON
![Page 98: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/98.jpg)
10.1¿QUÉESJSON?AcrónimodeJavaScriptObjectNotation.EsunsubconjuntodelanotaciónliteraldeobjetosdeJavaScript.Sirvecomoformatoligeroparaelintercambiodedatos.Susimplicidadhageneralizadosuuso,especialmentecomoalternativaaXMLenAJAX.EnJavaScript,untextoJSONsepuedeanalizarfácilmenteusandolafuncióneval().
![Page 99: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/99.jpg)
10.2PARSEmiObjeto=eval('('+json_datos+')');
Evalesmuyrápido,perocomocompilayejecutacualquiercódigoJavaScript,lasconsideracionesdeseguridadrecomiendannousarlo.Lorecomendableusarlaslibreríasde :JSON.org
JSONinJavaScript-ExplanationJSONinJavaScript-Downloads
![Page 100: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/100.jpg)
10.3EJEMPLO{curso:"AJAXyjQuery",profesor:"Adolfo",participantes:[{nombre:"Isabel",edad:35},{nombre:"Alba",edad:15},{nombre:"Laura",edad:10}]}
![Page 101: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/101.jpg)
10.4JSONPPorseguridadXMLHttpRequestsólopuederealizarpeticionesalmismodominio.JSONPenvuelveelJSONenunafuncióndefinidaporelcliente.EstonospermitehacerpeticionesGET(sóloGET)adominiosdistintos.
![Page 102: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/102.jpg)
10.5CORS(I)ProtocoloCross-OriginResourceSharing(Comparticiónderecursosdedistintosorígenes).Realizarpeticionesaotrosdominiossiempreycuandoeldominiodedestinoestédeacuerdoenrecibirpeticionesdeldominiodeorigen.Tantonavegadorcomoservidortienenqueimplementarelprotocolo.
![Page 103: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/103.jpg)
10.6CORS(II)Desdeelservidor,seenvíaencabecera:
Access-Control-Allow-Origin:http://dominio-permitido.com
![Page 104: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/104.jpg)
11APISREST
![Page 105: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/105.jpg)
11.1¿QUÉESUNAPIREST?REST(RepresentationalStateTransfer)esunatécnicadearquitecturasoftwareparasistemashipermediadistribuidoscomolaWorldWideWeb.Esdecir,unaURL(UniformResourceLocator)representaunrecursoalquesepuedeaccederomodificarmediantelosmétodosdelprotocoloHTTP(POST,GET,PUT,DELETE).
![Page 106: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/106.jpg)
11.2¿PORQUÉREST?Esmássencillo(tantolaAPIcomolaimplementación).Esmásrápido(peticionesmásligerasquesepuedecachear).Esmultiformato(HTML,XML,JSON,etc.).SecomplementamuybienconAJAX.
![Page 107: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/107.jpg)
11.3EJEMPLOAPIGETahttp://myhost.com/person
DevuelvetodaslaspersonasPOSTahttp://myhost.com/person
CrearunanuevapersonaGETahttp://myhost.com/person/123
Devuelvelapersonaconid=123PUTahttp://myhost.com/person/123
Actualizalapersonaconid=123DELETEahttp://myhost.com/person/123
Borralapersonaconid=123
![Page 108: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/108.jpg)
11.4ERRORESHTTP200OK201Created202Accepted301MovedPermanently400BadRequest401Unauthorised402PaymentRequired403Forbidden404NotFound405MethodNotAllowed500InternalServerError501NotImplemented
![Page 109: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/109.jpg)
12GESTIÓNDEDEPENDENCIAS
![Page 110: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/110.jpg)
12.1AMDDefinicióndeMódulosAsíncronos(AMD)Laimplementaciónmáspopulardeesteestándares .Sintaxisunpococomplicada.Permitelacargademódulosdeformaasíncrona.Seusaprincipalmenteennavegadores.
RequireJS
![Page 111: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/111.jpg)
12.2REQUIREJS(I)index.html
<!DOCTYPEhtml><html><head><title>Page1</title><scriptdata-main="js/index"src="js/lib/require.js"></script></head><body><h1>HolaMundo</h1></body></html>
![Page 112: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/112.jpg)
12.3REQUIREJS(II)js/index.js
requirejs(['./common'],function(common){requirejs(['app/main']);});
![Page 113: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/113.jpg)
12.4REQUIREJS(III)app/main.js
define(function(require){var$=require('jquery');varpersona=require('./persona');
$('h1').html("Holarequery.js");
varp=newpersona("Adolfo",30);p.saludar();});
![Page 114: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/114.jpg)
12.5REQUIREJS(IV)app/persona.js
define(function(){
varPersona=function(nombre,edad){
this.nombre=nombre;
Persona.prototype.saludar=function(){alert("Hola,minombrees"+this.nombre);};}
returnPersona;});
![Page 115: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/115.jpg)
12.6COMMONJSLaimplementaciónusadaen y .Sintaxissencilla.Cargalosmódulosdeformasíncrona.Seusaprincipalmenteenelservidor.
NodeJS Browserify
![Page 116: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/116.jpg)
12.7BROWSERIFY(I)Instalarbrowserify
npminstall-gbrowserify
![Page 117: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/117.jpg)
12.8BROWSERIFY(II)Instalardependenciasdepackage.json
npminstall
![Page 118: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/118.jpg)
12.9BROWSERIFY(III)package.json
{"name":"browserify-example","version":"1.0.0","dependencies":{"jquery":"^2.1.3"}}
![Page 119: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/119.jpg)
12.10BROWSERIFY(IV)Compilarlasdependenciasabundle.js
browserifyjs/main.js-ojs/bundle.js
![Page 120: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/120.jpg)
12.11BROWSERIFY(V)index.html
<!doctypehtml><html><head><title>BrowserifyPlayground</title></head><body><h1>HolaMundo</h1><scriptsrc="js/bundle.js"></script></body></html>
![Page 121: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/121.jpg)
12.12BROWSERIFY(VI)js/app/main.js
var$=require('jquery');varpersona=require('./persona');
$('h1').html('HolaBrowserify');
varp=newpersona("Adolfo",30);p.saludar();
![Page 122: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/122.jpg)
12.13BROWSERIFY(VII)js/app/persona.js
varPersona=function(nombre,edad){
this.nombre=nombre;
Persona.prototype.saludar=function(){alert("Hola,minombrees"+this.nombre);};}
module.exports=Persona;
![Page 123: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/123.jpg)
12.14ECMASCRIPT6Cojelomejordelos2enfoques:
SimilitudesconCommonJS:sintaxissencilla.SimilitudesconAMD:soporteparacargaasíncrona.
![Page 124: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/124.jpg)
13ES6
![Page 125: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/125.jpg)
13.1COMOUSARLOHOYnospermiteutilizarES6hoyendía.Babel
![Page 126: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/126.jpg)
13.2FUNCIÓNARROW(I)//ES5vardata=[{...},{...},{...},...];data.forEach(function(elem){console.log(elem)});
![Page 127: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/127.jpg)
13.3FUNCIÓNARROW(I)//ES6vardata=[{...},{...},{...},...];data.forEach(elem=>{console.log(elem);});
![Page 128: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/128.jpg)
13.4FUNCIÓNARROW(III)//ES5varmiFuncion=function(num1,num2){returnnum1+num2;}
![Page 129: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/129.jpg)
13.5FUNCIÓNARROW(IV)//ES6varmiFuncion=(num1,num2)=>num1+num2;
![Page 130: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/130.jpg)
13.6THIS(I)//ES5varobjEJ5={data:["Adolfo","Isabel","Alba"],duplicar:function(){varthat=this;this.data.forEach(function(elem){that.data.push(elem);});returnthis.data;}}
![Page 131: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/131.jpg)
13.7THIS(II)//ES6varobjEJ6={data:["Adolfo","Isabel","Alba"],duplicar:function(){this.data.forEach((elem)=>{this.data.push(elem);});returnthis.data;}}
![Page 132: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/132.jpg)
13.8DEFINICIÓNDECLASES(I)//ES5varShape=function(id,x,y){this.id=id;this.move(x,y);};Shape.prototype.move=function(x,y){this.x=x;this.y=y;};
![Page 133: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/133.jpg)
13.9DEFINICIÓNDECLASES(II)//ES6classShape{constructor(id,x,y){this.id=idthis.move(x,y)}move(x,y){this.x=xthis.y=y}}
![Page 134: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/134.jpg)
13.10HERENCIADECLASES(I)//ES5varRectangle=function(id,x,y,width,height){Shape.call(this,id,x,y);this.width=width;this.height=height;};Rectangle.prototype=Object.create(Shape.prototype);Rectangle.prototype.constructor=Rectangle;
varCircle=function(id,x,y,radius){Shape.call(this,id,x,y);this.radius=radius;};Circle.prototype=Object.create(Shape.prototype);Circle.prototype.constructor=Circle;
![Page 135: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/135.jpg)
13.11HERENCIADECLASES(II)//ES6classRectangleextendsShape{constructor(id,x,y,width,height){super(id,x,y)this.width=widththis.height=height}}classCircleextendsShape{constructor(id,x,y,radius){super(id,x,y)this.radius=radius}}
![Page 136: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/136.jpg)
13.12LET(I)//ES5(function(){console.log(x);//xnoestádefinidaaún.if(true){varx="holamundo";}console.log(x);//Imprime"holamundo",porque"var"//hacequeseaglobalalafunción;})();
![Page 137: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/137.jpg)
13.13LET(II)//ES6(function(){if(true){letx="holamundo";}console.log(x);//Daerror,porque"x"hasidodefinidadentrodel"if"})();
![Page 138: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/138.jpg)
13.14SCOPES(I)//ES5(function(){varfoo=function(){return1;}foo()===1;(function(){varfoo=function(){return2;}foo()===2;})();foo()===1;})();
![Page 139: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/139.jpg)
13.15SCOPES(II)//ES6{functionfoo(){return1}foo()===1{functionfoo(){return2}foo()===2}foo()===1}
![Page 140: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/140.jpg)
13.16CONST(I)//ES6(function(){constPI;PI=3.15;//ERROR,porquehadeasignarseunvalorenladeclaración})();
![Page 141: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/141.jpg)
13.17CONST(II)//ES6(function(){constPI=3.15;PI=3.14159;//ERRORdenuevo,porqueesdesólo-lectura})();
![Page 142: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/142.jpg)
13.18TEMPLATESTRINGS(I)//ES6letnombre1="JavaScript";letnombre2="awesome";console.log(`Sóloquierodecirque${nombre1}is${nombre2}`);//SoloquierodecirqueJavaScriptisawesome
![Page 143: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/143.jpg)
13.19TEMPLATESTRINGS(II)//ES5varsaludo="ola"+"que"+"ase";
![Page 144: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/144.jpg)
13.20TEMPLATESTRINGS(III)//ES6varsaludo=`olaquease`;
![Page 145: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/145.jpg)
13.21DESTRUCTURING(I)//ES6var[a,b]=["hola","mundo"];console.log(a);//"hola"console.log(b);//"mundo"
![Page 146: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/146.jpg)
13.22DESTRUCTURING(II)//ES6varobj={nombre:"Adolfo",apellido:"Sanz"};var{nombre,apellido}=obj;console.log(nombre);//"Adolfo"console.log(apellido);//"Sanz"
![Page 147: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/147.jpg)
13.23DESTRUCTURING(III)//ES6varfoo=function(){return["180","78"];};var[estatura,peso]=foo();console.log(estatura);//180console.log(peso);//78
![Page 148: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/148.jpg)
13.24PARÁMETROSCONNOMBRE(I)//ES5functionf(arg){varname=arg[0];varval=arg[1];console.log(name,val);};functiong(arg){varn=arg.name;varv=arg.val;console.log(n,v);};functionh(arg){varname=arg.name;varval=arg.val;console.log(name,val);};f(["bar",42]);g({name:"foo",val:7});h({name:"bar",val:42});
![Page 149: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/149.jpg)
13.25PARÁMETROSCONNOMBRE(II)//ES6functionf([name,val]){console.log(name,val)}functiong({name:n,val:v}){console.log(n,v)}functionh({name,val}){console.log(name,val)}f(["bar",42])g({name:"foo",val:7})h({name:"bar",val:42})
![Page 150: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/150.jpg)
13.26RESTOPARÁMETROS(I)//ES5functionf(x,y){vara=Array.prototype.slice.call(arguments,2);return(x+y)*a.length;};f(1,2,"hello",true,7)===9;
![Page 151: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/151.jpg)
13.27RESTOPARÁMETROS(II)//ES6functionf(x,y,...a){return(x+y)*a.length}f(1,2,"hello",true,7)===9
![Page 152: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/152.jpg)
13.28VALORESPORDEFECTO(I)//ES5function(valor){valor=valor||"foo";}
![Page 153: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/153.jpg)
13.29VALORESPORDEFECTO(I)//ES6function(valor="foo"){...};
![Page 154: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/154.jpg)
13.30EXPORTARMÓDULOS//ES6
//lib/math.jsexportfunctionsum(x,y){returnx+y}exportfunctiondiv(x,y){returnx/y}exportvarpi=3.141593
![Page 155: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/155.jpg)
13.31IMPORTARMÓDULOS//ES6
//someApp.jsimport*asmathfrom"lib/math"console.log("2π="+math.sum(math.pi,math.pi))
//otherApp.jsimport{sum,pi}from"lib/math"console.log("2π="+sum(pi,pi))
![Page 156: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/156.jpg)
13.32GENERADORES//ES6function*soyUnGenerador(i){yieldi+1;yieldi+2;yieldi+3;}
vargen=soyUnGenerador(1);console.log(gen.next());//Object{value:2,done:false}console.log(gen.next());//Object{value:3,done:false}console.log(gen.next());//Object{value:4,done:false}console.log(gen.next());//Object{value:undefined,done:true}
![Page 157: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/157.jpg)
13.33SET//ES6lets=newSet()s.add("hello").add("goodbye").add("hello")s.size===2s.has("hello")===truefor(letkeyofs.values()){//insertionorderconsole.log(key)}
![Page 158: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/158.jpg)
13.34MAP//ES6letm=newMap()m.set("hello",42)m.set(s,34)m.get(s)===34m.size===2for(let[key,val]ofm.entries()){console.log(key+"="+val)}
![Page 159: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/159.jpg)
13.35NUEVOSMÉTODOSENSTRING//ES6"hello".startsWith("ello",1)//true"hello".endsWith("hell",4)//true"hello".includes("ell")//true"hello".includes("ell",1)//true"hello".includes("ell",2)//false
![Page 160: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/160.jpg)
13.36NUEVOSMÉTODOSENNUMBER//ES6Number.isNaN(42)===falseNumber.isNaN(NaN)===trueNumber.isSafeInteger(42)===trueNumber.isSafeInteger(9007199254740992)===false
![Page 161: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/161.jpg)
13.37PROXIES//ES6lettarget={foo:"Welcome,foo"}letproxy=newProxy(target,{get(receiver,name){returnnameinreceiver?receiver[name]:`Hello,${name}`}})proxy.foo==="Welcome,foo"proxy.world==="Hello,world"
![Page 162: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/162.jpg)
13.38INTERNACIONALIZATION(I)//ES6vari10nUSD=newIntl.NumberFormat("en-US",{style:"currency",currency:"USD"vari10nGBP=newIntl.NumberFormat("en-GB",{style:"currency",currency:"GBP"i10nUSD.format(100200300.40)==="$100,200,300.40"i10nGBP.format(100200300.40)==="£100,200,300.40"
![Page 163: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/163.jpg)
13.39INTERNACIONALIZATION(II)//ES6vari10nEN=newIntl.DateTimeFormat("en-US")vari10nDE=newIntl.DateTimeFormat("de-DE")i10nEN.format(newDate("2015-01-02"))==="1/2/2015"i10nDE.format(newDate("2015-01-02"))==="2.1.2015"
![Page 164: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/164.jpg)
13.40PROMESAS(I)//ES6varpromise=newPromise(function(resolve,reject){
vartodoCorrecto=true;//ofalsedependiendodecomohaido
if(todoCorrecto){resolve("PromesaResuelta!");}else{reject("PromesaRechazada!");}});
![Page 165: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/165.jpg)
13.41PROMESAS(II)//ES6
//llamamoselmetodo'then'delapromesa//con2callbacks(resolveyreject)promise.then(function(result){console.log(result);//"PromesaResuelta!"},function(err){console.log(err);//Error:"PromesaRechazada!"});
![Page 166: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/166.jpg)
13.42PROMESAS(III)//ES6
//podemostambiénllamaral'then'conelcallback'resolve'//yluegoal'catch'conelcallback'reject'promise.then(function(result){console.log(result);//"PromesaResuelta!"}).catch(function(err){console.log(err);//Error:"PromesaRechazada!"});
![Page 167: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/167.jpg)
13.43PROMESAS(IV)//ES6
Promise.all([promesa1,promesa2]).then(function(results){console.log(results);//cuandotodaslaspromesasterminen}).catch(function(err){console.log(err);//Error:"Errorenalgunapromesa!"});
![Page 168: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/168.jpg)
13.44PROMESAS(V)//ES6
Promise.race([promesa1,promesa2]).then(function(firstResult){console.log(firstResult);//cuandoterminelaprimera}).catch(function(err){console.log(err);//Error:"Errorenalgunapromesa!"});
![Page 169: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/169.jpg)
14ENLACES
![Page 170: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/170.jpg)
14.1GENERAL(ES)http://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Obsolete_Pages/Gu%C3%ADa_JavaScript_1.5http://cevichejs.com/http://www.arkaitzgarro.com/javascript/http://www.etnassoft.com/category/javascript/
![Page 171: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/171.jpg)
14.2GENERAL(EN)http://www.javascriptkit.com/http://javascript.info/http://www.howtocreate.co.uk/tutorials/javascript/
![Page 172: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/172.jpg)
14.3ORIENTACIÓNOBJETOS(ES)(I)http://www.programania.net/diseno-de-software/entendiendo-los-prototipos-en-javascript/http://www.programania.net/diseno-de-software/creacion-de-objetos-eficiente-en-javascript/http://blog.amatiasq.com/2012/01/javascript-conceptos-basicos-herencia-por-prototipos/
![Page 173: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/173.jpg)
14.4ORIENTACIÓNOBJETOS(ES)(II)http://albertovilches.com/profundizando-en-javascript-parte-1-funciones-para-todohttp://albertovilches.com/profundizando-en-javascript-parte-2-objetos-prototipos-herencia-y-namespaceshttp://www.arkaitzgarro.com/javascript/capitulo-9.htmlhttp://www.etnassoft.com/2011/04/15/concepto-de-herencia-prototipica-en-javascript/
![Page 174: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/174.jpg)
14.5ORIENTACIÓNOBJETOS(EN)http://www.codeproject.com/Articles/687093/Understanding-JavaScript-Object-Creation-Patternshttp://javascript.info/tutorial/object-oriented-programminghttp://www.howtocreate.co.uk/tutorials/javascript/objects
![Page 175: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/175.jpg)
14.6TÉCNICASAVANZADAS(ES)(I)http://www.etnassoft.com/2011/03/14/funciones-autoejecutables-en-javascript/http://www.etnassoft.com/2012/01/12/el-valor-de-this-en-javascript-como-manejarlo-correctamente/https://developer.mozilla.org/es/docs/Web/JavaScript/Closureshttp://www.variablenotfound.com/2012/10/closures-en-javascript-entiendelos-de.html
![Page 176: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/176.jpg)
14.7TÉCNICASAVANZADAS(ES)(II)http://www.webanalyst.es/espacios-de-nombres-en-javascript/http://www.etnassoft.com/2011/04/11/el-patron-de-modulo-en-javascript-en-profundidad/http://www.etnassoft.com/2011/04/18/ampliando-patron-modulo-javascript-submodulos/http://notasjs.blogspot.com.es/2012/04/el-patron-modulo-en-javascript.html
![Page 177: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/177.jpg)
14.8DOM(ES)http://cevichejs.com/3-dom-cssom#domhttp://www.arkaitzgarro.com/javascript/capitulo-13.html
![Page 178: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/178.jpg)
14.9DOM(EN)http://www.javascriptkit.com/domref/http://javascript.info/tutorial/dom
![Page 179: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/179.jpg)
14.10FRAMEWORKS(ES)https://carlosazaustre.es/blog/frameworks-de-javascript/https://docs.google.com/drawings/d/1bhe9-kxhhGvWU0LsB7LlJfMurP3DGCIuUOmqEOklzaQ/edithttp://www.lostiemposcambian.com/blog/javascript/backbone-vs-angular-vs-ember/http://blog.koalite.com/2015/06/grunt-o-gulp-que-uso/
![Page 180: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/180.jpg)
14.11FRAMEWORKS(EN)http://www.slideshare.net/deepusnath/javascript-frameworks-comparison-angular-knockout-ember-and-backbonehttp://stackshare.io/stackups/backbone-vs-emberjs-vs-angularjshttp://www.hongkiat.com/blog/gulp-vs-grunt/https://mattdesl.svbtle.com/browserify-vs-webpackhttp://hackhat.com/p/110/module-loader-webpack-vs-requirejs-vs-browserify/http://devzum.com/2014/02/10-best-node-js-mvc-frameworks-for-javascript-developers/http://www.tivix.com/blog/nwjs-and-electronjs-web-technology-desktop/http://stackshare.io/stackups/phonegap-vs-ionic-vs-react-nativehttps://developer.salesforce.com/page/Native,_HTML5,_or_Hybrid:_Understanding_Your_Mobile_Application_Development_Options
![Page 181: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/181.jpg)
14.12EVENTOS(ES)http://cevichejs.com/3-dom-cssom#eventoshttp://www.arkaitzgarro.com/javascript/capitulo-15.htmlhttp://codexexempla.org/curso/curso_4_3_e.php
![Page 182: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/182.jpg)
14.13EVENTOS(EN)https://developer.mozilla.org/en-US/docs/Web/API/EventTargethttps://developer.mozilla.org/en-US/docs/Web/API/Eventhttp://dev.housetrip.com/2014/09/15/decoupling-javascript-apps-using-pub-sub-pattern/https://stackoverflow.com/questions/5963669/whats-the-difference-between-event-stoppropagation-and-event-preventdefault
![Page 183: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/183.jpg)
14.14WEBSOCKETS(ES)http://www.html5rocks.com/es/tutorials/websockets/basics/https://carlosazaustre.es/blog/websockets-como-utilizar-socket-io-en-tu-aplicacion-web/
![Page 184: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/184.jpg)
14.15WEBSOCKETS(EN)https://davidwalsh.name/websockethttp://code.tutsplus.com/tutorials/start-using-html5-websockets-today--net-13270
![Page 185: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/185.jpg)
14.16AJAX,JSON,REST(ES)https://fernetjs.com/2012/09/jsonp-cors-y-como-los-soportamos-desde-nodejs/http://blog.koalite.com/2012/03/sopa-de-siglas-ajax-json-jsonp-y-cors/https://eamodeorubio.wordpress.com/category/webservices/rest/https://eamodeorubio.wordpress.com/category/webservices/rest/
![Page 186: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/186.jpg)
14.17ES6(ES)http://rlbisbe.net/2014/08/26/articulo-invitado-ecmascript-6-y-la-nueva-era-de-javascript-por-ckgrafico/http://carlosazaustre.es/blog/ecmascript-6-el-nuevo-estandar-de-javascript/http://asanzdiego.blogspot.com.es/2015/06/principios-solid-con-ecmascript-6-el-nuevo-estandar-de-javascript.htmlhttp://www.cristalab.com/tutoriales/uso-de-modulos-en-javascript-con-ecmascript-6-c114342l/https://burabure.github.io/tut-ES6-promises-generators/
![Page 187: JAVASCRIPT AVANZADOasanzdiego.github.io/curso-javascript-avanzado-2015/slides/export/... · JavaScript primero busca en el propio objeto, y si no lo encuentra busca en su prototipo,](https://reader034.vdocuments.pub/reader034/viewer/2022042215/5ebc095b68195134c316027f/html5/thumbnails/187.jpg)
14.18ES6(EN)http://es6-features.org/http://kangax.github.io/compat-table/es5/http://www.2ality.com/2015/11/sequential-execution.htmlhttp://www.html5rocks.com/en/tutorials/es6/promises/http://www.datchley.name/es6-promises/