Talking about the use _javascript skill of the object in JS

Source: Internet
Author: User
Tags object object object serialization hasownproperty

Simply record the use of objects in JavaScript

First, create objects

Create an empty object
  var o={};
  Create an object that contains two attributes, X, y
  var o2={x:12,y: ' ', Name: ' JS '};
  The value of the Author property in this object is still an object
  var o3={x:12,author:{name: ' JS ', age:23,address: ' China '};
  Create an empty object with the same as {}
  var o4=new object ();
  Add Name attribute to object
  o4.name= ' JS '

There are two ways to create objects, one is literal, the other is using new to create objects, and the object behind new is called constructors.

Ii. Access to Objects

From the above we can see that we have added an attribute name to the O4, using the point number method, which is the object name. Property name, which is one way of accessing. There are two ways to access property values in an object, the first is to use a dot (.) and the second is to use an array (object name [property name]).

Create an empty object
  var o={};
  Create an object that contains two attributes, X, y
  var o2={x:12,y: ' ', Name: ' JS '};
  The value of the Author property in this object is still an object
  var o3={x:12,author:{name: ' JS ', age:23,address: ' China '};
  Create an empty object with the same as {}
  var o4=new object ();
  Add the name attribute to
  an object o4.name= ' JS '
  /** access the property value of the object
  ///1, using the dot number method
  var x=o2.x;//12
  var Authorofname=o3.author.name;//js
  var name=o4.name;//js
  
  //2, using arrays in the way
  var x2=o2[' x '];//12
  var authorofname2=o3[' author ' [' Name '];//js
  var name2=o4[' name '];//js

Using dots to access property values in an object is better understood, but using arrays is not too well understood, in JavaScript, all objects are associative arrays, so the associated data is the way it looks like an array of accesses, This is simply not an index used but a string index, which is called an associative array.

The above Access object property values are in the case of the object property name, if you do not know the object's property value? You can use the For/in loop to iterate through the values in the object,

Create an object that contains two attributes, X, y, name
  var o2={x:12,y: ' ', Name: ' JS '};
  For (p in O2) {
    var property=p;
    var value=o2[p];
    Console.log (property);
    Console.log (value);
  }

Printing results are:

x
y
name
JS

You can see that there are three properties, all of which have their values printed.

If the object is more complex can be added some judgments, to determine whether there is a property, then how to determine whether an object contains a property, because objects inherit object, in object has a hasOwnProperty () method, to determine whether there is a property in the object, The return value is a Boolean type (Boolean), noting that this method only determines whether an object's own properties exist and does not judge the properties inherited by the object.

Create an object that contains two attributes, X, y, name
  var o2={x:12,y: ' ', Name: ' JS '};
  var b=o2.hasownproperty (' name ')//true
  var b2=o2.hasownproperty (' age ')//false

Third, add, delete properties

At the beginning we added a name attribute to the Object O4, which was added in fact to assign the property to the attribute, and to add properties to the object by using an associative array.

Create an object that contains two attributes, X, y, name
  var o2={x:12,y: ' ', Name: ' JS '};
  Deletes the Name property delete
  o2.name;
  var b=o2.hasownproperty (' name ')//false
  //New Name property
  o2[' name ']= ' JavaScript ';
  Because the Name property already exists, this is to assign a value to name
  o2.name= ' JS ';
  var b3=o2.hasownproperty (' name ');//true

Above, the Name property of the object O2 is deleted, and then the Name property is added using the associative array, and then the Name property is assigned a value by using the dot number method.

Iv. transformation between objects and strings

In ECMAScript5, the conversion between objects and strings is built in, and most mainstream browsers now support ECMASCRIPT5, which can be used if it is not supported to download the Json2.js class library from the Internet.

The transformation between objects and strings is called object serialization, which converts the state of an object to a string or converts a string to an object, which uses JSON as the data Interchange format, and the full name of the JSON is the JavaScript Object notation.

Convert an object to a string using json.stringify (); Convert string to object using Json.parse (),

Defines an object
  var o={name: ' JavaScript ', age:24};
  This way in the conversion to the object is an error, you must use the following way
  //var str= "{name: ' JavaScript ', age:24}";
  Correct definition object string
  var str= ' {' name ': ' JavaScript ', ' age ': ';
  Converts the object to a string
  var str2=json.stringify (o);
  Console.log (' str2: ' +str2+ ', type: ' + (typeof str2));//str2:{"name": "JavaScript", "Age": 24}, type: string
  //convert String to Object
  var o2=json.parse (str);
  Console.log (' O2: ' +o2+ ', type: ' + (typeof O2));//o2:[object object], type: Object

The above implements the transformation between objects and strings.

Above this article on the use of JS object is small series to share all the content, hope to give you a reference, but also hope that we support the cloud-dwelling community.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.