JS獲取對(duì)象屬性名總結(jié)
最近面試遇到問(wèn)如何獲取對(duì)象全部屬性名的方法,總結(jié)一下:
對(duì)象屬性類型分類:
1.ESMAScript分類
數(shù)據(jù)類型 又分為可枚舉和不可枚舉類型 訪問(wèn)器類型
2.上下文分類
原型屬性 實(shí)例屬性
1.列舉自身但不包括原型的可枚舉屬性名 Object.keys(obj)
// 遍歷對(duì)象
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.demo = function() {};
let cj = new Person('cj', 25);
// 通過(guò)Object.defineProperty定義一個(gè)不可枚舉屬性
Object.defineProperty(cj, 'weight', {
enumerable:false
})
// enumerable = true
// console.log(Object.keys(cj)) // name age
// enumerable = false
// console.log(Object.keys(cj)) // name age weight
2.列舉包括自身不可枚舉但不包括原型的屬性名 Object.getOwnPropertyNames(obj)
function Person(name, age) {
this.name = name;
this.age = age;
}
// 設(shè)置原型屬性
Person.prototype.demo = function() {};
let cj = new Person('cj', 25);
// 通過(guò)Object.defineProperty定義一個(gè)不可枚舉屬性
Object.defineProperty(cj, 'weight', {
enumerable:false
})
// 獲取屬性名
console.log(Object.getOwnPropertyNames(cj)) // name age weight
3.獲取自身和原型鏈上的可枚舉屬性 for in 返回的順序可能與定義順序不一致
function Person(name, age) {
this.name = name;
this.age = age;
}
// 設(shè)置原型屬性
Person.prototype.demo = function() {};
Object.prototype.j = 1
let cj = new Person('cj', 25);
// 通過(guò)Object.defineProperty定義一個(gè)不可枚舉屬性
Object.defineProperty(cj, 'weight', {
enumerable:false
})
let props = []
for(prop in cj){
props.push(prop)
}
console.log(props) //name age weight j
4.獲取自身Symbol屬性 Object.getOwnPropertySymbols(obj)
let obj = {};
// 為對(duì)象本身添加Symbol屬性名
let a = Symbol("a");
obj[a] = "localSymbol";
// 為對(duì)象原型添加Symbol屬性名
let b = Symbol("b")
Object.prototype[b] = 111
let objectSymbols = Object.getOwnPropertySymbols(obj);
console.log(objectSymbols); //Symbol(a)
5.獲取自身包括不可枚舉和Symbol屬性名,但不包括原型 Reflect.ownKeys(obj)
// 遍歷對(duì)象
function Person(name, age) {
this.name = name;
this.age = age;
}
Person.prototype.demo = function() {};
let s = Symbol('s')
let cj = new Person('cj', 25);
// 通過(guò)Object.defineProperty定義一個(gè)不可枚舉屬性
Object.defineProperty(cj, 'weight', {
enumerable: false
})
cj[s] = 1
let a = Symbol('a')
Object.prototype[a] = 1
console.log(Object.getOwnPropertyNames(cj)) //name age weight
console.log(Reflect.ownKeys(cj)) //name age weight Symbol(s)
更多關(guān)于JS獲取對(duì)象屬性名的使用小技巧請(qǐng)查看下面的相關(guān)鏈接
相關(guān)文章
微信小程序返回多級(jí)頁(yè)面的實(shí)現(xiàn)方法
這篇文章主要介紹了微信小程序返回多級(jí)頁(yè)面的實(shí)現(xiàn)方法的相關(guān)資料,希望通過(guò)本文能幫助到大家,讓大家實(shí)現(xiàn)這樣的功能,需要的朋友可以參考下2017-10-10
fs-extra實(shí)現(xiàn)yarn?create?tlist創(chuàng)建示例詳解
這篇文章主要為大家介紹了fs-extra實(shí)現(xiàn)yarn?create?tlist創(chuàng)建示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-01-01
微信小程序遇到修改數(shù)據(jù)后頁(yè)面不渲染的問(wèn)題解決
這篇文章主要介紹了微信小程序遇到修改數(shù)據(jù)后頁(yè)面不渲染的問(wèn)題解決的相關(guān)資料,需要的朋友可以參考下2017-03-03
Parcel配置public靜態(tài)文件目錄過(guò)程解析
這篇文章主要為大家介紹了Parcel配置public靜態(tài)文件目錄實(shí)現(xiàn)過(guò)程解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-06-06
TypeScript?學(xué)習(xí)筆記之?typeScript類定義,類的繼承,類成員修飾符
這篇文章主要介紹了TypeScript?學(xué)習(xí)筆記之?typeScript類定義,類的繼承,類成員修飾符,typeScript?支持面向?qū)ο蟮乃刑匦?,比如類、接口?下文詳細(xì)內(nèi)容,需要的小伙伴可以參考一下2022-02-02
微信小程序 解決請(qǐng)求服務(wù)器手機(jī)預(yù)覽請(qǐng)求不到數(shù)據(jù)的方法
這篇文章主要介紹了微信小程序 解決請(qǐng)求服務(wù)器手機(jī)預(yù)覽請(qǐng)求不到數(shù)據(jù)的方法的相關(guān)資料,配置https時(shí),要使用443端口,就可以解決,需要的朋友可以參考下2017-01-01
JavaScript前端學(xué)算法題解LeetCode最大重復(fù)子字符串
這篇文章主要為大家介紹了JavaScript前端學(xué)算法題解LeetCode最大重復(fù)子字符串,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-09-09

