Techniques and traps for Javascript objects and javascript Object traps

Techniques and traps for Javascript objects and javascript Object traps
Method 1

Create directly

var obj = {            name: "mike",            age: 10        }

Method 2

Create with new

var ob = new Date();

Method 3

ECMAScript5 has a new method Object. create ()

In fact, this method inherits an object.

var obj = {            name: "mike",            age: 10        };        var newobj = Object.create(obj);        console.log(newobj.name);

Tips and traps

1

var a = {            name: "mike",            name: "john"        }        console.log(a["name"]);

Accidentally writing the attribute name as the same result is john. That is to say, when the attribute name is the same, an error will be reported when the use strict command is started.

2

var a = {};        a.x = 1;        var p = Object.create(a);        p.y = 2;        console.log(p.x);

When the properties of the object you access are not available, the object will be searched up along the prototype chain,

3

var a = {};        a.x = 1;        var p = Object.create(a);        p.y = 2;        console.log("x" in p); //true

Is there a property in an object that is inherited?

4

var a = {};        a.x = 1;        var p = Object.create(a);        p.y = 2;        console.log("x" in p); //true        console.log(p.hasOwnProperty("x")); //false

Check attributes

5

var a = {            x:1,            get getx() {return this.x;},            set setx(arg) {                return this.x = arg;            }        }        console.log(a.x);        a.x = 100;        console.log(a.x);

Attribute can be set to read-only, read/s write

6

var a = {            x:1,            get getx() {return this.x;},            set setx(arg) {                return this.x = arg;            }        }        Object.freeze(a);        a.x = 100;        console.log(a.x); //1

Freezing an object ensures that the object's closeness is not damaged.

Javascript precautions

The following are some "traps" that JavaScript is prone to mistakes. They are collected by google + Experience +. Although they are not very profound technical issues, please note that it will make your programming easier.

1. last comma

For example, in this Code Section, note that the last comma should be good in terms of Linguistics (this is acceptable for a dictionary similar to the data type in python ). IE reports syntax errors, but the semantics is unknown. You can only scan thousands of lines of code.

Js Code
<Script>
Var theObj = {
City: "ShenZhen ",
State: "OK ",
}
</Script>
<Script> var theObj = {city: "ShenZhen", state: "OK" ,}</script>

2. the reference of this will change.

Such as this Code:

Js Code
<Input type = "button" value = "Gotcha! "Id =" MyButton ">
<Script>
Var MyObject = function (){
This. alertMessage = "Javascript rules ";
This. ClickHandler = function (){
Alert (this. alertMessage); // line 1
}
}();
Document. getElementById ("theText"). onclick = MyObject. ClickHandler;
</Script>
<Input type = "button" value = "Gotcha! "Id =" MyButton "> <script> var MyObject = function () {this. alertMessage = "Javascript rules"; this. clickHandler = function () {alert (this. alertMessage); // line 1} (); document. getElementById ("theText "). onclick = MyObject. clickHandler; </script>

The answer is not "JavaScript rules", as you wish ". When executing MyObject. ClickHandler, in Row 1, the reference of this actually points to the reference of document. getElementById ("theText. It can be solved as follows:

Js Code
<Input type = "button" value = "Gotcha! "Id =" theText ">
<Script>
Var MyObject = function (){
Var sel ...... remaining full text>

How to Learn javascript Object-Oriented Programming

Let's take a look at nicholas c. zakas's series of books on javascript advanced programming.