CODEWITHSUNDEEP
javascript
Trung Tran
Trung Tran

Reputation: 13771

How can I append an object to another object?

Can someone help me append an object another object? For example, I have the original object:

var object = {
    { product_code: '55993',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '300.00',
      quantity: '3' 
    }
}

and I want to append:

    { product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    }

So in the end, object looks like:

object = {
    { product_code: '55993',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '300.00',
      quantity: '3' 
    },
    { product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    }
}

How do I do that?

Upvotes: 11

Views: 28988

Answers (7)

mehnet ali
mehnet ali

Reputation: 133

if your fields is difference:

<body>

<p id="p1">This is a paragraph.</p>

<script>
var primaryValue = {"id": "4"};

var obj = new Object();
obj = Object.assign(primaryValue,obj);
obj['name'] = 'sara';
obj['age'] = '32';

document.getElementById("p1").innerHTML = obj['id'] + ", " + obj['name'] + ", " + obj['age'];
</script>

</body>

and output is:

4, sara, 32

Upvotes: 0

CeDeROM
CeDeROM

Reputation: 640

Use Object.assign( object, tail ) or { ...object, ...tail } as described in [1]:

When you want to merge a var that is mutable assign or ... will look like this:

var object = {
      product_code: '55993',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '300.00',
      quantity: '3' 
};

object = Object.assign( object, { product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    }
);

or

object = { ...object, ...{ product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    }
};

If you want to merge two const immutable object you need to assign or ... to anew object:

const object = {
      product_code: '55993',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '300.00',
      quantity: '3' 
};

const tail = {
      product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
};

const result = Object.assign( object, tail );

or

const result = { ...object, ...tail };

Note that you can chain assign / ... with more parameters. You can also use that to join { {xx} } objects accordingly (assuming they are valid object already).

This is something I was looking for to extend my datamodels with some base root parameters list but I did not want to use class :-)

[1] https://attacomsian.com/blog/javascript-merge-objects

Upvotes: 2

latitov
latitov

Reputation: 481

I vote up CaptainAdmin answer, of using spread syntax. Very useful, and good to know it is there. However, in this case, it'd be both more convenient and correct to use something like:

var o1 = {
    product_name: "Super One",
};

var o2 = {
    quantity: 50,
};

specializeWith(o1, o2);

Where:

function specialize_with(o, S) { for (var prop in S) { o[prop] = S[prop]; } }

Then your o1 will be:

var o1 = {
    product_name: "Super One",
    quantity: 50,
};

Unfortunately, looking closely at the original question, I see that's not what was asked in the first place. The array of objects was needed, not an inheritance or specialization or extension. Still, leaving it here.

See also https://github.com/latitov/OOP_MI_Ct_oPlus_in_JS, the specializeWith() is from there.

Again, please look at https://github.com/latitov/OOP_MI_Ct_oPlus_in_JS.

Upvotes: 0

CaptainZero
CaptainZero

Reputation: 1501

You can use ES6 spread operator to append object.

object = { ...object, 
...{ product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    }
}

Upvotes: 15

Mitul
Mitul

Reputation: 3437

There are two ways but the first one is the best way you can retrieve data easily using for loop

var object1 = { product_code: '55993',
    brand: 'Phillips66',
    category: 'LUBES AND GREASES',
    description: 'cuatro cinco seis',
    price: '300.00',
    quantity: '3'
};

var object2 ={ product_code: '55993',
    brand: 'Phillips66',
    category: 'LUBES AND GREASES',
    description: 'cuatro cinco seis',
    price: '300.00',
    quantity: '3'
}

1) create one array variable and push all your objects in that array

var myObjectList = [];
myObjectList.push(object1);
myObjectList.push(object2);

2) You can create the objects and assign value to that object

var myObjectList = {object1: object1, object2 : object2};

Upvotes: 1

T.J. Crowder
T.J. Crowder

Reputation: 1075895

You have a couple of options:

  1. Define a property name under which to store the second object, which won't give you a structure like the one you've shown at the end of your question.

  2. Use an array, which will give you something very nearly like what you have at the end of your question:

    [
    { product_code: '55993',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '300.00',
      quantity: '3' 
    },
    { product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    }
]

    Note the [ and ] instead of { and } at the outermost level.

If you have an object:

var object1 = {foo: "bar"};

and another object:

var object2 = {biz: "baz"};

Then option #1 looks like this:

object1.anyNameHere = object2;

...which will give you:

{
   foo: "bar",
   anyNameHere: {
       biz: "baz"
   }
}

Or option #2:

var a = [object1, object2];

...which will give you:

[
    {
        foo: "bar"
    },
    {
        biz: "baz"
    }
]

Upvotes: 3

Lean
Lean

Reputation: 91

Your object variable should be an array, not an object:

    var object = [
        { product_code: '55993',
          brand: 'Phillips66',
          category: 'LUBES AND GREASES',
          description: 'cuatro cinco seis',
          price: '300.00',
          quantity: '3' 
        }
    ]

Then you can add other objects into it:

object.push({ product_code: '90210',
      brand: 'Phillips66',
      category: 'LUBES AND GREASES',
      description: 'cuatro cinco seis',
      price: '500.00',
      quantity: '5' 
    });

Hope it helps.

Upvotes: 9

Related Questions