Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

Brian
Brian

Posted on

     

Alternative to the spread operator

Alternative to the spread operator.

TLDR: Object.assign(object, object)

I was doing some work on a serverless function and I didn't have ES6 support so I had to figure out how to supplement the spread operator. Below is an example of the spread operator with some objects that hold some food.

const moreFood = {'pizza': '🍕', 'steak': '🥩',}const food = { 'chocolate': '🍫', 'icecream': '🍦', 'pizza': 'pizza', ...moreFood }//results{'chocolate': '🍫', 'icecream': '🍦','pizza': '🍕','steak': '🥩',}

One of the alternatives to the spread operator is the Object.assign function. Here is the same function using the object.assign function.

const moreFood = {'pizza': '🍕', 'steak': '🥩',}const food = { 'chocolate': '🍫', 'icecream': '🍦', 'pizza': 'pizza' }Object.assign(food, moreFood)//results{'chocolate': '🍫', 'icecream': '🍦','pizza': '🍕','steak': '🥩',}

Side note:

If there is a duplicate key like in the example with pizza both the spread operator and the Object.assign function both will take what the right objects says pizza is.

Top comments(6)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss
CollapseExpand
 
nmhillusion profile image
nmhillusion
  • Joined

good idea :)
if we want to keep the old value ofpizza, how we do?

CollapseExpand
 
brianmcoates profile image
Brian
Jesus Follower, Husband, Web developer, and gamer at heart. I love God, Family, and Technology
  • Location
    Oklahoma
  • Work
    Web Developer at Life.Church
  • Joined

If you just want the original value of pizza you just put the object to the right so in

Object.assign(moreFood, food)

and with the spread operator you can

{...moreFood, food}

CollapseExpand
 
rhymes profile image
rhymes
Such software as dreams are made on.I mostly rant about performance, unnecessary complexity, privacy and data collection.
  • Joined
constnewFood=Object.assign({},food,moreFood)

this will keep both intact and create a new object with the merged keys and values

CollapseExpand
 
brianmcoates profile image
Brian
Jesus Follower, Husband, Web developer, and gamer at heart. I love God, Family, and Technology
  • Location
    Oklahoma
  • Work
    Web Developer at Life.Church
  • Joined

Love it thank you! Is there is there a way to do that with the spread operator as well?

Thread Thread
 
rhymes profile image
rhymes
Such software as dreams are made on.I mostly rant about performance, unnecessary complexity, privacy and data collection.
  • Joined

Yes:

constnewFood={...food,...moreFood};
CollapseExpand
 
lukepochron profile image
Luke
full stack web developer in training
  • Location
    London, UK
  • Work
    Full stack in training
  • Joined

Nice post but most of us are here probably because IE doesn't support spread operators. Sadly it doesn't support Assign() either.

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

Jesus Follower, Husband, Web developer, and gamer at heart. I love God, Family, and Technology
  • Location
    Oklahoma
  • Work
    Web Developer at Life.Church
  • Joined

More fromBrian

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp