¿Pasar el objeto como parámetro a la función del constructor y copiar sus propiedades al nuevo objeto?

Question

Tengo un constructor de JavaScript así:

function Box(obj) { 
    this.obj = obj; 
} 

la que quiero pasar un objeto como un parámetro de la siguiente manera:

var box = new Box({prop1: "a", prop2: "b", prop3: "c"}) 

y me da algo como esto:

box.obj.prop1 
box.obj.prop2 
box.obj.prop3 

pero me gustaría que las propiedades estén directamente en el objeto como este:

box.prop1 
box.prop2 
box.prop3 

Sé que podría hacer algo como esto:

function Box(obj) { 
    this.prop1 = obj.prop1; 
    this.prop2 = obj.prop2; 
    this.prop3 = obj.prop3; 
} 

Pero eso no es bueno porque entonces mi constructor tendría que "saber" antes de que los nombres de las propiedades del parámetro del objeto. Lo que me gustaría es poder pasar diferentes objetos como parámetros y asignar sus propiedades directamente como propiedades del nuevo objeto personalizado creado por el constructor para obtener box.propX y no box.obj.propX. Espero ser claro, tal vez estoy midiendo algo muy obvio pero soy novato así que por favor necesito tu ayuda!

Gracias de antemano.

Answer 1

Puede hacer esto. Es probable que haya también una manera de jQuery ...

function Box(obj) { 
    for (var fld in obj) { 
    this[fld] = obj[fld]; 
    } 
} 

Puede incluir una prueba de hasOwnProperty si usted tiene (creo tontamente) extendida objeto

function Box(obj) { 
    for (var fld in obj) { 
    if (obj.hasOwnProperty(fld)) { 
     this[fld] = obj[fld]; 
    } 
    } 
} 

Editar

Ah ¡ja, ja! es jQuery.extend

Por lo tanto, el camino jQuery es:

function Box(obj) { 
    $.extend(this, obj); 
} 

Answer 2

En pocas palabras esto en su constructor

for (var prop in obj) { 
    if (obj.hasOwnProperty(prop)) { 
     this[prop] = obj[prop]; 
    } 
    } 

Answer 3

He aquí un ejemplo con el patrón módulo javascript:

var s, 
NewsWidget = { 

    settings: { 
    numArticles: 5, 
    articleList: $("#article-list"), 
    moreButton: $("#more-button") 
    }, 

    init: function(options) { 
    this.settings = $.extend(this.settings, options); 
    s = this.settings; 
    this.bindUIActions(); 
    }, 

    bindUIActions: function() { 
    s.moreButton.on("click", function() { 
     NewsWidget.getMoreArticles(s.numArticles); 
    }); 
    }, 

    getMoreArticles: function(numToGet) { 
    // $.ajax or something 
    // using numToGet as param 
    } 

}; 

$(function(){ 
    NewsWidget.init({ 
    numArticles: 6 
    }); 

    console.log(s.numArticles); 
});