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

What are the three methods of creating JavaScript objects?

2025-04-01 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

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

This article is to share with you what the three methods of creating JavaScript objects are, the editor thinks it is very practical, so I share it with you to learn. I hope you can get something after reading this article. Let's take a look at it with the editor.

Foreword:

In JavaScript, an object is an unordered set of attribute names and values, which can be created by object literals, the new keyword, and the Object.create () function.

1. Object literals let obj = {} / / empty object let obj2 = {ahel 1, bvav 2} let obj3 = {"hel": "wold"} / / if there is a space for the attribute name, you can use the string literal quantity as the attribute name 2 and new keyword to create the object.

Call the constructor after the new keyword to create a new object

Let o = new Object (); / / built-in constructor let m = new Math (); let a = new Array (); let d = new Date (); function Person () {/ / Custom constructor} let person = new Person () 3, create objects using Object.create ()

Let o = Object.create ({x o.x+o.y 1, y v v 2}); console.log (o.x+o.y) / / 3

The new object o will inherit {x _ v _ 1, y _ v _ 2}, the attributes x and y are called inheritance properties, and if the parameter passed in is null, this object will not inherit any objects. The inherited object is also called "prototype".

Object.create (null) 4. Use the extension operator:...

ES2018 added an extension operator... to copy the existing object properties to the new object.

Let foo = {XRV 1, y let zoo 2} let bar = {z let zoo 3} let zoo = {... foo,... bar} console.log (zoo) / / {x v v 1, y v v, z v 3}

A few points to pay attention to:

The extension operator only extends the object's own properties, and inheriting properties do not support extension.

If the extended object and the extended object have an attribute with the same name, the value of the property is determined by the subsequent object

5. Use the Object.assign () method

Assign can copy the properties of one object to another, assign receives two or more parameters, the first parameter is the target object, the second and subsequent parameters are the source object, the function will copy the properties of the source object to the target object and return the target object.

Let foo = {x let zoo 1, y v 2} let bar = {z v 3} let zoo = {} let obj= Object.assign (zoo, foo, bar) console.log (zoo) / / {x v v 1, y v v 2, z v v 3} console.log (obj===zoo) / / true

Add two new object features in ES6

6. Abbreviated attributes

If you want to create an object composed of multiple variable names and corresponding values, you need to build the object like the traditional object literal syntax.

Let Xero1, y = 2Tritlet o = {XRO x, YRV y} console.log (o) / / {XRO 1, YRO 2}

After ES6, attributes can be abbreviated directly, omitting semicolons and attribute names.

Let O2 = {x, y} console.log (O2) / / {XRO 1, YRV 2} 7, abbreviated method

When defining a method in an object, ES6 used to need to define a method just like a normal property, using a function expression to define a method.

Let point= {x return this.x*this.y 1, y v v 2, area: function () {return this.x*this.y}} console.log (point.area ()) / / 2

After ES6, you can omit the colon and the function keyword and define the object in a simple way.

Let point2= {return this.x*this.y 1, YRV 2, area () {return this.x*this.y}} console.log (point2.area ()) / / 2 above are the three methods for creating JavaScript objects. The editor believes that there are some knowledge points that we may see or use in our daily work. I hope you can learn more from this article. For more details, please follow the industry information channel.

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