成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

理解對象和對象的描述特性

Cobub / 711人閱讀

摘要:面向?qū)ο罄斫鈱ο蠛蛯ο蟮拿枋鎏匦悦嫦驅(qū)ο竺嫦驅(qū)ο蟮恼Z言都有一個特性都有類的概念。默認值是使用對象字面量的方式為對象添加的屬性,其的值是,的值是指定的值。同數(shù)據(jù)屬性同數(shù)據(jù)屬性讀取的時候調(diào)用函數(shù)。

JavaScript面向?qū)ο驩OM 1(理解對象和對象的描述特性)

Date: Updated At Oct 31, 2018 | JavaScript | 面向?qū)ο?| Author: ZhengAo |

面向?qū)ο蟮恼Z言都有一個特性 -- 都有類的概念。通過類可以創(chuàng)建一系列屬性相近,功能類似的對象。

JavaScript 中沒有類的概念,JS 有特殊的面向?qū)ο蟮募记?-通過原型的方式。每個對象都是基于一個引用類型創(chuàng)建的

首先要對 Js 的對象有一個簡單的認識。Js 中的對象就是一個 Key-Value 對組成的集合。

其中 Value 可以是一個基礎(chǔ)數(shù)據(jù)類型,也可以是一個引用數(shù)據(jù)類型。

Key 可以是一個任意可以轉(zhuǎn)換成字符串的類型(Js 內(nèi)部會自動把 Key 都轉(zhuǎn)換成字符串,也可以理解成 Key 是一個字符串)

I-1 創(chuàng)建對象

創(chuàng)建一個對象最開始(基本、沒人用)的方式就是創(chuàng)建一個 Object 的實例。

創(chuàng)建之后為其添加屬性。


var person = new Object();


person.name = "Zhang San";
person.talk = function() {
    console.log("name", this.name);
}

在之后最常使用的就是通過對象字面量的方式創(chuàng)建一個新對象。


var person = {
    name: "Zhang San",
    talk: function() {
    console.log("name", this.name);
}

使用對象字面量創(chuàng)建理論上可以減少內(nèi)存的使用,提高性能,更高效(減少了創(chuàng)建實例時候的 prototype 的調(diào)用,縮短原型鏈)。開發(fā)體驗上字面量的方式更好。

參考: 使用字面量創(chuàng)建的好處

I-2 對象的屬性

首先要明白,Js 中的對象的屬性分為兩種: 數(shù)據(jù)屬性和訪問器屬性

Js 的屬性中有一些是使用雙中括號括起來的例如:[[Configurable]] ,這些屬性是 JS 引擎所訪問的。

I-2-1 數(shù)據(jù)屬性

數(shù)據(jù)屬性包含一個數(shù)據(jù)值的位置,可以讀取和寫入。 這個位置指的是在對象中有一個可以看到的屬性

var obj = {
    demo : 123
}

上面的 demo 就是一個數(shù)據(jù)屬性

數(shù)據(jù)屬性中有4個描述它的特性(注意區(qū)分大小寫,使用的時候是小寫開頭)

[[Configurable]]翻譯:可配置的 可以從新定義的屬性。默認值: true。

[[Enumerable]]翻譯:可枚舉的 可以遍歷的屬性(for-in) 默認值:true

[[Writable]]翻譯:可寫的 可以修改屬性的值。 默認值: true

[[Value]]屬性Key對應(yīng)的值。讀取的時候從這里讀取。默認值是undefined

??使用對象字面量的方式為對象添加的屬性,其[[Configurable]]`[[Enumerable]]`[[Writable]] 的值是true,[[Value]的值是指定的值。

??在初始化對象之后,我們會有修改它的欲望,Js 在(ES5)的時候為我們提供了一個方法用于修改這些描述特性。

修改對象屬性(A.x)的數(shù)據(jù)屬性時候,使用: Object.defineProperty(對象,對象的屬性,描述符對象) 方法。

函數(shù)名比較長,理解語義記憶:

Object: 首先這是一個對象默認的方法。

define(定義)

property(特性)

小駝峰寫法寫成: Object.defineProperty()


var person = {};

Object.defineProperty(person, name, {
    writable: false,
    value: "Zhang San"
})
console.log(person.name) // Zhang San


person.name = "Li Si"
console.log(person.name) // Zhang San

在多次調(diào)用 Object.defineProperty() 方法修改一個屬性的configurable的值的時候,一旦設(shè)置了 false就不可以再次修改。

這個方法的最小兼容為 IE9+ ,其他現(xiàn)代瀏覽器基本都可以提供這個方法(不兼容建議放棄或強制升級)。

I-2-2訪問器屬性

什么是訪問器屬性:先看一個例子

var book = {
    _year: 2005,
    edition: 1,
}
// 注意這里的 year 不是 _year, year就是一個訪問器屬性,_year是一個數(shù)據(jù)屬性。
Object.defineProperty(book, "year", {
    get: function() { return this._year },
    set: function(newVal) { 
        this.editor += newVal - 2004 ;
        this._year = newVal;
    }
})

通過例子可以看出訪問器屬性和數(shù)據(jù)屬性非常大的區(qū)別就是

訪問器屬性不包含具體的數(shù)值,不直接顯示在對象中,不能直接通過字面量定義。

訪問器屬性有 get 和 set 方法才能為其賦值。

訪問器屬性的定義經(jīng)常會引起其他數(shù)據(jù)屬性的變化。(這就是它的一個重要作用)

至于例子中的 _year 的寫法:有的時候明確的代碼風格可以更好的表現(xiàn)代碼的功能。比如在對象的屬性中使用 _year 代表這個屬性 只有通過對象內(nèi)部調(diào)用訪問 。

定義一個訪問器屬性,必須使用 Object.defineProperty()這個方法定義

訪問器屬性提供了4個描述特性。

[[Configurable]] 同數(shù)據(jù)屬性

[[Enumerable]] 同數(shù)據(jù)屬性

[[Get]] 讀取的時候調(diào)用函數(shù)。默認值為:undefined

[[Set]] 設(shè)置的時候調(diào)用函數(shù)。默認值為:undefined

get和set 不一定同時存在,存在一個表明:操作另一個的時候不會得到結(jié)果,嚴格模式會報錯。

兼容性: IE9+

I-3 操作對象的多個屬性

以上兩節(jié)主要說明了單個屬性描述特性的操作,批量的屬性操作可以提升語義和簡化代碼。

JS 提供了可以一次性定義多個屬性的方法:使用Object.defineProperties(對象,描述對象) 方法

var book = {};

Object.defineProperties(book, {
     _year: {
        value: 2004
     },
     edition: {
        value: 1
     },
     year: {
        get: function(){
            return this._year;
        },
        set: function(newValue){
            if (newValue > 2004) {
                this._year = newValue;
                this.edition += newValue - 2004;
            }
        }
     }
}); 
I-4 讀取對象的屬性特性

Js 提供了Object.getOwnPropertyDescriptor(對象,屬性)的方法獲取指定對象的特定屬性的描述特性。

方法名記憶: 對象方法.獲取-自身的特性-描述符特性

get:獲取

own:自身的

property:特性

descriptor:描述特性

使用小駝峰鏈接:getOwnPropertyDescriptor()

未特殊指定的描述特性,它的值是默認值。

兼容性 IE9+

參考資料

《JavaScript高程》

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/98919.html

相關(guān)文章

  • 理解對象對象描述特性

    摘要:面向?qū)ο罄斫鈱ο蠛蛯ο蟮拿枋鎏匦悦嫦驅(qū)ο竺嫦驅(qū)ο蟮恼Z言都有一個特性都有類的概念。默認值是使用對象字面量的方式為對象添加的屬性,其的值是,的值是指定的值。同數(shù)據(jù)屬性同數(shù)據(jù)屬性讀取的時候調(diào)用函數(shù)。 JavaScript面向?qū)ο驩OM 1(理解對象和對象的描述特性) Date: Updated At Oct 31, 2018 | JavaScript | 面向?qū)ο?| Author: Zhe...

    Rocture 評論0 收藏0
  • 深入理解JavaScript中屬性特性

    摘要:深入理解中的屬性和特性中屬性和特性是完全不同的兩個概念,這里我將根據(jù)自己所學,來深入理解中的屬性和特性。其中第三個參數(shù)描述符對象是對象字面量的方法創(chuàng)建的,里面的屬性和屬性值實際上保存的是要修改的特性和特性值。 深入理解JavaScript中的屬性和特性   JavaScript中屬性和特性是完全不同的兩個概念,這里我將根據(jù)自己所學,來深入理解JavaScript中的屬性和特性。   主...

    VPointer 評論0 收藏0
  • JavaScript深入理解對象方法——Object.defineProperty()

    摘要:返回值被傳遞給函數(shù)的對象。描述該方法允許精確添加或修改對象的屬性。描述符必須是兩種形式之一不能同時是兩者??梢允侨魏斡行У闹禂?shù)值,對象,函數(shù)等。該方法返回值被用作屬性值。該方法將接受唯一參數(shù),并將該參數(shù)的新值分配給該屬性。 Object.defineProperties() Object.defineProperty() 方法會直接在一個對象上定義一個新屬性,或者修改一個對象的現(xiàn)有屬性...

    woshicixide 評論0 收藏0
  • Javascript面向對象程序設(shè)計_理解對象

    摘要:面向?qū)ο蟮某绦蛟O(shè)計理解對象前言最近在細讀高級程序設(shè)計,對于我而言,中文版,書中很多地方翻譯的差強人意,所以用自己所理解的,嘗試解讀下??偨Y(jié)如果英語水平足夠好的話,建議看英文原版書籍或者國外大師的博客。 JS面向?qū)ο蟮某绦蛟O(shè)計_理解對象 前言:最近在細讀Javascript高級程序設(shè)計,對于我而言,中文版,書中很多地方翻譯的差強人意,所以用自己所理解的,嘗試解讀下。 如有紕漏或錯誤,會非...

    劉厚水 評論0 收藏0

發(fā)表評論

0條評論

Cobub

|高級講師

TA的文章

閱讀更多
最新活動
閱讀需要支付1元查看
<