SlideShare una empresa de Scribd logo
Repasando JavaScript
- Presentación
- Inicio del lenguaje
- Tipos de datos y variables
- Objetos
- Arrays
- Funciones
- Event y Arguments
- Operadores
- Otros conceptos básicos
Presentación
Quique Fdez. Guerra
Desarrollador frontend en Beezy
@CKGrafico - www.ckgrafico.com
Inicio del lenguaje
Brendan Eich
Netscape
Mozilla
- Años 90
- Necesidad lenguaje navegador
- Mucha prisa
Nace un lenguaje sencillo aunque menos
robusto respecto otros.
Se estandariza como ECMAScript ya vamos
por la sexta versión (2014-2015)
Tipos de datos
PRINCIPALES
- String
- Number
- Boolean
COMPUESTOS
- Object
- Array
ESPECIALES
- null
- undefined
Variables
- Cualquier cosa puede ser una variable
- Todas se definen con var
- Su tipo depende directamente de lo que asignamos
Enlace recomendado
Var
Valor Tipo
Objetos
Objeto: “Everything is an object” (Todo son objetos)
JSON: Representación en texto de un objeto JavaScript (JS Object Notation)
Los objetos que creemos llamando a ésa función con
new tendrán su [[Prototype]] (__proto__) apuntando a
la propiedad prototype de la función.
@amatiasq
Prototype vs
__proto__
¿Qué es?
- Una variable compuesta, una entidad, algo existente.
- Tiene propiedades
- Puede tener métodos
Arrays
¿Qué es?
- Es un objeto
- Que tiene la propiedad length
- Por defecto tiene índices numéricos, pero..
Funciones
Declaración de funciones vs
Expresión de funciones
Anónimas
Anónimas autoejecutables
Event y Arguments
event: Es un parámetro que siempre se nos pasa al capturar un evento en JavaScript.
Contiene un montón de propiedades y métodos interesantes como algunos de los siguientes.
Event y Arguments
arguments: Un objeto que parece un Array pero no lo es.
Contiene todos los parámetros que hemos pasado a la función
Se utiliza muchas veces cuando no sabemos que argumentos
ni cuantos nos pasan, aunque en ECMA6 seguramente su uso
será casi nulo por todas las novedades que trae, p. ej:
Operadores
De asignación
Aritméticos
Relacionales
Lógicos
De cadenas
Otros conceptos básicos
Math
RegExp
Timers básicos
Date
Closures
Cadenas

Más contenido relacionado

Destacado

Física nuclear teórica richard p. feynman
Física nuclear teórica richard p. feynmanFísica nuclear teórica richard p. feynman
Física nuclear teórica richard p. feynman
Mileide Almeida Almeida
 
Richard feynman (5partes)
Richard feynman (5partes)Richard feynman (5partes)
Richard feynman (5partes)
cmcbachillerato
 

Destacado (20)

HTML5 en el universo Windows (Apps universales)
HTML5 en el universo Windows (Apps universales)HTML5 en el universo Windows (Apps universales)
HTML5 en el universo Windows (Apps universales)
 
#Win8JSApps | 4.- Métodos de desarrollo
#Win8JSApps | 4.- Métodos de desarrollo#Win8JSApps | 4.- Métodos de desarrollo
#Win8JSApps | 4.- Métodos de desarrollo
 
If it sounds right it is right!
If it sounds right it is right!If it sounds right it is right!
If it sounds right it is right!
 
Física nuclear teórica richard p. feynman
Física nuclear teórica richard p. feynmanFísica nuclear teórica richard p. feynman
Física nuclear teórica richard p. feynman
 
lenguaje web
lenguaje weblenguaje web
lenguaje web
 
Richard feynman (5partes)
Richard feynman (5partes)Richard feynman (5partes)
Richard feynman (5partes)
 
RICHARD FEYNMAN
RICHARD FEYNMANRICHARD FEYNMAN
RICHARD FEYNMAN
 
Richard Feynman
Richard FeynmanRichard Feynman
Richard Feynman
 
Ejemplos WAI-ARIA con HTML, CSS y JavaScript
Ejemplos WAI-ARIA con HTML, CSS y JavaScriptEjemplos WAI-ARIA con HTML, CSS y JavaScript
Ejemplos WAI-ARIA con HTML, CSS y JavaScript
 
Understanding (Feynman)
Understanding (Feynman)Understanding (Feynman)
Understanding (Feynman)
 
Golden Rules For Quality Engineers
Golden Rules For Quality EngineersGolden Rules For Quality Engineers
Golden Rules For Quality Engineers
 
HTML5 & JavaScript: The Future Now
HTML5 & JavaScript: The Future NowHTML5 & JavaScript: The Future Now
HTML5 & JavaScript: The Future Now
 
Html5
Html5Html5
Html5
 
Feynman Rules
Feynman RulesFeynman Rules
Feynman Rules
 
JavaScript para Javeros. ¿Cómo ser moderno y no morir en el intento?
JavaScript para Javeros. ¿Cómo ser moderno y no morir en el intento?JavaScript para Javeros. ¿Cómo ser moderno y no morir en el intento?
JavaScript para Javeros. ¿Cómo ser moderno y no morir en el intento?
 
Javascript handbook
Javascript handbook Javascript handbook
Javascript handbook
 
Javascript en proyectos reales: jQuery
Javascript en proyectos reales: jQueryJavascript en proyectos reales: jQuery
Javascript en proyectos reales: jQuery
 
Aprendiendo a Programas en 4 horas JavaScript
Aprendiendo a Programas en 4 horas JavaScriptAprendiendo a Programas en 4 horas JavaScript
Aprendiendo a Programas en 4 horas JavaScript
 
Basic JavaScript Tutorial
Basic JavaScript TutorialBasic JavaScript Tutorial
Basic JavaScript Tutorial
 
HTML5 & JavaScript Games
HTML5 & JavaScript GamesHTML5 & JavaScript Games
HTML5 & JavaScript Games
 

Similar a Repaso conceptos básicos de JavaScript

¿Cómo elegir el languaje y el framework de tu próxima aplicación web?
¿Cómo elegir el languaje y el framework de tu próxima aplicación web?¿Cómo elegir el languaje y el framework de tu próxima aplicación web?
¿Cómo elegir el languaje y el framework de tu próxima aplicación web?
Antonio Ognio
 
Dce0 programacion oo_c__vbnet
Dce0 programacion oo_c__vbnetDce0 programacion oo_c__vbnet
Dce0 programacion oo_c__vbnet
victdiazm
 

Similar a Repaso conceptos básicos de JavaScript (20)

Desarrollo web en Nodejs con Pillars por Chelo Quilón
Desarrollo web en Nodejs con Pillars por Chelo QuilónDesarrollo web en Nodejs con Pillars por Chelo Quilón
Desarrollo web en Nodejs con Pillars por Chelo Quilón
 
¿Cómo elegir el languaje y el framework de tu próxima aplicación web?
¿Cómo elegir el languaje y el framework de tu próxima aplicación web?¿Cómo elegir el languaje y el framework de tu próxima aplicación web?
¿Cómo elegir el languaje y el framework de tu próxima aplicación web?
 
Java
JavaJava
Java
 
Javascript
JavascriptJavascript
Javascript
 
Trabajo de desarrollo de software(java)yanina y yenny
Trabajo de desarrollo de software(java)yanina y yennyTrabajo de desarrollo de software(java)yanina y yenny
Trabajo de desarrollo de software(java)yanina y yenny
 
[Run Reloaded] Presentando .NET 4.0 (Diego González + Pablo Zaidenvoren)
[Run Reloaded] Presentando .NET 4.0 (Diego González + Pablo Zaidenvoren)[Run Reloaded] Presentando .NET 4.0 (Diego González + Pablo Zaidenvoren)
[Run Reloaded] Presentando .NET 4.0 (Diego González + Pablo Zaidenvoren)
 
Java
JavaJava
Java
 
¿Que es javascript y Modulos?
¿Que es javascript y Modulos?¿Que es javascript y Modulos?
¿Que es javascript y Modulos?
 
Jruby On Rails. Ruby on Rails en la JVM
Jruby On Rails. Ruby on Rails en la JVMJruby On Rails. Ruby on Rails en la JVM
Jruby On Rails. Ruby on Rails en la JVM
 
Json
JsonJson
Json
 
ASP.NET vNext... Desarrollo cross platform
ASP.NET vNext... Desarrollo cross platformASP.NET vNext... Desarrollo cross platform
ASP.NET vNext... Desarrollo cross platform
 
TypeScript para Javeros. Por fin un lenguaje 'de verdad' en el browser
TypeScript para Javeros. Por fin un lenguaje 'de verdad' en el browserTypeScript para Javeros. Por fin un lenguaje 'de verdad' en el browser
TypeScript para Javeros. Por fin un lenguaje 'de verdad' en el browser
 
Dce0 programacion oo_c__vbnet
Dce0 programacion oo_c__vbnetDce0 programacion oo_c__vbnet
Dce0 programacion oo_c__vbnet
 
definicion de java
definicion de javadefinicion de java
definicion de java
 
Json short manual
Json short manualJson short manual
Json short manual
 
Curso introduccionphp sql
Curso introduccionphp sqlCurso introduccionphp sql
Curso introduccionphp sql
 
Guiacursophp sql
Guiacursophp sqlGuiacursophp sql
Guiacursophp sql
 
Node para Javeros: Conoce a tu enemigo
Node para Javeros: Conoce a tu enemigoNode para Javeros: Conoce a tu enemigo
Node para Javeros: Conoce a tu enemigo
 
sesion_01-JAVA.pdf
sesion_01-JAVA.pdfsesion_01-JAVA.pdf
sesion_01-JAVA.pdf
 
Ruby para Java Developers
Ruby para Java DevelopersRuby para Java Developers
Ruby para Java Developers
 

Más de Quique Fdez Guerra

Más de Quique Fdez Guerra (18)

Frontend 101 Initializing a Frontend Project using React
Frontend 101 Initializing a Frontend Project using ReactFrontend 101 Initializing a Frontend Project using React
Frontend 101 Initializing a Frontend Project using React
 
YOU CAN INJECT DEPENDENCIES IN YOUR COMPONENTS, LET'S DO IT.
 YOU CAN INJECT DEPENDENCIES IN YOUR COMPONENTS, LET'S DO IT. YOU CAN INJECT DEPENDENCIES IN YOUR COMPONENTS, LET'S DO IT.
YOU CAN INJECT DEPENDENCIES IN YOUR COMPONENTS, LET'S DO IT.
 
Empowering Vue with Typescript, Inversify, Vuex and some other super tools
Empowering Vue with Typescript, Inversify, Vuex and some other super toolsEmpowering Vue with Typescript, Inversify, Vuex and some other super tools
Empowering Vue with Typescript, Inversify, Vuex and some other super tools
 
Why TypeScript?
Why TypeScript?Why TypeScript?
Why TypeScript?
 
Real and scalable applications with Nuxt, Vuex and TypeScript
Real and scalable applications with Nuxt, Vuex and TypeScriptReal and scalable applications with Nuxt, Vuex and TypeScript
Real and scalable applications with Nuxt, Vuex and TypeScript
 
Lord of the codes: Visual Studio y todo lo que puedes hacer con él
Lord of the codes: Visual Studio y todo lo que puedes hacer con élLord of the codes: Visual Studio y todo lo que puedes hacer con él
Lord of the codes: Visual Studio y todo lo que puedes hacer con él
 
Microsoft Student Partner
Microsoft Student PartnerMicrosoft Student Partner
Microsoft Student Partner
 
Reconnect
ReconnectReconnect
Reconnect
 
Cordova Productivity Tools
Cordova Productivity ToolsCordova Productivity Tools
Cordova Productivity Tools
 
Más productivos con Apache Cordova e Ionic
Más productivos con Apache Cordova e IonicMás productivos con Apache Cordova e Ionic
Más productivos con Apache Cordova e Ionic
 
Los bots son las nuevas apps
Los bots son las nuevas appsLos bots son las nuevas apps
Los bots son las nuevas apps
 
Gitflow Workflow
Gitflow WorkflowGitflow Workflow
Gitflow Workflow
 
Yo solo te pedí un plátano
Yo solo te pedí un plátanoYo solo te pedí un plátano
Yo solo te pedí un plátano
 
Mejora de la atención odontológica para países en desarrollo
Mejora de la atención odontológica para países en desarrolloMejora de la atención odontológica para países en desarrollo
Mejora de la atención odontológica para países en desarrollo
 
Nos vamos de SPA
Nos vamos de SPANos vamos de SPA
Nos vamos de SPA
 
Introduccion a la programacion (Pseudocódigo + JavaScript)
Introduccion a la programacion (Pseudocódigo + JavaScript)Introduccion a la programacion (Pseudocódigo + JavaScript)
Introduccion a la programacion (Pseudocódigo + JavaScript)
 
Pasado, presente y Futuro de las aplicaciones en HTML5
Pasado, presente y Futuro de las aplicaciones en HTML5Pasado, presente y Futuro de las aplicaciones en HTML5
Pasado, presente y Futuro de las aplicaciones en HTML5
 
Eventos en las páginas
 Eventos en las páginas Eventos en las páginas
Eventos en las páginas
 

Último

tema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptx
tema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptxtema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptx
tema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptx
DianaSG6
 
BOTAnica mesias orland role.pptx1 ciclo agropecuaria
BOTAnica mesias orland role.pptx1 ciclo agropecuariaBOTAnica mesias orland role.pptx1 ciclo agropecuaria
BOTAnica mesias orland role.pptx1 ciclo agropecuaria
mesiassalazarpresent
 
NORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOL
NORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOLNORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOL
NORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOL
Pol Peña Quispe
 

Último (20)

PLANIFICACION INDUSTRIAL ( Gantt-Pert-CPM ).docx
PLANIFICACION INDUSTRIAL ( Gantt-Pert-CPM ).docxPLANIFICACION INDUSTRIAL ( Gantt-Pert-CPM ).docx
PLANIFICACION INDUSTRIAL ( Gantt-Pert-CPM ).docx
 
monografia sobre puentes 1234456785432o5
monografia sobre puentes 1234456785432o5monografia sobre puentes 1234456785432o5
monografia sobre puentes 1234456785432o5
 
Ergonomía_MÉTODO_ROSA. Evaluación de puesto de trabajo de oficina - coworking
Ergonomía_MÉTODO_ROSA. Evaluación de puesto de trabajo de oficina - coworkingErgonomía_MÉTODO_ROSA. Evaluación de puesto de trabajo de oficina - coworking
Ergonomía_MÉTODO_ROSA. Evaluación de puesto de trabajo de oficina - coworking
 
ANÁLISIS MASAS PATRIMONIALES y financieros
ANÁLISIS MASAS PATRIMONIALES y financierosANÁLISIS MASAS PATRIMONIALES y financieros
ANÁLISIS MASAS PATRIMONIALES y financieros
 
PRESENTACION REUNION DEL COMITE DE SEGURIDAD
PRESENTACION REUNION DEL COMITE DE SEGURIDADPRESENTACION REUNION DEL COMITE DE SEGURIDAD
PRESENTACION REUNION DEL COMITE DE SEGURIDAD
 
Efecto. Fotovoltaico y paneles.pdf
Efecto.     Fotovoltaico  y  paneles.pdfEfecto.     Fotovoltaico  y  paneles.pdf
Efecto. Fotovoltaico y paneles.pdf
 
DISEÑO DE LOSAS EN UNA DIRECCION (CONCRETO ARMADO II )
DISEÑO DE LOSAS EN UNA DIRECCION  (CONCRETO ARMADO II )DISEÑO DE LOSAS EN UNA DIRECCION  (CONCRETO ARMADO II )
DISEÑO DE LOSAS EN UNA DIRECCION (CONCRETO ARMADO II )
 
Mapa de carreteras de Colombia 2022 INVIAS
Mapa de carreteras de Colombia 2022 INVIASMapa de carreteras de Colombia 2022 INVIAS
Mapa de carreteras de Colombia 2022 INVIAS
 
Los vidrios eléctricos en un automóvil.pptx
Los vidrios eléctricos en un automóvil.pptxLos vidrios eléctricos en un automóvil.pptx
Los vidrios eléctricos en un automóvil.pptx
 
El abecedario constituye el conjunto de grafías que son utilizadas para repre...
El abecedario constituye el conjunto de grafías que son utilizadas para repre...El abecedario constituye el conjunto de grafías que son utilizadas para repre...
El abecedario constituye el conjunto de grafías que son utilizadas para repre...
 
tema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptx
tema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptxtema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptx
tema-6.4-calculo-de-la-potencia-requerida-para-transporte-de-solidos-.pptx
 
Vehiculo para niños con paralisis cerebral
Vehiculo para niños con paralisis cerebralVehiculo para niños con paralisis cerebral
Vehiculo para niños con paralisis cerebral
 
TEMA 11. FLUIDOS-HIDROSTATICA.TEORIApptx
TEMA 11.  FLUIDOS-HIDROSTATICA.TEORIApptxTEMA 11.  FLUIDOS-HIDROSTATICA.TEORIApptx
TEMA 11. FLUIDOS-HIDROSTATICA.TEORIApptx
 
&PLC Ladder.pdf automatización industrial
&PLC Ladder.pdf automatización industrial&PLC Ladder.pdf automatización industrial
&PLC Ladder.pdf automatización industrial
 
Análisis Combinatorio ,EJERCICIOS Y PROBLEMAS RESUELTOS
Análisis Combinatorio ,EJERCICIOS Y PROBLEMAS RESUELTOSAnálisis Combinatorio ,EJERCICIOS Y PROBLEMAS RESUELTOS
Análisis Combinatorio ,EJERCICIOS Y PROBLEMAS RESUELTOS
 
Procesos de Manufactura 1_Introducción a la ciencia de los materiales.pptx
Procesos de Manufactura 1_Introducción a la ciencia de los materiales.pptxProcesos de Manufactura 1_Introducción a la ciencia de los materiales.pptx
Procesos de Manufactura 1_Introducción a la ciencia de los materiales.pptx
 
Joseph juran aportaciones al control de la calidad
Joseph juran aportaciones al control de la calidadJoseph juran aportaciones al control de la calidad
Joseph juran aportaciones al control de la calidad
 
BOTAnica mesias orland role.pptx1 ciclo agropecuaria
BOTAnica mesias orland role.pptx1 ciclo agropecuariaBOTAnica mesias orland role.pptx1 ciclo agropecuaria
BOTAnica mesias orland role.pptx1 ciclo agropecuaria
 
NORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOL
NORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOLNORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOL
NORMATIVA AMERICANA ASME B30.5-2021 ESPAÑOL
 
LA SEÑALES ANALOGICAS Y LAS SEÑALES DIGITALES
LA SEÑALES ANALOGICAS Y LAS SEÑALES DIGITALESLA SEÑALES ANALOGICAS Y LAS SEÑALES DIGITALES
LA SEÑALES ANALOGICAS Y LAS SEÑALES DIGITALES
 

Repaso conceptos básicos de JavaScript

  • 1. Repasando JavaScript - Presentación - Inicio del lenguaje - Tipos de datos y variables - Objetos - Arrays - Funciones - Event y Arguments - Operadores - Otros conceptos básicos
  • 2. Presentación Quique Fdez. Guerra Desarrollador frontend en Beezy @CKGrafico - www.ckgrafico.com
  • 3. Inicio del lenguaje Brendan Eich Netscape Mozilla - Años 90 - Necesidad lenguaje navegador - Mucha prisa Nace un lenguaje sencillo aunque menos robusto respecto otros. Se estandariza como ECMAScript ya vamos por la sexta versión (2014-2015)
  • 4. Tipos de datos PRINCIPALES - String - Number - Boolean COMPUESTOS - Object - Array ESPECIALES - null - undefined Variables - Cualquier cosa puede ser una variable - Todas se definen con var - Su tipo depende directamente de lo que asignamos Enlace recomendado Var Valor Tipo
  • 5. Objetos Objeto: “Everything is an object” (Todo son objetos) JSON: Representación en texto de un objeto JavaScript (JS Object Notation) Los objetos que creemos llamando a ésa función con new tendrán su [[Prototype]] (__proto__) apuntando a la propiedad prototype de la función. @amatiasq Prototype vs __proto__ ¿Qué es? - Una variable compuesta, una entidad, algo existente. - Tiene propiedades - Puede tener métodos
  • 6. Arrays ¿Qué es? - Es un objeto - Que tiene la propiedad length - Por defecto tiene índices numéricos, pero..
  • 7. Funciones Declaración de funciones vs Expresión de funciones Anónimas Anónimas autoejecutables
  • 8. Event y Arguments event: Es un parámetro que siempre se nos pasa al capturar un evento en JavaScript. Contiene un montón de propiedades y métodos interesantes como algunos de los siguientes.
  • 9. Event y Arguments arguments: Un objeto que parece un Array pero no lo es. Contiene todos los parámetros que hemos pasado a la función Se utiliza muchas veces cuando no sabemos que argumentos ni cuantos nos pasan, aunque en ECMA6 seguramente su uso será casi nulo por todas las novedades que trae, p. ej:
  • 11. Otros conceptos básicos Math RegExp Timers básicos Date Closures Cadenas