<sub id="z53d3"><listing id="z53d3"></listing></sub>

    <em id="z53d3"></em>
    <address id="z53d3"></address>

            <noframes id="z53d3">

            福州網站建設僅需1000元起包含域名空間,詳情18558752805

            • object.defineProperty的理解

            福州網站建設 >網站新聞 >微信小程序 >

            來源:https://www.jianshu.com/p/5cad911a3630

            javascript中,對象定義屬性有多種方式:

            var personObj = {}; personObj.name = "蓋聶"; personObj["sex"] = "男"; 

            除了通過“obj.propertyName”和"obj[propertyName]"定義,修改外,還可以通過ES5原生API "obj.defineProperty"來定義和修改對象屬性。

             Object.defineProperty(personObj, "name", { value: "劍圣蓋聶" }) 
            image.png

            Object.defineProperty()

            語法

            Object.defineProperty(obj, prop, descriptor)

            參數說明

            obj: 必須。要在其上定義或者修改屬性的對象
            prop: 必須。對象屬性的名稱
            descriptor: 必須。目標屬性擁有的特性

            返回值

            傳入函數的對象。即第一個參數obj。

            重點關注傳入的第三個參數值的屬性

            descriptor參數值的類型是object對象,主要包括value,writable,enumberable,configurable等字段名。簡單分析理解下這些字段的作用和用法。

            value: 需要操作的屬性值,默認值為undefined

            image.png

            writable: 屬性值是否可重寫,為true時表示可重寫,反之表示不能重寫,默認為false

            值為false時:


            image.png

            值為true時:

            image.png

            enumberable: 屬性是否可被枚舉,為true時表示可被枚舉,反之表示不能被枚舉,默認為false

            值為false時:

            image.png

            值為true時:

            image.png

            configurable: 是否可以刪除目標屬性或者是否可以重新修改屬性的特性,為true時表示可以刪除或者修改,false時相反,默認為false。

            該參數具有兩個作用
            • 目標屬性是否可以使用delete刪除
            • 目標屬性是否可以再次設置特性

            值為false時:

            image.png

            值為true時:

            image.png

            除了可以給新定義的屬性設置特性,也可以給已有的屬性設置特性。

            image.png

            存取器描述

            當使用存取器描述屬性的特性的時候,descriptor參數允許使用getter和setter方法,用于設置或獲取對象的某個屬性的值。當使用了getter或setter方法,不允許使用writable和value這兩個屬性。在特性中使用get/set屬性來定義對應的方法。

            var mockData = { name: "劍圣-衛莊", title: "淵虹" }; var personObj = {}; Object.defineProperty(personObj,"name", { get: function(){ //在獲取該屬性值得時候觸發該函數 debugger; return mockData.name }, set: function(value){ //當設置該屬性值的時候觸發該函數,設置的新值通過參數value拿到 debugger; mockData.name = value; } }) 
            image.png



            作者:小興nice
            鏈接:https://www.jianshu.com/p/5cad911a3630
            來源:簡書
            著作權歸作者所有。商業轉載請聯系作者獲得授權,非商業轉載請注明出處。
            掃描二維碼分享到微信
            確 認

            Copyright ? 2014-2019 ?www.siamposts.com福州網站制作 福州網站建設盡在福州E點互動 版權所有 閩ICP備16037694號-2

            你能塞多少樱桃我就陪你多久

            <sub id="z53d3"><listing id="z53d3"></listing></sub>

              <em id="z53d3"></em>
              <address id="z53d3"></address>

                      <noframes id="z53d3">