Sharing common knowledge examples of javaScript

Object

Objects can be defined in two forms: Declaration form and construction form

Declaration form syntax: var myObj = {key:value}

Construction form syntax: var myObj = new Object(); myObj.key = value;

Type: There are six language types ： string number boolean null undefined object

Built-in object: String Number Boolean Object Function Array Date RegExp Error

var myObject = {

　a:2

}

myObject.a; //2 Properties Access

　　myObject["a"] // 2 Key access

ES6 Computable property name

var prefix = "foo";

var myObject = {

[prefix + "bar"] : "hello",

[prefix + "baz"]: "world"

};

myObject["foobar"]; // hello

myObject["foobaz"]; // world

1.writable Determine whether the value of the property can be modified

var myObject = {};

Object.defineProperty(myObject,"a",{

value：2,

writable:false, // Not writable!

configurable: true,

enumerable: true

});

myObject.a = 3;

myObject.a; // 2

2.configurable

As long as the property is configurable, you can use the defineProperty(..) method to modify the description property.

var myObject = {

a : 2

};

myObject.a = 3;

myObject. a; // 3

Object.defineProperty(myObject,"a",{

value： 4,

writable:true,

configurable:false,// Not configurable

enumerable: ture

});

myObject.a; // 4

myObject.a = 5;

myObject.a; // 5

Object.defineProperty(myObject,"a ",{

value： 6，

writable:true,

configurable:true ,

enumerable: ture

}) // TypeError

configurable is modified to flash is one-way , cannot be undone

delete is only used to delete the deletable attributes of the object.

var myObject = {

a：2

};

myObject.a //2

delete myObject.a;

myObject.a // undefined

3.enumerable controls whether the attribute appears in the object's property enumeration.

1.Object constant, combine writable: false and configurable: false to create a real constant Property

(cannot be modified, redefined or deleted).

var myObject = {};

Object.defineProperty(myObject,"FAVORITE_NUMBER",{

value：42 ,

writable: false,

configurable: false

})

2.Prohibit expansion

To prevent an object from adding new properties and retaining existing properties, you can use Object.preventExtensions(...)

var myObject = {

a:2

};

Object.preventExtensions(myObject);

myObject.b = 3;

myObject.a; / / undefined

3.Seal

Object.seal(...) will create a " Preserved object ", this method will actually call

Object.preventExtensions(...) on an existing object and Mark all properties as configurable:false.

4.Freeze

Object.freeze(...) A frozen object will be created. This method will actually call

Object.seal(...) on an existing object. It can also deep freeze an object.

Getter and Setter

var myObject = {

// Givea Define a getter

get a() {

return 2;

}

}

myObject.a = 3;

myObject.a; // 2

Because only a is defined The getter,so when setting the value of a , the set operation will Assignment operations are ignored and no errors are thrown.

Generally speaking, getter and setter appear in pairs

var myObject = {

// Define a getterget a( ) {return this._a_;

},

//

Define a ## for

a

#setterset a(val) {this._a_ = val * 2;

}

};

myObject.a = 2;

myObject.a; // 2

Existence

You can determine whether this attribute exists in the object without accessing the attribute:

var myObject = {

a：2

};

("a" in myObject); // true

("b" in myObject); // false

myObject.hasOWnProper("a"); // true

myObject.hasOwnProperty("b"); // false

in Operation The operator checks whether the property is in the object and [[Prototype]] prototype chain.

hasOwnProperty(...) Only checks whether the property is in the myObject object.

Determine whether the property is enumerable:

var myObject = {};

Object.defineProperty(

myObject,

"a",

// Make a enumerable like a normal property

{enumerable: true,value:2}

);

Object.defineProperty(

myObject,

"b",

// Letb not enumerable

{enumerable: false,value:3}

)

myObject.propertyIsEnumberable("a"); // true

myObject.propertyIsEnumber("b"); // false

Object.keys(myObject); / / ["a"]

Object.getOwnPropertyName(myObject); // ["a","b"]

propertyIsEnumerable(...) will check the given Whether the property name exists directly in the object ( instead of in the prototype chain) and satisfies enumerable:true

Object.keys(...) will return an array , including all enumerable properties

Object.getOwnPropertyNames(...) Returns an array containing all properties, whether enumerable or not

Traversal

for .. in Can be used to traverse the enumerable property list of an object

For numerical values For indexed arrays, you can use the standard for loop

newly added in ES5 forEach(..) every(.. .) some(..)

forEach(...) will iterate through all the values ​​in the array and ignore the return value of the callback function.

every(...) will run until the callback function returns false

some(...) It will run until the callback function returns true

Es6 Add for .. of Loop syntax

　var myArray = [1,2,3];

　for(var v of myArray){

　console.log(v)

　}

Ordinary objects do not have an @@iterator, You can customize any object you want to traverse

var myObject = {

a:2,

b:3

};

Object.defineProperty(myObject,Symbol.iterator,{

enumerable: false,

writable: false,

configurable: true,

value: function() {

var o = this;

var idx = 0;

var ks = Object.keys(o);

return {

next: function(){

value: o[ks[idx++]],

done:(idx > ks.length)

}

}

}

})

// 手动遍历myObject

var it = myObject[Symbol.iterator]();

it.next(); // {value：2，done: false}

it.next(); // {value：3，done: false}

it.next(); // {undefined，done: true}

// 用 for..of 遍历myObject

for(var v of myObject){

　　console.log(v)

}  // 2 // 3

 

The above is the detailed content of Sharing common knowledge examples of javaScript. For more information, please follow other related articles on the PHP Chinese website!