從ES5開始,所有的屬性都具備了屬性描述符

var myObject = {a: 2 };Object.getOwnPropertyDescriptor(myObject, "a"); //{ // value:2, // writable: true, // 可寫 // enumerable: true, // 可枚舉 // configurble: true // 可配置 //}

定義屬性:(Object.defineProperty):

// Object.defineProperty var myObject = {};Object.defineProperty(myObject, "a", {value: 2,writable: true,configurable: true,enunmerable: true });myObject.a; // 2// 給myObject定義一個(gè)a屬性,值為2,可寫、可枚舉、可配置

可寫性(writable):

// writable Object.defineProperty(myObject, "a", {value: 2,writable: false, // 不可寫configurable: true,enumerable: true }) myObject.a = 3; myObject.a; // 2

可配置(configurable):

// configurable Object.defineProperty(myObject, "a", {value: 4,writable: true,configurable: false, // 不可配置enumerable: true }); Object.defineProperty(myObject, "a", {value: 6,writable: true,configurable: true,enumerable: true }); // TypeError .. 對于confugirable為false的屬性,不允許將其改為truedelete myObject .a ; // 刪除無效 myObject.a; // 2

對象常量:

// 結(jié)合writable和configurable創(chuàng)建一個(gè)真正的常量屬性 var myObejct = {}; Object.defineProperty(myObject, "FAVORITE_NUMBER", {value: 42,writable: false,configurable: false });

禁止擴(kuò)展:

// 禁止一個(gè)對象添加新屬性 Object.preventExtensions() var myObject={a: 2 }; Object.preventExtensions(myObject);myObject.b = 3; myObject.b; // undefined

Getter:

// getter是一個(gè)隱藏函數(shù),會(huì)在獲取屬性值時(shí)調(diào)用 var myObject = {// 給a定義一個(gè)getterget a() {return 2; // 在使用myObject.a時(shí)調(diào)用,返回2} }; Object.defineProperty(myObject,"b",{// 給b設(shè)置一個(gè)getterget function () {return this.a * 2}, // 在使用myObject.b時(shí)回返回一個(gè) 2*a// 確保B會(huì)出現(xiàn)在對象的屬性列表中enumerable: true} }; myObject.a; // 2 myObject.b; // 4

Setter:

// 在調(diào)用對屬性的賦值時(shí),觸發(fā) // 一般與getter成對出現(xiàn) var myObject = {// 給a定義一個(gè)getterget a() {return this._a_;},// 給a定義一個(gè)setterset a(val) {this._a_ = val * 2;} }; myObject.a = 2; // 賦值操作,觸發(fā)setter myObject.a; // 4 // 讀取操作,觸發(fā)getter

檢查對象中的屬性:

// a in object // hasOwnProperty var myObject = {a: 2 }; ("a" in myObject); // true ("b" in myObject); // falsemyObject.hasOwnproperty("a"); // true myObject.hasOwnproperty("b"); // false// 注: in操作符會(huì)檢查屬性是否在對象及其 [[Prototype]]原型鏈中,hasOwnproperty()只會(huì)檢查屬性是否在myObject對象中(不會(huì)檢查[[Prototype]]鏈).

遍歷:

// forEach()會(huì)遍歷數(shù)組中的所有值并忽略回調(diào)函數(shù)的返回值. // every()會(huì)一直運(yùn)行直到回調(diào)函數(shù)返回false // some()會(huì)一直運(yùn)行直到回調(diào)函數(shù)返回true // for...in遍歷對象是無法直接獲取屬性值的,因?yàn)樗鼘?shí)際上遍歷的是對象中的所有可枚舉屬性,你需要手動(dòng)獲取屬性值.// ES6新增for...of循環(huán)語法,來直接遍歷值: var myArray = [1, 2, 3]; for(var v of myArray) {console.log(v); }// 可以使用數(shù)組內(nèi)置的@@iterator來看看它是如何工作的: var myArray = [1, 2, 3]; var it = myArray[Symbol.iterator](); console.log(it.next()); // {value: 1,done: false } console.log(it.next()); // {value: 2,done: false } console.log(it.next()); // {value: 3,done: false } console.log(it.next()); // {done: true}

自定義迭代器:

// 給任何你想遍歷的對象定義@@iterator, var myObject = {a: 2,b: 3 }; Object.defineProperty( myObject, Symbol.iterator,{enumerable: false, // 不可枚舉writable: false, // 不可寫configurable: true, // 可配置value: function() {var o = this; // this指代myObject.[{a:2},{b:3}]var idx = 0;var ks = Object.keys(o); // 獲取元素值[2,3]return {next: function() { // 返回一個(gè)next()方法. 使用obj.next()調(diào)用. 返回值和是否完成.return {value: o[ks[idx++]],done: (idx > ks.length)};}};} }); // 手動(dòng)遍歷myObject var it = myObject[Symbol.iterator](); it.nexr(); // {value: 2, done: false} it.next(); // {value: 3, done: false} it.next(); // {value: undefined, done: true}// 用for...of遍歷myObject for(var v of myObject) {console.log(v); }

參考《你不知道的JavaScript》(上卷)P111~P124

總結(jié)

以上是生活随笔為你收集整理的javascript --- 属性描述符的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。