# js物件可擴充套件性和屬性的四個特性（下）

一、前言

• 再次花時間回顧一下基礎，畢竟要想樓建的好，地基就要牢固，嘻嘻！

• 在開始之前需要具備對prototype、__proto__、constructor有一定得了解，可以看看我之前寫的一篇文章=>通道
  
• 之前的使用者管理系統已經差不多了，順便加了個socket聊天的，但是由於做java後臺的哪個朋友節奏跟不上來，所以即時聊天的後臺就是node+socket-io寫的，由於使用者列表也涉及比較多的使用者隱私問題，所以我設定了頁面許可權和介面許可權，然後下面開放的幾個賬號就只能看到幾個頁面而已，哈哈。=>通道
• 體驗賬號1：賬號：“123456”。密碼：“123456”

• 體驗賬號2：賬號：“123123”。密碼：“123123”

---

二、目錄

• 物件屬性的四個特性
• 物件的可擴充套件性
• 刪除屬性
• 檢測屬性
• 列舉屬性
• 屬性的getter和setter

---

三、刪除屬性

1、用指定物件作為原型建立物件

Object.create()

說明：

• 第一個引數是新建物件的原型
• 第二個引數也就是屬性和特性描述的集合

    const log = console.log;
    //返回資料資料的描述
    var aa = Object.create({ x: 1 }, {
        y: {
            value: 1,
            writable: false,
            enumerable: false,
            configurable: true
        }

    })
    log(aa)
    log(Object.getOwnPropertyDescriptor(aa,'y'))
 

2、刪除物件屬性

delete

說明:

• delete只是斷開屬性和宿主物件的聯絡，而不會去操作屬性中的屬性。
• delete只能刪除自有屬性，不能刪除繼承屬性。
• delete不能刪除可配置為false的屬性

    const log = console.log;
    //返回資料資料的描述
    var aa = {y:2}
    Object.defineProperty(aa, 'x', {
            value: 1,
            writable: true,
            enumerable: true,
            configurable: false
        })
    log(aa);
    log(delete aa.x);
    log(delete aa.y);
    log(aa)
 

---

四、檢測屬性

1、檢測物件是否擁有某個屬性

in

說明：

• in運算子不僅僅回檢測物件自有屬性，還會檢測繼承屬性

    const log = console.log;
    var aa={x:1};
    log('x' in aa);
    log('y' in aa);
    log('toString' in aa)

2、檢測物件是否擁有某個屬性

hasOwnProperty()

說明：

• hasOwnProperty只會檢測對物件自有屬性，不會檢測繼承屬性

    const log = console.log;
    var aa={x:1};
    log(aa.hasOwnProperty('x'));
    log(aa.hasOwnProperty('y'));
    log(aa.hasOwnProperty('toString'))

3、檢測物件是否擁有某個屬性

propertyIsEnumerable()

說明：

• propertyIsEnumerable屬性只檢測自有屬性的可列舉屬性

    const log = console.log;
    var aa = { x: 1 };
    Object.defineProperty(aa, 'y', {
        value: 1,
        writable: true,
        enumerable: false,
        configurable: true
    })
    log(aa)
    log(aa.propertyIsEnumerable('x'));
    log(aa.propertyIsEnumerable('y'));
    log(aa.propertyIsEnumerable('toString'))

---

五、列舉屬性

1、列舉物件中的屬性

Object.keys()

    const log = console.log;
    var aa = { x: 1 ,y:2};
    Object.defineProperty(aa, 'z', {
        value: 3,
        writable: true,
        enumerable: false,
        configurable: true
    })
    log(aa)
    log(Object.keys(aa))

2、列舉物件中的屬性

Object.getOwnPropertyNames()

    const log = console.log;
    var aa = { x: 1 ,y:2};
    Object.defineProperty(aa, 'z', {
        value: 3,
        writable: true,
        enumerable: false,
        configurable: true
    })
    log(aa)
    log(Object.getOwnPropertyNames(aa))

---

六、屬性的getter和setter

說明：

• 由get和set定義的屬性叫做存取器屬性
• 不同於普通屬性它不是一個具體的值，而是由兩個方法構成

    const log = console.log;
    var aa = { x: 1 ,
    get y(){
        return 1000;
    },
    set y(value){
        this.x+=value;
    }
    };
    log(aa)
    aa.y=1;
    log(aa)

相關推薦