Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to use ES6Object.assign ()

2025-03-26 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/02 Report--

This article mainly introduces how to use ES6Object.assign (), has a certain reference value, interested friends can refer to, I hope you can learn a lot after reading this article, the following let the editor take you to understand it.

Basic usage of 1.Object.assign ():

The Object.assign method is used to copy all enumerable properties of the source object (source) to the target object (target). It requires at least two objects as parameters, the first parameter is the target object, and the subsequent parameters are source objects.

Let targetObj1 = {a: 1}; let sourceObj1 = {b: 1}; let sourceObj11 = {c: 3}; Object.assign (targetObj1, sourceObj1, sourceObj11); console.log (targetObj1)

Note: if the target object has an attribute with the same name as the source object, or if more than one source object has an attribute with the same name, the following properties override the previous properties.

Let targetObj1 = {a: 1, b: 2}; let sourceObj1 = {b: 1}; let sourceObj11 = {c: 3}; Object.assign (targetObj1, sourceObj1, sourceObj11); console.log (targetObj1)

If there is only one parameter, Object.assign returns that parameter directly.

Let targetObj1 = {a: 4} Object.assign (targetObj1); console.log (targetObj1)

If the parameter is not an object, it is converted to an object and then returned.

Console.log (typeof (Object.assign (2)

Because undefined and null cannot be converted to objects, an error will be reported if they are used as parameters.

Console.log (typeof (Object.assign (null); console.log (typeof (Object.assign (underfind)

Note: if the non-object parameter appears at the location of the source object (that is, not the first parameter), the processing rules are different. First, these parameters are converted to objects, and if they cannot be converted to objects, they are skipped. This means that if undefined and null are not in the first parameter, no error will be reported. Other types of values (that is, numeric, string, and Boolean values) are not in the first parameter and will not report an error. However, none of the values have any effect except that the string is copied into the target object as an array.

Object.assign copies only its own properties, and attributes that cannot be enumerated (enumerable is false) and inherited properties are not copied.

Let obj1 = Object.assign ({dwb: 'zjl'}, Object.defineProperty ({},' zmf', {enumerable: false,value: 'zmf'}) console.log (obj1); let obj2 = Object.assign ({dwb:' zjl'}, Object.defineProperty ({}, 'zmf', {enumerable: true,value:' zmf'}) console.log (obj2))

For nested objects, Object.assign handles it by replacing, not adding.

Var target = {a: {b: 'hello', d:' e'}} var source = {a: {b: 'hello'}} Object.assign (target, source)

In the above code, the a property of the target object is completely replaced by the a property of the source object, instead of the result of {a: {b: 'hello', d:' e'}}. This is usually not what developers want, and you need to be very careful. There are some libraries that provide customized versions of Object.assign (such as the _ .defaultsDeep method of Lodash) to solve the problem of deep copying.

Note that Object.assign can be used to work with arrays, but treats arrays as objects.

Console.log (Object.assign ([1,2,3], [4,5]))

Where 4 covers 1 and 5 overrides 2, because they are in the same position in the array, so the corresponding position is overwritten.

The Object.assign method implements a shallow copy, not a deep copy. That is, if the value of a property of the source object is an object, then the copy of the target object gets a reference to that object.

Var object1 = {a: {b: 1}}; var object2 = Object.assign ({}, object1); object1.a.b = 2 x console.log (object2.a.b)

two。 Use

2.1 add attributes to the object

2.2 add methods to objects

2.3 Clone object

Function copyFnc (origin) {return Object.assign ({}, origin)} var sur = {a: 1, b: 2}; console.log (copyFnc (sur))

The above code copies the original object to an empty object and gets a clone of the original object.

However, by cloning in this way, you can only clone the values of the original object itself, not the values it inherits. If you want to maintain the inheritance chain, you can use the following code.

Function clone (origin) {let originProto = Object.getPrototypeOf (origin); return Object.assign (Object.create (originProto), origin);}

In JS, the subclass uses Object.getPrototypeOf to call the parent class method to get the prototype of the object.

2.4 merge multiple objects

/ / merge multiple objects into an object const merge = (target,... sources) = > Object.assign (target,.. sources); / / merge multiple objects into a new object const merge = (... sources) = > Object.assign ({},... sources)

2.5 specify default values for attributes

Const DEFAULTS = {logLevel: 0Jing outputFormat: 'html'}; function processContent (options) {let options = Object.assign ({}, DEFAULTS, options);}

Thank you for reading this article carefully. I hope the article "how to use ES6Object.assign ()" shared by the editor will be helpful to everyone. At the same time, I also hope that you will support us and pay attention to the industry information channel. More related knowledge is waiting for you to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report