JavaScript?對(duì)象新增方法defineProperty與keys的使用說(shuō)明
文章導(dǎo)讀:
這篇文章給大家講解在 ES5 中對(duì)象新增的兩個(gè)常用方法:defineProperty(),keys(),
這兩個(gè)方法可以讓我們更方便的操作對(duì)象,獲取對(duì)象屬性,賦值修改等等操作,最重要的是,這些方法可以讓我們?cè)O(shè)置無(wú)法修改對(duì)象屬性值,下面跟我一起了解一下吧!
一:Object.defineProperty()
Object.defineProperty() 可以用來(lái)定義對(duì)象的新屬性和修改屬性值,設(shè)置屬性值是否可修改(重點(diǎn))等等,該方法共有三個(gè)參數(shù)
1.1 參數(shù)說(shuō)明
Object.defineProperty( obj, prop, descriptor )
| 參數(shù) | obj | prop | descriptor |
| 含義 | 要操作的對(duì)象名稱 | 對(duì)象中要操作的某個(gè)屬性的名稱 | 這個(gè)參數(shù)有四個(gè)特性,該參數(shù)以對(duì)象形式書寫,詳細(xì)寫法說(shuō)明如下 |
1.2 第三個(gè)參數(shù) descriptor 的說(shuō)明
其參數(shù)以對(duì)象形式書寫,其內(nèi)部有四個(gè)特性,例如修改值的操作,設(shè)置是否可重寫,設(shè)置是否可枚舉,是否可修改特性等等......

1.3 實(shí)際使用
1.3.1 writable 特性
writeable 特性可以設(shè)置一個(gè)屬性是否可被重寫,true 為可重寫,false 為不可重寫,使用 defineProperty 新添加的屬性默認(rèn)為 false
<script>
var dog={
'name':'旺財(cái)',
'age':5
}
Object.defineProperty(dog,'sex',{
value:'公',
writable:false
})
dog.sex='母' //更改屬性值看其是否改變
console.log(dog);
</script>
可以看到我們雖然更改了 sex 的值,但是打印結(jié)果沒(méi)有被更改 ,說(shuō)明 writable : false 屬性成功使其屬性值不能重寫,功能十分強(qiáng)大是不是!
注意事項(xiàng):如果是使用 defineProperty 新添加的屬性,那么 writable 默認(rèn)為 false 不可修改,如果是本身就有的屬性而去修改值,那其仍可以修改
1.3.2 enumerable 特性
enumerable 特性可以設(shè)置某個(gè)屬性是否可被枚舉,true 為可枚舉,false 為不可枚舉,使用 defineProperty 新添加的屬性默認(rèn)為 false
<script>
var dog={
'name':'旺財(cái)',
'age':5
}
Object.defineProperty(dog,'sex',{
value:'公',
enumerable:false
})
console.log(Object.keys(dog));
</script>
可以看到我們遍歷得不到設(shè)置過(guò) enumerable:false 特性的屬性 sex,證明了 false 不可枚舉
注意事項(xiàng):如果是使用 defineProperty 新添加的屬性,那么 enumerable 默認(rèn)為 false 不可枚舉,如果是本身就有的屬性而去修改值,那其仍可以枚舉
1.3.3 configurable 特性
configurable 特性可以設(shè)置某個(gè)屬性是否可被修改(刪除),true 為可修改,false 為不可修改,使用 defineProperty 新添加的屬性默認(rèn)為 false
configurable 特性的參數(shù)只能設(shè)置一次,第二次設(shè)置會(huì)無(wú)效?。?/p>
<script>
var dog={
'name':'旺財(cái)',
'age':5,
}
Object.defineProperty(dog,'sex',{
value:'公',
configurable : false
})
delete dog.sex
console.log(dog);
</script>
可以看到我們刪除不了設(shè)置過(guò) configurable:false 特性的屬性 sex,證明了 false 不可修改
注意事項(xiàng):如果是使用 defineProperty 新添加的屬性,那么 configurable 默認(rèn)為 false 不可修改,如果是本身就有的屬性而去修改值,那其仍可以修改
二:Object.keys()
keys() 可以用來(lái)獲取對(duì)象的屬性名,參數(shù)為要操作的對(duì)象名稱。其返回一個(gè)數(shù)組元素為屬性名的新數(shù)組(故需要定義一個(gè)數(shù)組去接收)
Object.keys( obj )
<script>
var dog={
'name':'旺財(cái)',
'age':5,
'sex':'公'
}
var arr=Object.keys(dog)
console.log(arr);
</script>
成功返回了對(duì)象的屬性名稱
到此這篇關(guān)于JavaScript 對(duì)象新增方法 defineProperty 與 keys 的使用說(shuō)明的文章就介紹到這了,更多相關(guān)JS defineProperty與keys 內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
javascript 獲取所有id中包含某關(guān)鍵字的控件的實(shí)現(xiàn)代碼
獲取某容器控件中id包含某字符串的控件id列表2010-11-11
js 數(shù)組隨機(jī)字符串(廣告不重復(fù))
今天一個(gè)網(wǎng)友想讓他的廣告隨機(jī)顯示,每次刷新廣告的內(nèi)容都不一樣,經(jīng)過(guò)參考源碼網(wǎng)站分析就是通過(guò)下面代碼實(shí)現(xiàn),特分享下方便需要的朋友2013-08-08
使用apply方法處理數(shù)組的三個(gè)技巧[譯]
本文要講的是使用apply方法處理數(shù)組的三個(gè)技巧,需要的朋友可以參考下2012-09-09
微信小程序使用uni-app和springboot實(shí)現(xiàn)一鍵登錄功能(JWT鑒權(quán))
微信一鍵登錄是指用戶在使用小程序時(shí),可以通過(guò)微信賬號(hào)進(jìn)行快速登錄,而無(wú)需額外的注冊(cè)和密碼設(shè)置,這篇文章主要給大家介紹了關(guān)于微信小程序使用uni-app和springboot實(shí)現(xiàn)一鍵登錄功能的相關(guān)資料,需要的朋友可以參考下2023-11-11
js實(shí)現(xiàn)以最簡(jiǎn)單的方式將數(shù)組元素添加到對(duì)象中的方法
下面小編就為大家分享一篇js實(shí)現(xiàn)以最簡(jiǎn)單的方式將數(shù)組元素添加到對(duì)象中的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2017-12-12
js實(shí)現(xiàn)的仿新浪微博完美的時(shí)間組件升級(jí)版
本博客沒(méi)有華麗的布局,只求樸實(shí)的js的代碼,只為js代碼愛(ài)好者提供,一周大概會(huì)出1-2篇js前沿代碼的文章.只是代碼,不說(shuō)技術(shù)2011-12-12
使用focus方法讓光標(biāo)默認(rèn)停留在INPUT框
讓光標(biāo)默認(rèn)停留在INPUT框中,用focus方法可以實(shí)現(xiàn),下面有個(gè)示例代碼,需要的朋友可以參考下2014-07-07
Javascript實(shí)現(xiàn)前端簡(jiǎn)單的路由實(shí)例
本文將使用javascript實(shí)現(xiàn)一個(gè)極其簡(jiǎn)單的路由實(shí)例。WEB開(kāi)發(fā)中路由概念并不陌生,我們接觸到的有前端路由和后端路由。后端路由在很多框架中是一個(gè)重要的模塊,同樣前端路由在單頁(yè)面應(yīng)用也很常見(jiàn),它使得前端頁(yè)面體驗(yàn)更流暢。2016-09-09

