SlideShare una empresa de Scribd logo
1 de 24
JavaScript 
Objetos
Objetos 
Un objeto es una colección de nombre/valor. 
Es un tipo de datos compuesto. 
Difiere de los tipos de datos primitivos: String, 
number, boolean. 
Junto con Arrays constituyen los 2 tipos de datos 
más importantes en JavaScript.
Objetos 
Tipo de dato compuesto que almacena múltiples 
valores en una única unidad y que nos permite 
accederla por nombre para extraer o 
almacenar datos.
Crear Objetos 
• Literalmente: lista de pares ‘nombre’:’valor’ 
separados por comas y delimitados por llaves {} 
– var empty = {}; 
– var coordenada = { x:0, y:0}; 
– var circulo = { x:punto.x, y:punto.y, radio:2 }; 
– var profesor = { 
‘nombre’ : ‘Daniel’, 
‘cursos’: arreglo_cursos, 
‘email’: ‘dgrippo@gmail.com’ 
};
Crear Objetos 
• Operador new 
El operador new crea tipo de objetos especiales. 
var fecha = new Date(); 
var arreglo = new Array(); 
var regexp = new RegExp(“javascript”,”i”); 
var rectan = new Rectangulo(20,40);
Propiedades 
• Para acceder a los pares de ‘nombre’:’valor’ 
de los Objetos se utiliza el operador punto . 
objeto_nombre.valor_nombre; 
objeto_nombre = propiedad
Propiedades 
var libro = {}; 
libro.titulo = ‘El Quijote de La Mancha’; 
libro.autor = ‘Miguel de Cervantes Saavedra’; 
libro.paginas = 1096; 
libro.capitulos = new Array(); 
libro.capitulos[0] = new Object(); 
libro.capitulos[0].titulo = ‘Que trata de la….’; 
libro.capitulos[0].paginas = 5;
Propiedades 
• var para declarar el objeto 
• Propiedades solo con el nombre 
• new propiedades objetos 
• var no se usa en las propiedades 
• Se pueden agregar nuevas propiedades en todo 
momento. 
• Se pueden eliminar propiedades en todo momento.
Propiedades 
• Enumerar/listar propiedades de un objeto: 
function DisplayPropertiesName(obj) { 
for (var name in obj) { 
console.log(‘obj.’ + name); 
} 
}
Propiedades 
<!DOCTYPE html> 
<html> 
<head> 
<meta charset= “utf-8”</meta> 
<title>Objetos</title> 
<script language="javascript"> 
var libro = {}; 
libro.titulo = 'El Quijote de La Mancha'; 
libro.autor = 'Miguel de Cervantes Saavedra'; 
libro.paginas = 1096; 
libro.capitulos = new Array(); 
libro.capitulos[0] = new Object(); 
libro.capitulos[0].titulo = 'Que trata de la...'; 
libro.capitulos[0].paginas = 5; 
function DisplayPropertiesName() { 
for (var name in libro) { 
console.log('obj.' + name); 
} 
} 
</script> 
</head> 
<body onload="DisplayPropertiesName()"> 
</body> 
</html>
Propiedades 
• Chequear si existe una propiedad: 
if (“x” in objeto) … 
objeto.x !== undefined 
Nota: “x” literal x
Propiedades 
• Eliminar una propiedad de un objeto: 
delete libro.paginas;
Objetos: Arreglos Asociativos 
En lenguales fuertemente tipados (C/C++, Java), 
los objetos tienen un número fijo de 
propiedades cuyos nombres son definidos 
cuando se programa. 
profesor.nombre; 
profesor.curso; 
Nombre y curso deben estar definidas en el 
programa literalmente.
Objetos: Arreglos Asociativos 
• Para acceder a las propiedades de un objeto 
se utiliza el operador punto: 
– objeto.propiedad // identificador 
• O puedo utilizarse el operador [] como en 
arreglos: 
– objeto[‘propiedad’] // string 
Ambas expresiones son equivalentes.
Objetos: Arreglos Asociativos 
• El operador “.” accede a una propiedad del 
objeto cuyo nombre es un identificador. 
• Los identificadores son literales tipeados en 
un programa JS. 
• No son variables de un tipo de datos en JS. 
• Los literales deben conocerse de antemano.
Objetos: Arreglos Asociativos 
• El operador “[]” accede a una propiedad de un 
arreglo que esta expresada como una cadena. 
• La cadena es una variable tipo string. Un tipo 
de datos en JS. 
• Puede manipularse perfectamente en un 
programa JS. 
• Puede cambiarse dinámicamente en la 
ejecución del programa JS:
Objetos: Arreglos Asociativos 
JavaScript no es fuertemente tipado y por lo 
tanto no se requiere que las propiedades de 
un objeto estén definidas de antemano, uno 
puede crearlas/definirlas en runtime, o sea, 
mientras se ejecuta el script. 
Cómo? Utilizando la notación de Objetos 
como Arreglos Asociativos
Objetos: Arreglos Asociativos 
Conclusión: 
puedo definir dinámicamente propiedades para 
los objetos si utilizo el operador “[]”.
Objetos: Arreglos Asociativos 
var nombre_accion = leer_nombre_accion(); 
var cant_accion = leer_cant_accion(); 
mis_acciones[nombre_accion] = cant_accion; 
var valores = 0; 
for (accion in mis_acciones) { 
valores += valor_accion(accion) * mis_acciones[accion]; 
}
Class: Object 
• Los objetos JS heredan de la Clase Object. 
• RegExp y Date definen sus propios métodos y 
propiedades. 
• Universalmente, todos soportan las 
propiedades y métodos de Object.
Constructor 
• Propiedad 
• Todo objeto JS tiene un constructor. 
• Función que crea al objeto. 
var d = new Date(); 
d.constructor == Date; // true
Constructor 
• La propiedad constructor de un objeto ayuda 
a determinar el tipo de objeto. 
if (( typeof o == “object”) && ( o.constructor == Date)) 
if (( typeof o == “object”) && ( o instaceof Date))
Clases, Constructores, Prototipos 
• Definiendo Clases propias: 
function Rectangulo(w, h) { 
this.ancho = w; 
this.alto = h; 
} 
rect1 = new Rectangulo(10,20); // rect1 = {width:10, height:20} 
- rect1 es un objeto de clase Rectangulo. 
- function Rectangulo es el constructor . 
- Las funciones constructor no devuelven un valor.
Clases, Constructores, Prototipos 
• this hace referencia al objeto en sí mismo, al 
objeto actual.

Más contenido relacionado

La actualidad más candente

Javascript variables and datatypes
Javascript variables and datatypesJavascript variables and datatypes
Javascript variables and datatypes
Varun C M
 
Html heading
Html headingHtml heading
Html heading
saichii27
 

La actualidad más candente (20)

JAVASCRIPT.pdf
JAVASCRIPT.pdfJAVASCRIPT.pdf
JAVASCRIPT.pdf
 
Lab #2: Introduction to Javascript
Lab #2: Introduction to JavascriptLab #2: Introduction to Javascript
Lab #2: Introduction to Javascript
 
Abstraction and Encapsulation
Abstraction and EncapsulationAbstraction and Encapsulation
Abstraction and Encapsulation
 
Java script ppt
Java script pptJava script ppt
Java script ppt
 
Reflection in C#
Reflection in C#Reflection in C#
Reflection in C#
 
Java script -23jan2015
Java script -23jan2015Java script -23jan2015
Java script -23jan2015
 
Javascript variables and datatypes
Javascript variables and datatypesJavascript variables and datatypes
Javascript variables and datatypes
 
Object Oriented Javascript
Object Oriented JavascriptObject Oriented Javascript
Object Oriented Javascript
 
Algebraic Data Types for Data Oriented Programming - From Haskell and Scala t...
Algebraic Data Types forData Oriented Programming - From Haskell and Scala t...Algebraic Data Types forData Oriented Programming - From Haskell and Scala t...
Algebraic Data Types for Data Oriented Programming - From Haskell and Scala t...
 
XML DTD and Schema
XML DTD and SchemaXML DTD and Schema
XML DTD and Schema
 
JavaScript Variables
JavaScript VariablesJavaScript Variables
JavaScript Variables
 
3. Java Script
3. Java Script3. Java Script
3. Java Script
 
JavaScript - Chapter 3 - Introduction
 JavaScript - Chapter 3 - Introduction JavaScript - Chapter 3 - Introduction
JavaScript - Chapter 3 - Introduction
 
Basics of JavaScript
Basics of JavaScriptBasics of JavaScript
Basics of JavaScript
 
Pointers
PointersPointers
Pointers
 
Html heading
Html headingHtml heading
Html heading
 
Htmltag.ppt
Htmltag.pptHtmltag.ppt
Htmltag.ppt
 
JavaScript - An Introduction
JavaScript - An IntroductionJavaScript - An Introduction
JavaScript - An Introduction
 
JavaScript - Chapter 5 - Operators
 JavaScript - Chapter 5 - Operators JavaScript - Chapter 5 - Operators
JavaScript - Chapter 5 - Operators
 
Javascript
JavascriptJavascript
Javascript
 

Similar a Javascript objetos

OOP-JS pjs
OOP-JS pjsOOP-JS pjs
OOP-JS pjs
Jona Val
 
OOP.JAVAS pjs
OOP.JAVAS pjsOOP.JAVAS pjs
OOP.JAVAS pjs
Jona Val
 

Similar a Javascript objetos (20)

Javascript
JavascriptJavascript
Javascript
 
Manejo de los objetos en JavaScript para la programación orientada a objetos
Manejo de los objetos en JavaScript para la programación orientada a objetosManejo de los objetos en JavaScript para la programación orientada a objetos
Manejo de los objetos en JavaScript para la programación orientada a objetos
 
03. Introduccion a JavaScript y JQuery
03. Introduccion a JavaScript y JQuery03. Introduccion a JavaScript y JQuery
03. Introduccion a JavaScript y JQuery
 
Clase 6 objetos de javaScript
Clase 6 objetos de javaScriptClase 6 objetos de javaScript
Clase 6 objetos de javaScript
 
Javascript - 2014
Javascript - 2014Javascript - 2014
Javascript - 2014
 
Javascript
JavascriptJavascript
Javascript
 
Java script estructuras_datos
Java script estructuras_datosJava script estructuras_datos
Java script estructuras_datos
 
Json JavaScript Object Notation
Json JavaScript Object NotationJson JavaScript Object Notation
Json JavaScript Object Notation
 
Javascript continuación
Javascript   continuaciónJavascript   continuación
Javascript continuación
 
clase modelo.pptx
clase modelo.pptxclase modelo.pptx
clase modelo.pptx
 
05. Creando e implementando objetos y métodos
05. Creando e implementando objetos y métodos05. Creando e implementando objetos y métodos
05. Creando e implementando objetos y métodos
 
Clases y Objetos para programar introducción para programar
Clases y Objetos para programar introducción para programarClases y Objetos para programar introducción para programar
Clases y Objetos para programar introducción para programar
 
Tema 4 clases_y_objetos
Tema 4 clases_y_objetosTema 4 clases_y_objetos
Tema 4 clases_y_objetos
 
Poo Java
Poo JavaPoo Java
Poo Java
 
OOP-JS pjs
OOP-JS pjsOOP-JS pjs
OOP-JS pjs
 
OOP.JAVAS pjs
OOP.JAVAS pjsOOP.JAVAS pjs
OOP.JAVAS pjs
 
Programar java
Programar javaProgramar java
Programar java
 
Clase 7 objetos globales de javaScript
Clase 7 objetos globales de javaScriptClase 7 objetos globales de javaScript
Clase 7 objetos globales de javaScript
 
Métodos constructores, método toString()
Métodos constructores, método toString()Métodos constructores, método toString()
Métodos constructores, método toString()
 
Programar java
Programar javaProgramar java
Programar java
 

Último (7)

PPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjj
PPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjjPPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjj
PPT-HISTORIA-6°-ABC.pptxjjjjjjjjjjjjjjjjjjjjjj
 
Guia para el registro en el sitio slideshare.pdf
Guia para el registro en el sitio slideshare.pdfGuia para el registro en el sitio slideshare.pdf
Guia para el registro en el sitio slideshare.pdf
 
12 Clasificacion de las Computadoras.pdf
12 Clasificacion de las Computadoras.pdf12 Clasificacion de las Computadoras.pdf
12 Clasificacion de las Computadoras.pdf
 
Unidad V. Disoluciones quimica de las disoluciones
Unidad V. Disoluciones quimica de las disolucionesUnidad V. Disoluciones quimica de las disoluciones
Unidad V. Disoluciones quimica de las disoluciones
 
TIPOS DE LA PSICOPATOLOGÍA DE LA PERCEPCIÓN.pdf
TIPOS DE LA PSICOPATOLOGÍA DE LA PERCEPCIÓN.pdfTIPOS DE LA PSICOPATOLOGÍA DE LA PERCEPCIÓN.pdf
TIPOS DE LA PSICOPATOLOGÍA DE LA PERCEPCIÓN.pdf
 
02. Mr. Spencer (T.L. Sawn).pdf.libro de un señor
02. Mr. Spencer (T.L. Sawn).pdf.libro de un señor02. Mr. Spencer (T.L. Sawn).pdf.libro de un señor
02. Mr. Spencer (T.L. Sawn).pdf.libro de un señor
 
Las redes sociales en el mercado digital
Las redes sociales en el mercado digitalLas redes sociales en el mercado digital
Las redes sociales en el mercado digital
 

Javascript objetos

  • 2. Objetos Un objeto es una colección de nombre/valor. Es un tipo de datos compuesto. Difiere de los tipos de datos primitivos: String, number, boolean. Junto con Arrays constituyen los 2 tipos de datos más importantes en JavaScript.
  • 3. Objetos Tipo de dato compuesto que almacena múltiples valores en una única unidad y que nos permite accederla por nombre para extraer o almacenar datos.
  • 4. Crear Objetos • Literalmente: lista de pares ‘nombre’:’valor’ separados por comas y delimitados por llaves {} – var empty = {}; – var coordenada = { x:0, y:0}; – var circulo = { x:punto.x, y:punto.y, radio:2 }; – var profesor = { ‘nombre’ : ‘Daniel’, ‘cursos’: arreglo_cursos, ‘email’: ‘dgrippo@gmail.com’ };
  • 5. Crear Objetos • Operador new El operador new crea tipo de objetos especiales. var fecha = new Date(); var arreglo = new Array(); var regexp = new RegExp(“javascript”,”i”); var rectan = new Rectangulo(20,40);
  • 6. Propiedades • Para acceder a los pares de ‘nombre’:’valor’ de los Objetos se utiliza el operador punto . objeto_nombre.valor_nombre; objeto_nombre = propiedad
  • 7. Propiedades var libro = {}; libro.titulo = ‘El Quijote de La Mancha’; libro.autor = ‘Miguel de Cervantes Saavedra’; libro.paginas = 1096; libro.capitulos = new Array(); libro.capitulos[0] = new Object(); libro.capitulos[0].titulo = ‘Que trata de la….’; libro.capitulos[0].paginas = 5;
  • 8. Propiedades • var para declarar el objeto • Propiedades solo con el nombre • new propiedades objetos • var no se usa en las propiedades • Se pueden agregar nuevas propiedades en todo momento. • Se pueden eliminar propiedades en todo momento.
  • 9. Propiedades • Enumerar/listar propiedades de un objeto: function DisplayPropertiesName(obj) { for (var name in obj) { console.log(‘obj.’ + name); } }
  • 10. Propiedades <!DOCTYPE html> <html> <head> <meta charset= “utf-8”</meta> <title>Objetos</title> <script language="javascript"> var libro = {}; libro.titulo = 'El Quijote de La Mancha'; libro.autor = 'Miguel de Cervantes Saavedra'; libro.paginas = 1096; libro.capitulos = new Array(); libro.capitulos[0] = new Object(); libro.capitulos[0].titulo = 'Que trata de la...'; libro.capitulos[0].paginas = 5; function DisplayPropertiesName() { for (var name in libro) { console.log('obj.' + name); } } </script> </head> <body onload="DisplayPropertiesName()"> </body> </html>
  • 11. Propiedades • Chequear si existe una propiedad: if (“x” in objeto) … objeto.x !== undefined Nota: “x” literal x
  • 12. Propiedades • Eliminar una propiedad de un objeto: delete libro.paginas;
  • 13. Objetos: Arreglos Asociativos En lenguales fuertemente tipados (C/C++, Java), los objetos tienen un número fijo de propiedades cuyos nombres son definidos cuando se programa. profesor.nombre; profesor.curso; Nombre y curso deben estar definidas en el programa literalmente.
  • 14. Objetos: Arreglos Asociativos • Para acceder a las propiedades de un objeto se utiliza el operador punto: – objeto.propiedad // identificador • O puedo utilizarse el operador [] como en arreglos: – objeto[‘propiedad’] // string Ambas expresiones son equivalentes.
  • 15. Objetos: Arreglos Asociativos • El operador “.” accede a una propiedad del objeto cuyo nombre es un identificador. • Los identificadores son literales tipeados en un programa JS. • No son variables de un tipo de datos en JS. • Los literales deben conocerse de antemano.
  • 16. Objetos: Arreglos Asociativos • El operador “[]” accede a una propiedad de un arreglo que esta expresada como una cadena. • La cadena es una variable tipo string. Un tipo de datos en JS. • Puede manipularse perfectamente en un programa JS. • Puede cambiarse dinámicamente en la ejecución del programa JS:
  • 17. Objetos: Arreglos Asociativos JavaScript no es fuertemente tipado y por lo tanto no se requiere que las propiedades de un objeto estén definidas de antemano, uno puede crearlas/definirlas en runtime, o sea, mientras se ejecuta el script. Cómo? Utilizando la notación de Objetos como Arreglos Asociativos
  • 18. Objetos: Arreglos Asociativos Conclusión: puedo definir dinámicamente propiedades para los objetos si utilizo el operador “[]”.
  • 19. Objetos: Arreglos Asociativos var nombre_accion = leer_nombre_accion(); var cant_accion = leer_cant_accion(); mis_acciones[nombre_accion] = cant_accion; var valores = 0; for (accion in mis_acciones) { valores += valor_accion(accion) * mis_acciones[accion]; }
  • 20. Class: Object • Los objetos JS heredan de la Clase Object. • RegExp y Date definen sus propios métodos y propiedades. • Universalmente, todos soportan las propiedades y métodos de Object.
  • 21. Constructor • Propiedad • Todo objeto JS tiene un constructor. • Función que crea al objeto. var d = new Date(); d.constructor == Date; // true
  • 22. Constructor • La propiedad constructor de un objeto ayuda a determinar el tipo de objeto. if (( typeof o == “object”) && ( o.constructor == Date)) if (( typeof o == “object”) && ( o instaceof Date))
  • 23. Clases, Constructores, Prototipos • Definiendo Clases propias: function Rectangulo(w, h) { this.ancho = w; this.alto = h; } rect1 = new Rectangulo(10,20); // rect1 = {width:10, height:20} - rect1 es un objeto de clase Rectangulo. - function Rectangulo es el constructor . - Las funciones constructor no devuelven un valor.
  • 24. Clases, Constructores, Prototipos • this hace referencia al objeto en sí mismo, al objeto actual.