JS获取对象属性名总结

最近面试遇到问如何获取对象全部属性名的方法,总结一下:

对象属性类型分类:

1.ESMAScript分类

数据类型 又分为可枚举和不可枚举类型
访问器类型

2.上下文分类

原型属性
实例属性

1.列举自身但不包括原型的可枚举属性名 Object.keys(obj)

  // 遍历对象
function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.demo = function() {};

let cj = new Person('cj', 25);
// 通过Object.defineProperty定义一个不可枚举属性
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;
}
// 设置原型属性
Person.prototype.demo = function() {};

let cj = new Person('cj', 25);
// 通过Object.defineProperty定义一个不可枚举属性
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;
}
// 设置原型属性
Person.prototype.demo = function() {};
Object.prototype.j = 1
let cj = new Person('cj', 25);
// 通过Object.defineProperty定义一个不可枚举属性
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 = {};
// 为对象本身添加Symbol属性名
let a = Symbol("a");
obj[a] = "localSymbol";
// 为对象原型添加Symbol属性名
let b = Symbol("b")
Object.prototype[b] = 111
let objectSymbols = Object.getOwnPropertySymbols(obj);
console.log(objectSymbols); //Symbol(a)

5.获取自身包括不可枚举和Symbol属性名,但不包括原型 Reflect.ownKeys(obj)

  // 遍历对象
function Person(name, age) {
  this.name = name;
  this.age = age;
}

Person.prototype.demo = function() {};
let s = Symbol('s')
let cj = new Person('cj', 25);
// 通过Object.defineProperty定义一个不可枚举属性
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)

更多关于JS获取对象属性名的使用小技巧请查看下面的相关链接

(0)

相关推荐

  • JS声明对象时属性名加引号与不加引号的问题及解决方法

    一般情况下属性名加引号和不加引号是都可以的,效果是一样的. var obj = { name : '你好', 'age' : 1, }; document.write( obj['name'] + '<br />' ); document.write( obj.age); 上面两行代码均可以正确执行. 当且仅当你的属性名是非法怪异的名字时候,会报错. var obj = { 333 : '这个会报错' }; document.write( obj.333); 此时报错. var obj = {

  • json属性名为什么要双引号(个人猜测)

    原因一: 更加规范,利于解析 原因二: 避免class等关键字引起的不兼容问题 原因三: 可能也是最隐晦的: var a = 00; var b = {00: 12}; a in b; --> true var a = 0; var b = {'00': 12}; a in b; --> false 个人猜测如果js对象的属性名为非string类型,会先进行类型转换, 但是这个过程中可能会出现非预期性的值,虽然仅属个例,但养成一个好习惯还是很有必要的

  • JS动态遍历json中所有键值对的方法(不知道属性名的情况)

    本文实例讲述了JS动态遍历json中所有键值对的方法.分享给大家供大家参考,具体如下: JavaScript中使用ajax技术访问后台资源的时候,常常使用json作为轻量级数据传输格式.json类似于Java中的HashMap,是由一系列的key-value键值对构成. 如果后台返回给前台的json中key的值是动态生成的,那么我们没有办法使用常规的object.name或object["name"]的方式来获取json中的值. 这个时候我们需要在不知道属性名称的时候,遍历json对象

  • js对象属性名驼峰式转下划线的实例代码

    一.题目示例: 思路: 1.匹配属性名字符串中的大写字母和数字 2.通过匹配后的lastIndex属性获取匹配到的大写字母和数字的位置 3.判断大写字母的位置是否为首位置以及lastIndex是否为0,为0则表示匹配结束 4.将存放位置的数组进行从小到大排序,排序后将属性名按照字符串的slice方法切割并使用下划线重组 5.遍历对象的属性名并使用函数改变为新的命名,从新赋值到新的对象上(也可以使用改变对象的ES6新语法) 6.注意,每次在调用函数后,需要清空之前存放位置的数组 二.实现代码 le

  • js中将具有数字属性名的对象转换为数组

    虽然不太常用,但我们的确可以给对象添加以数字为属性名的属性: 复制代码 代码如下: var obj = {}; obj[0] = 1; obj[1] = 2; 这个对象并不是数组类型,那有没有办法把它转换为数组类型呢?jQuery代码中采用了Array.prototype.slice把这种对象转换为数组,但我试了好几遍,就是不行: 复制代码 代码如下: var obj = {}; obj[0] = 1; obj[1] = 2; alert(Array.prototype.slice.call(o

  • javascript获取函数名称、函数参数、对象属性名称的代码实例

    一.获取函数名称的3种实现方法实例1: 在js权威指南中看到的一个方法: Function.prototype.getName = function(){    return this.name || this.toString().match(/function\s*([^(]*)\(/)[1]} 实例2: 如果当前函数是有名函数,则返回其名字,如果是匿名函数则返回被赋值的函数变量名,如果是闭包中匿名函数则返回"anonymous". 复制代码 代码如下: var getFnName

  • 使用变量动态设置js的属性名

    目标:js的属性名可以使用变量 举例:js对象object,当赋给该对象属性的时候可以采用以下方式 复制代码 代码如下: var object; object.prop1 = "value1"; object.prop2 = "value2"; 也可以采用如下方式: 复制代码 代码如下: object.push({prop1:"value1"}); object.push({prop2:"value2"}); 在这里prop1

  • JS获取对象属性名总结

    最近面试遇到问如何获取对象全部属性名的方法,总结一下: 对象属性类型分类: 1.ESMAScript分类 数据类型 又分为可枚举和不可枚举类型 访问器类型 2.上下文分类 原型属性 实例属性 1.列举自身但不包括原型的可枚举属性名 Object.keys(obj) // 遍历对象 function Person(name, age) { this.name = name; this.age = age; } Person.prototype.demo = function() {}; let c

  • 详谈js使用in和hasOwnProperty获取对象属性的区别

    in判断的是对象的所有属性,包括对象实例及其原型的属性: 而hasOwnProperty则是判断对象实例的是否具有某个属性. 示例代码: <script type="text/javascript"> function Person(){ } Person.prototype.name = "allen"; var person = new Person(); console.log(person.hasOwnProperty("name&qu

  • 浅谈js使用in和hasOwnProperty获取对象属性的区别

    in判断的是对象的所有属性,包括对象实例及其原型的属性: 而hasOwnProperty则是判断对象实例的是否具有某个属性. 示例代码: <script type="text/javascript"> function Person(){ } Person.prototype.name = "allen"; var person = new Person(); console.log(person.hasOwnProperty("name&qu

  • JS遍历对象属性的方法示例

    本文实例讲述了JS遍历对象属性的方法.分享给大家供大家参考,具体如下: 遍历JavaScript某个对象所有的属性名称和值的方法,这样想使用方法的时候非常的直观和方便.代码如下: /* * 用来遍历指定对象所有的属性名称和值 * obj 需要遍历的对象 * author: Jet Mah */ function allPrpos ( obj ) { // 用来保存所有的属性名称和值 var props = "" ; // 开始遍历 for ( var p in obj ){ // 方法

  • Python获取对象属性的几种方式小结

    本文将简单介绍四种获取对象的方法. 假如有以下的类: class Person(object): def __init__(self, name, age): self.name = name self.age = age def __str__(self): return 'name=%s, age=%s' % (self.name, self.age) 方法一:使用属性运算符 print(xmr.name) 方法二:通过属性字典__dict__ print(xmr.__dict__['nam

  • Python类及获取对象属性方法解析

    1.类外面添加对象属性 class Washer(): def wash(self): print('do some laundry stuff') haier1 = Washer() #添加属性,对象名.属性名 = 值 haier1.width = 400 haier1.height = 500 对象属性既可以在类外面添加和获取,也可以在类里面添加和获取 在类外面获取对象属性: 在上方代码上添加: print(f'洗衣机宽度为{haier1.width}') print(f'洗衣机高度为{ha

  • JS判断对象属性是否存在的五种方案分享

    目录 背景 检查属性是否存在 in Reflect.has() hasOwnProperty 构造函数法 对象字面量 缺点 覆盖报错 Object.prototype.hasOwnProperty() ES13(ES2022)Object.hasOwn() 总结 背景 在这篇Accessible Object.prototype.hasOwnProperty()提案中,提出了一个更简单的方法来检查对象时候具有特定的属性- Object.hasOwn(),主要目标是用来替代Object.proto

  • js获取对象、数组的实际长度,元素实际个数的实现代码

    js获取对象.数组的实际长度,元素实际个数的实现代码 /*获取对象.数组的长度.元素个数 *@param obj 要计算长度的元素,可以为object.array.string */ function count(obj){ var objType = typeof obj; if(objType == "string"){ return obj.length; }else if(objType == "object"){ var objLen = 0; for(v

  • js 获取站点应用名的简单实例

    一直用EL表达式${pageContext.request.contextPath}来传递应用名,在用到JS中时,很麻烦,虽然也可以用,但是加大了代码复杂度,因此这里推荐用JS获取应用名 function getContextPath() { var contextPath = document.location.pathname; var index =contextPath.substr(1).indexOf("/"); //这个地方可能有问题,要根据具体项目适当修改 contex

随机推荐