Cómo crear objetos en JavaScript

Los objetos en javascript son colecciones de pares clave-valor y tenemos varias formas de crearlos.

New Object

Podemos crear una variable de tipo Object y de forma dinámica añadir al objeto propiedades y su valor.

//creamos un objeto book
var bookObject = new Object;

//dinámicamente le añadimos propiedades y su valor
bookObject.title = 'HTML and CSS: Design and Build Websites';
bookObject.author = 'Jon Duckett';

Como los objetos son colecciones de pares clave-valor, también es posible utilizar la notación tradicional de los arrays para definir las propiedades.

//creamos un objeto book
var bookObject = new Object;

//dinámicamente le añadimos propiedades y su valor
bookObject['title'] = 'HTML and CSS: Design and Build Websites';
bookObject['author'] = 'Jon Duckett';

Notación Literal

La notación literal es una forma rápida de crear una instancia de Object, ya que no tenemos que repetir el nombre del objeto cada vez como si ocurre en el caso anterior. No debe confundirse con Notación de Objetos Javascript (JSON), que es un formato de intercambio de datos y un subconjunto de la notación literal de objetos de JavaScript. Cómo ejemplo vamos a ver la creación de un objeto utilizando notación literal y a partir de un JSON donde vamos a ver que su sintaxis es parecida pero no igual.

//creamos un objeto, con notación literal
var bookNL = {title: 'HTML and CSS: Design and Build Websites', author: "Jon Duckett"};

//creamos un objeto a partir de un JSON
var bookJSON = eval( {"title": "HTML and CSS: Design and Build Websites", "author": "Jon Duckett"});

Siempre que sea posible es mejor utilizar JSON.parse para deserializar JSON, es más seguro que eval y se ejecuta más rápidamente.

Función Constructora

Si lo que queremos es tener una firma para poder crear después varias instancias de un mismo tipo de objeto, lo que podemos utilizar son las funciones constructoras. En esta función definimos las propiedades que va a tener el objeto y le asignamos sus valores mediante parámetros. Después haciendo new de la función podemos crear una un objeto.

function Book(title, author) {
  this.title = title;
  this.author = author;
};

var bookC = new Book ('HTML and CSS: Design and Build Websites', 'Jon Duckett');

También podemos crear la función sin parámetros y añadir las propiedades dinámicamente después, de esta forma no tenemos una firma o tipo de objeto pero también es una opción que podemos hacer.

//creamos un objeto con una funcción constructora sin parametros
function BookNoParams() {
};

var bookNoParam = new BookNoParams ();

bookNoParam.title = 'HTML and CSS: Design and Build Websites';
bookNoParam.author = 'Jon Duckett';

Object Create

La función create de Object es una opción más para crear objetos en javascript, donde además podemos asignar en el momento de crear un objeto también cual es su prototipo, en el segundo parámetro podemos especificar las propiedades propias del objeto mediante descriptores de propiedades.

//creamos un objeto con Object.create y asignamos prototipo también
var hardCoverBook = {format: 'HardCover'};

var bookOC = Object.create(hardCoverBook,{
    'title': {value: 'HTML and CSS: Design and Build Websites'},
    'author':{value: 'Jon Duckett'}
})

Libros Relacionados

JavaScript & jQuery: The Missing Manual

• Amazon.com
• Amazon.es
• Amazon.co.uk

JavaScript & JQuery: Interactive Front-End Web Development

• Amazon.com
• Amazon.es
• Amazon.co.uk

Javascript: the Good Parts

• Amazon.com
• Amazon.es
• Amazon.co.uk