Why Object.assign works with an array?

ぐ巨炮叔叔 提交于 2019-12-25 03:22:56

问题


So I was reading an article to clone an object and array. All of them mentioned that Object.assign() can be used to copy an object but no one mentioned that Object.assign() will also work to shallow copy an array.

Could anybody explain how it works?

Code to Explain is in JS Bin : https://jsbin.com/kaqocixize/edit?js,console


回答1:


JS is prototype-oriented language. That means that every construct in JS is in reality - an object! :)

Objects differ in some metadata, e.g. specific properties. These are usually readonly and there is no easy way of overriding them (e.g. length, name, arguments and many more).

In your case, array can be interpreted as a specific object where length relates to number of array elements and each array element relates to property on the object that uses index as a key:

const array = {
  '0': 'a',
  '1': 'b',
  '2': 'c',
  'length': 3,
};

(that's simplification, as we're still missing generator for iterating over that is usually kept as a Symbol).

The way JS hides these special properties is usually by using Symbols - more on them here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Symbol

Because of prototypic nature of JS, however, when using Object.assign, Array is treated as an object and hence, by doing:

Object.assign([],a,['x']); 

you're actually creating a new array AND overriding element 0 with 'x'. That's how this line can be interpreted in object world:

Object.assign({}, {
  '0': 'a',
  '1': 'b',
  '2': 'c',
}, {
  '0': 'x'
});

And that's how x landed as the first index of a new array!

There are, however, some differences in Array implementation between ES5 and ES6 - more on that here: http://2ality.com/2014/05/es6-array-methods.html




回答2:


Arrays are indeed objects in Javascript with a few differences and traits of their own, so Object.assign is able to account for and handle this. Here's another question with some pretty solid answers that should help make sense of this for you.

Are Javascript arrays primitives? Strings? Objects?




回答3:


As the comment from Mark Meyer says, arrays are objects.

Specifically an array is an object whose keys are strings representing small integers. There is some magic to handle how length is updated as values are added or removed and how values are removed as length is updated. Other than that, it's an Object at its core.

So in this code (please include such code in your question rather than pointing to an external site):

var a = ['a','b','c']; 
var b = Object.assign([], a, ['x']);

all that happens is that it takes the initial value passed, [] and then adds the properties from a onto it, the properties whose keys are '0', '1', and '2', with respective values of 'a', 'b', and 'c', then adds the properties from ['x'] onto it, the only one being key '0' with value 'x', yielding ['x', 'b', 'c'].

So it's simple object handling.

Note that if you did

Object.assign([], a, [, 'x']);

you would get ['a', 'x', 'c'], and if you did

Object.assign([], a, [, , , , 'x']);

you would get ["a", "b", "c", undefined, "x"]



来源:https://stackoverflow.com/questions/53342174/why-object-assign-works-with-an-array

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!