Your SlideShare is downloading. ×
Introducción a Javascript
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Introducción a Javascript

1,295
views

Published on

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,295
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
48
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. Fundamentos de Javascript Abraham Estrada
  • 2. HistoriaBrendan Eich 3WC - DOMNetscape 1997 ECMAMocha > LiveScript ECMAScript1995 ISOMicrosoft JScript1996
  • 3. Sintaxis Básicavar foo = ‘hello world’;var foo = ‘hello world’;2 * 3 + 5 // 112 * (3 + 5) // 16var foo = function() { console.log(‘hello);};
  • 4. Operadores Básicosvar foo = ‘hello’;var bar = ‘world’;console.log(foo + ‘ ‘ + bar);2 * 3;2 / 3;var i = 1;var j = ++i;var k = i++;
  • 5. Operaciones con Númerosy Cadenas de Caracteresvar foo = 1;var bar = ‘2’;console.log(foo + bar);console.log(foo + Number(bar));console.log(foo + +bar);
  • 6. Operadores Lógicosvar foo = 1;var bar = 0;var baz = 2;foo || bar; // devuelve 1, el cual es verdadero (true)bar || foo; // devuelve 1, el cual es verdadero (true)foo && bar; // devuelve 0, el cual es falso (false)foo && baz; // devuelve 2, el cual es verdadero (true)baz && foo; // devuelve 1, el cual es verdadero (true)
  • 7. Operadores de Comparaciónvar foo = 1;var bar = 0;var baz = 1;var bim = 2;foo == bar; // devuelve falso (false)foo != bar; // devuelve verdadero (true)foo == baz; // devuelve verdadero (true)foo === baz; // devuelve falso (false)foo !== baz; // devuelve verdadero (true)foo === parseInt(baz); // devuelve verdadero (true)foo > bim; // devuelve falso (false)bim > baz; // devuelve verdadero (true)foo <= baz; // devuelve verdadero (true)
  • 8. Código Condicionalvar foo = true;var bar = false;if (bar) { // este código nunca se ejecutará console.log(hello!);}if (bar) { // este código no se ejecutará} else { if (foo) { // este código se ejecutará } else { // este código se ejecutará si foo y bar son falsos (false) }}
  • 9. Elementos Verdaderos y Falsos0;any string; // cualquier cadena[]; // un arreglo vacío{}; // un objeto vacío1; // cualquier número distinto a cero0;; // una cadena vacíaNaN; // la variable JavaScript "not-a-number"null; // un valor nuloundefined; // puede ser redefinido
  • 10. Variables CondicionalesUtilizando el Operador Ternario var foo = bar ? 1 : 0;
  • 11. Declaración Switchswitch (foo) { case bar: alert(el valor es bar); break; case baz: alert(el valor es baz); break; default: alert(de forma predeterminada se ejecutará este código); break;}
  • 12. var stuffToDo = { bar : function() { alert(el valor es bar); }, baz : function() { alert(el valor es baz); }, default : function() { alert(de forma predeterminada se ejecutará este código); }};if (stuffToDo[foo]) { stuffToDo[foo]();} else { stuffToDo[default]();}
  • 13. Bucle: For// muestra en la consola intento 0,// intento 1, ..., intento 4for (var i=0; i<5; i++) { console.log(intento + i);}
  • 14. Bucle: Whilevar i = 0;while (i < 100) { // Este bloque de código // se ejecutará 100 veces console.log(Actualmente en + i); i++; // incrementa la variable i}
  • 15. Bucle: Do-Whiledo { // Incluso cuando la // condición sea falsa // el cuerpo del bucle se // ejecutará al menos una vez. alert(Hello);} while(false);
  • 16. Break - Continuefor (var i = 0; i < 10; i++) { if (something) { break; }}for (var i = 0; i < 10; i++) { if (something) { continue; } // La siguiente declaración será ejecutada // si la condición something no se cumple console.log(Hello);}
  • 17. Palabras Reservadasabstract double in superboolean else instanceof switch break enum int synchronized byte export interface this case extends long throw catch final native throws char finally new transient class float package try const for private typeofcontinue function protected vardebugger goto public void default if return volatile delete implements short while do import static with
  • 18. Arreglosvar myArray = [ hello, world ];var myArray = [ hello, world, foo];console.log(myArray[2]);console.log(myArray.length);myArray[1] = ‘changed’;myArray.push(‘new’);
  • 19. Arreglosvar myArray = [ h, e, l, l, o ];var myString = myArray.join(); // hellovar mySplit = myString.split();// [ h, e, l, l, o ]
  • 20. Objetosvar myObject = { sayHello : function() { console.log(hello); }, myName : Rebecca};myObject.sayHello();console.log(myObject.myName);
  • 21. Funcionesfunction foo() { /* hacer algo */ }var foo = function() { /* hacer algo */ } http://kangax.github.com/nfe/
  • 22. var greet = function(person, greeting) { var text = greeting + , + person; console.log(text);};greet(Rebecca, Hello);// muestra en la consola Hello, Rebecca
  • 23. var greet = function(person, greeting) { var text = greeting + , + person; return text;};console.log(greet(Rebecca,hello));// la función devuelve Hello, Rebecca,la cual se muestra en la consola
  • 24. var greet = function(person, greeting) { var text = greeting + , + person; return function() { console.log(text); };};var greeting = greet(Rebecca, Hello);greeting();// se muestra en la consola Hello, Rebecca
  • 25. Funciones Anónimas Autoejecutables(function(){ var foo = Hello world;})();console.log(foo);// indefinido (undefined)
  • 26. var myFunction = function() { console.log(hello);};var myObject = { foo : bar};var myArray = [ a, b, c ];var myString = hello;var myNumber = 3;
  • 27. typeof myFunction; // devuelve functiontypeof myObject; // devuelve objecttypeof myArray; // devuelve objecttypeof myString; // devuelve stringtypeof myNumber; // devuelve numbertypeof null; // devuelve objectif (myArray.push && myArray.slice && myArray.join) { // probablemente sea un arreglo // (este estilo es llamado, en inglés, "duck typing")}if (Object.prototype.toString.call(myArray) === [objectArray]) { // definitivamente es un arreglo; // esta es considerada la forma más robusta // de determinar si un valor es un arreglo.}
  • 28. Alcance (scope)var foo = hello;var sayHello = function() { console.log(foo);};sayHello(); // muestra en la consola helloconsole.log(foo); // también muestra en laconsola hello
  • 29. Alcance (scope)var sayHello = function() { var foo = hello; console.log(foo);};sayHello(); // muestra en la consola helloconsole.log(foo); // no muestra nada enla consola
  • 30. Alcance (scope)var foo = world;var sayHello = function() { var foo = hello; console.log(foo);};sayHello(); // muestra en la consola helloconsole.log(foo); // muestra en laconsola world

×