Başka bir nesnede nesne özellikleri nasıl çoğaltılır?

Nesne verildiğinde:

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

nasıl başka bir nesne ( secondObject) içindeki özellikleri kopyalayabilirsiniz :

var secondObject = {
    key1 : 'value1',
    key2 : 'value2',
    key3 : 'value3',
    key4 : 'value4'
};

Bir referans kullanarak firstObject? Bunun gibi bir şey:

var secondObject = {
    firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

(Bu işe yaramaz ... Ben sadece kodu nasıl yapılandırmak istiyorum büyük satırlarda göstermek için koydu).

Bir çözüm mümkün mü olmadan herhangi JavaScript çerçevelerini kullanarak?

for(var k in firstObject) secondObject[k]=firstObject[k];

@ Bardzuśny'nin cevabından bir ipucu alan ES6, yerel bir çözüm sundu: Object.assign()işlev!

Kullanımı basit:

Object.assign(secondObject, firstObject);

Bu kadar!

Şu anda destek açıkça zayıf; Chrome (45+) ve Opera (32+) 'kutudan çıktığı anda yalnızca Firefox (34+) onu destekliyor,' deneysel bayrağın 'ayarlanmasını gerektiriyor.

Destek, Chrome, Firefox, Opera, Safari ve Edge'in en son sürümleriyle destekleniyor (IE'nin özellikle desteği yok.) Babil ve Traceur gibi transpiller de mevcut. Daha fazla ayrıntı için buraya bakın.

Per ES6 - Spread sözdizimi :

Sadece şunu kullanabilirsiniz:

const thirdObject = {
   ...firstObject,
   ...secondObject   
}

Bu, bu nesneleri referans olarak geçirme problemlerini önler.

Buna ek olarak, derin yuvalama olan nesnelerle ilgilenir.

İlk nesnenin özelliklerini gözden geçirin ve ikinci nesneye şu şekilde atayın:

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    key3 : 'value3',
    key4 : 'value4'
};

for (var prop in firstObject) {
    if (firstObject.hasOwnProperty(prop)) {
        secondObject[prop] = firstObject[prop];
    }
}

for- indöngü yeterli değildir; ihtiyacınız var hasOwnProperty. Nedeninin ayrıntılı açıklaması için http://bonsaiden.github.com/JavaScript-Garden/#object.forinloop adresine bakın .

Burada büyücü oynamak, çünkü ES5 Object.keys()bizi tüm bu .hasOwnProperty()kontrollerden kurtarma potansiyeli ile getirdi .

Object.keys(firstObject).forEach(function(key) {
  secondObject[key] = firstObject[key];
});

Veya, bir işleve sarmak (lodash'ın sınırlı "kopyası" _.assign()):

function assign(object, source) {
  Object.keys(source).forEach(function(key) {
    object[key] = source[key];
  });
}

assign(secondObject, firstObject); // assign firstObject properties to secondObject

Object.keys()nispeten yeni bir yöntem, en önemlisi: IE <9 kullanılabilir değil. Aynı aslında .forEach()düzenli fordöngü yerine kullanılan dizi yöntemi için de geçerli .

Neyse ki, bu eski tarayıcılar için birçok ES5 özelliğini (bu ikisi dahil) çoklu dolduracak es5-shim var .

(Tamamen havalı, yeni dil özelliklerini kullanmaktan uzak durmak yerine çoklu dolgular için kullanıyorum.)

İnsanların hasOwnProperty ve gerçek nesne kontrolü ile derin bir kopyalama yöntemi bulabilmesi için necro'ing:

var extend = function (original, context, key) {
  for (key in context)
    if (context.hasOwnProperty(key))
      if (Object.prototype.toString.call(context[key]) === '[object Object]')
        original[key] = extend(original[key] || {}, context[key]);
      else
        original[key] = context[key];
  return original;
};

Nesneleri birleştirmek için Object.assign kullanılabilir . Ortak mülkü sağdan sola birleştirir ve geçersiz kılar, yani soldaki aynı özellik sağ tarafından geçersiz kılınır.

Ve kaynak nesnelerin mutasyona uğramasını önlemek için ilk önce boş bir nesne sağlamak önemlidir . Kaynak nesneler Object.assign()yeni bir nesne döndürdüğü için temiz bırakılmalıdır .

Bu yardımcı olur umarım!

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    key3 : 'value3',
    key4 : 'value4'
};

var finalObject = Object.assign({}, firstObject, secondObject)

console.log(finalObject)

İyileştirilmesi kingPuppy fikri ve OP fikri (sığ kopya) - Sadece OP "Örneğin" için 3 nokta ekleyin :)

var secondObject = {
    ...firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

var firstObject = {
    key1 : 'value1',
    key2 : 'value2'
};

var secondObject = {
    ...firstObject,
    key3 : 'value3',
    key4 : 'value4'
};

console.log(secondObject);

Bu, burada test edilmiş olmalı .

var secondObject = {
    firstObject: JSON.parse(JSON.stringify(firstObject)),
    key3 : 'value3',
    key4 : 'value4'
};

Not : bu, firstObject
Not 2'nin yöntemlerini kopyalamaz : eski tarayıcılarda kullanım için bir json ayrıştırıcıya ihtiyacınız olacaktır
Not 3 : referans olarak atama, özellikle firstObjectyöntemler içeriyorsa , uygulanabilir bir seçenektir . Verilen jsfiddle örneğini buna göre ayarlayın

Ne yazık ki, böyle bir nesnede bir değişkene başvuru yapamazsınız. Ancak, nesnenin değerlerini başka bir nesneye kopyalayan bir işlev yapabilirsiniz.

function extend( obj1, obj2 ) {
    for ( var i in obj2 ) {
        obj1[i] = obj2[i];
    }
    return obj1;
}

var firstObject = {
    key1: "value1",
    key2: "value2"
};

var secondObject = extend({
    key3: "value3",
    key4: "value4"
}, firstObject );

Eğer kapmak istiyorsa sadece ikinci objenin mevcut özelliklerini kullanabileceğiniz Object.keysiki yöntem yapabilirsiniz birinci nesnenin özelliklerini kapmak için:

A.) map yan etkileri kullanarak birinci nesnenin özelliklerini ikinci nesneye atamak için:

var a = {a:100, b:9000, c:300};
var b = {b:-1};

Object.keys(a).map(function(key, index) {
    if (typeof b[key] !== 'undefined') {
        console.log(key);
        b[key] = a[key];    
    }
});

B.) veya reduceyeni bir nesne oluşturmak ve ikinci nesneye atamak. Bu yöntemin , ikinci nesnenin, ilk nesneyle eşleşmeyen özellikten önce sahip olabileceği diğer özellikleri değiştirdiğini unutmayın:

var a = {a:100, b:9000, c:300};
var b = {b:-1, d:-1}; // d will be gone

b = Object.keys(a).reduce(function(result, current) {
    if (typeof b[current] !== 'undefined') {
        result[current] = a[current];   
    }
    return result;
}, {});

Özellik yayılım gösterimini kullanın. ES2018'de eklenmiştir (diziler / yinelenebilirler için yayılma daha erkendi, ES2015), {... firstObject} tüm numaralandırılabilir özellikleri ayrık özellikler olarak yayar.

let secondObject = {
      ...firstObject,
      key3 : 'value3',
      key4 : 'value4'
    }

Oldukça firstObject secondObject prototip olarak kullanmak ve özellik tanımlayıcı eklemek:

var secondObject = Object.create(firstObject, {
      key3: {value: "value3", writable: true, configurable: true, enumerable: true},
      key4: {value: "value4", writable: true, configurable: true, enumerable: true}
      });

Kesinlikle tek astarlı değil, ama size daha fazla kontrol sağlıyor. Özellik tanımlayıcılarıyla ilgileniyorsanız, bu makaleyi okumanızı öneririz: http://patrickdelancy.com/2012/09/property-descriptors-in-javascript/#comment-2062 ve MDN sayfası https: //developer.mozilla. org / tr-tR / docs / Web / JavaScript / Referans / Global_Objects / Nesne oluşturmak /

Ayrıca sadece değerler atayabilir ve tanımlayıcıları atlayabilir ve biraz daha kısa yapabilirsiniz:

var secondObject = Object.create(firstObject, {
      key3: {value: "value3"}
      key4: {value: "value4"}
  });

Uyumluluk: ECMAScript 5, yani IE9 +

var firstObject = {
     key1: "value1",
     key2: "value2"
};

var secondObject = {
     key3: "value3",
     key4: "value4"
     copy: function(firstObject){
           this.key1 = firstObject.key1;
           this.key2 = firstObject.key2;
     }
 };

Follwing yöntemini kullanmak özellikleri kopyalar

secondObject.copy(firstObject)

Javascript için çok yeniyim, ama bu işe yaradı. Biraz fazla sanırım, ama işe yarıyor.