javaScript常用知識實例分享

物件

物件可以透過兩種形式定義： 聲明形式與建構形式

#宣告形式語法： var myObj = {key:value}

建構形式語法： var myObj = new Object(); myObj.key = value;

類型：   語言類型有六種 ： string number boolean null undefined object

#內建物件： String Number Boolean Object Function Array Date RegExp Error

var myObject = {

　　　　a:2

}

##　存取

　　　　　　myObject["a"] // 2  

鍵存取

## 

ES6

可計算屬性名稱

## ES6

可計算屬性名稱

#var prefix  = "foo";

var myObject = {

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

#[prefix + "baz"]: "world"

};

myObject["foobar"]; // hello

myObject["foobaz"]; // world1.writable   

決定是否可以修改屬性的值

var myObject = {};

Object.defineProperty(myObject,"a",{value：

2,

writable:false, // 不可寫

!

configurable: true,

enumerable: true

});

myObject.a = 3;

myObject.a;   // 2

2.configurable  只要屬性是可設定的，就可以使用defineProperty(..)

方法來修改描述屬性。

var myObject = {

a : 2

};

myObject.a = 3;

myObject. a; // 3

Object.defineProperty(myObject,"a",{value： 4

#，

writable:true,configurable:false,//

無法設定

enumerable: ture

});

myObject.a; // 4

myObject.a = 5;

myObject.a; // 5

Object.defineProperty(myObject,"a ",{value： 6

，

writable:true,

configurable:true ,

enumerable: ture

})   // TypeErrorconfigurable 修改成flash

是單向的，無法撤銷

delete

只用來刪除物件的可刪除屬性。

var myObject = {a：

#2

}

;

myObject.a  //2

delete myObject.a;

myObject.a // undefined3.enumerable    

控制的是屬性是否出現在物件的屬性枚舉中。 ######

1.物件常數，結合writable: false #和configurable: false 就可以建立一個真正的常數屬性

（不可修改，重新定義或刪除）。

var myObject = {};

Object.defineProperty(myObject,"FAVORITE_NUMBER",{

value：42 ，

writable: false,

configurable: false

})

2.禁止擴展

禁止一個物件新增屬性並保留現有屬性，可以使用Object.preventExtensions(...)

  var myObject = {

a:2

};

Object.preventExtensions(myObject);

myObject.b = 3;

myObject.a; / / undefined

3.存檔

Object.seal(...) 會建立一個「封存的物件」，這個方法實際上會在一個現有物件上呼叫

Object.preventExtensions(...) 並把所有屬性標記為configurable:false.

4.凍結

Object.freeze(...) 會建立一個凍結對象，這個方法其實是會在一個現有物件上呼叫

Object.seal(...) ,還可以深度凍結一個物件。

Getter和Setter

#var  myObject = {

// 給予#a 定義一個getter

get a() {

return 2;

}

}

myObject.a = 3;

myObject.a;  // 2

由於只定義了 a 的getter,所以對a 的值進行設定時set #操作會忽略賦值運算，不會拋出錯誤。

通常來講getter 和setter是成對出現的

var myObject = {

// 給a #定義一個getter

##get a( ) {

return this._a_;

},

#//

給a 定義一個setter

set a(val) {

this._a_ = val * 2;

##}

};

myObject.a = 2;

myObject.a; // 2

存在性別

可以在不存取屬性的情況下判斷物件中是否存在這個屬性：

#var myObject = {

a：2

};

("a" in myObject); // true

("b" in myObject); // false

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

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

in 操作符會檢查屬性是否在物件及[[Prototype]]原型鏈中。

hasOwnProperty(...) 只會檢查屬性是否在myObject物件中。

判斷屬性是否可列舉：

var  myObject = {};

Object.defineProperty(

# myObject,

"a",

// 讓a像普通屬性一樣可列舉

{enumerable: true,value:2}

);

Object.defineProperty(

myObject,

"b",

// 讓b 不可枚舉

#{enumerable: false,value:3}

)

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

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

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

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

propertyIsEnumerable(...)  #會檢查給定的屬性名稱是否直接存在於物件中（而不是在原型鏈）並且滿足enumerable:true

Object.keys(...) 會傳回一個陣列，包含所有可枚舉屬性

Object.getOwnPropertyNames(...) 傳回一個數組，包含所有屬性，無論是否可枚舉

## 

遍歷

 for .. in

可以用來遍歷物件的可枚舉屬性清單

對於數值索引的陣列來說，可以使用標準的for 循環

ES5

中新增的  forEach(..)  every(.. .)  some(..)

forEach(...)

會遍歷數組中所有值並忽略回呼函數的回傳值。

every(...)

會一直運行到回呼函數回傳false

some(...)

會一直運行到回呼函數回傳true

Es6

增加 for .. of #循環語法

　　var myArray = [ 1,2,3];

#　　for(var v of myArray){

##　　console.log(v)

#　　}

普通的物件沒有

@@iterator,可以給任何想遍歷的物件自訂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(); // {值：2，done: false}

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

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

// 用for..of 遍歷myObject

##for(var v of myObject){

console.log(v)

}  // 2 // 3

## 

#

以上是javaScript常用知識實例分享的詳細內容。更多資訊請關注PHP中文網其他相關文章！