Object of JavaScript syntax

Source: Internet
Author: User
Tags shallow copy

today, summarize the focus of the object and the easy-to-understand points of knowledge.  1 There are two main types of JavaScript, basic types (including string,number,boolean,null,undefined) and objects. Whereas functions, arrays, built-in objects (STRING,NUMBER,BOOLEAN,OBJECT,FUNCTION,ARRAY,DATE,REGEXP,ERROR), these are subtypes of objects (also called complex basic types). That is, they are also a type of object, with some extra behavior, such as functions that can be understood as callable objects. Because a function is a seed type of an object, a function can be used as an argument to another function.  The names of these properties are stored inside the object container, just like pointers (technically referred to), pointing to where these values are actually stored. For example:var obj={func:function () {Console.log (this);     }};from a technical standpoint, a function never "belongs" to an object. So, the method in the object is essentially a property name in the object that points to a function. There is no difference between the function returned by the object through property access and other functions, except that this occurs implicitly binding.   2 about copies of functions shallow copy, deep copy:since an instance of an object is stored in heap memory and then manipulated by a reference value, there are two situations when copying: Copy reference and copy instance, which is the difference between a shallow copy and a deep copy. It can be said that a shallow copy copies only one layer of instances, and a deep copy is an instance of copying all layers.  A shallow copy is a copy of a reference, and a copy of the reference is an instance of the same object that affects each other's operations. A shallow copy of the outer source object is a copy instance, and the inner element is a copy reference. That is, the entire object outside must be a copy of a new instance, the element inside, if it is a primitive type of value, it must also be copied value, if it is an array or object type, then copy its reference. Common methods: Array.prototype.slice (), Array.prototype.concat () but both functions are used for arrays. to shallow copy an object, there is var newObj = Object.assign ({}, MyObject), and the extend of jquery can also: var obj = {a:1, arr: [2,3]}; var shallowobj = shallowcopy (obj); function shallowcopy (src) { var dst = {}; For (var prop in Src) { if (Src.hasownproperty (prop)) {Dst[prop] = Src[prop];       }    } return DST; } Example:var a = [{c:1}, {d:2}];var B = A.slice ();Console.log (A = = B);//output False, indicating that the outer array copy is an instancea[0].c = 3;Console.log (B[0].C);//Output 3, indicating that its elements are copied by reference  deep Copy: Re-allocating memory in the heap and creating a new copy of all the properties of the source object to ensure that the reference graph of the deep-copied object does not contain any objects on the original object or object graph, the copied object is completely isolated from the original object and does not affect each otherCommon methods: JSON var newObj = Json.parse (json.stringify (someobj)). You can also use recursive functions.  comprehensive Deep-copy functions:var cloneobj = function (obj) {var str, newobj = Obj.constructor = = = Array? [] : {};if (typeof obj!== ' object ') {return;} else if (window. JSON) {str = json.stringify (obj),//serialized Objectnewobj = Json.parse (str);//Restore} else {For (var i in obj) {Newobj[i] = typeof obj[i] = = = ' object '?cloneobj (Obj[i]): Obj[i];        }    }return newobj;}; Example:var a = {c: {d:1}};var B = $.extend (true, {}, a);Console.log (A = = B);//Output Falsea.c.d = 3;Console.log (B.C.D);//Output 1, no change.   3 Properties and property descriptorsAll properties have 4 attribute descriptors (or data descriptors), respectively, value (data value), writable (writable), enumerable (enumerable), configurable (configurable). to view the property descriptor for a property, you can use:Object.getownpropertydescriptor (myObject, "attribute name");to modify the property descriptor for a property, you can:var myObject = {};Object.defineproperty (MyObject, "a", {Value:2,Writable:true,Configurable:true,enumerable:true} );myobject.a;//2 writable, when set to False, indicates not writable, the value of the property cannot be changed. enumerable, when set to false, the property cannot appear in an object's property enumeration, such as the for...in loop that does not traverse this property. configurable, when set to false, the property becomes non-configurable, so it is not possible to change back, that is, configurable to false is a one-way operation. Also, when set to False, deleting this property with delete is not valid.   4 getter and setter of attributesgetter and setter are hidden functions that are called when the property value is obtained and the property value is set. Therefore, you can override the default action for a single property with getter and setter. you can have two formats to modify the default action for a property:var myObject = {//Define a getter for aget A () {return 2;     }};or:Object.defineproperty (MyObject,//target object"B",//property name{//Descriptorget:function () {return THIS.A * 2},//Make sure B appears in the object's property listenumerable:true     }); In general, when setting property values for a property, the getter and setter are paired:var myObject = {//Define a getter for aget A () {return this._a_;     },//Define a setter for aset A (val) {This._a_ = val * 2;     }};myobject.a = 2;myobject.a;//4   Welcome to communicate with each other and learn from each other. Front-end development QQ Group: 711357426                

Object of JavaScript syntax

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.