刷题-js对象-属性遍历

为了加强js对象的认知,又刷了一题。

直接上题目:

找出对象 obj 不在原型链上的属性(注意这题测试例子的冒号后面也有一个空格~)
1、返回数组,格式为 key: value
2、结果数组不要求顺序

示例:

//输入
var C = function() {this.foo = 'bar'; this.baz = 'bim';}; 

C.prototype.bop = 'bip'; 

iterate(new C());


//输出

["foo: bar", "baz: bim"]

//函数体
function iterate(obj) {
  //内容
}

解题思路,iterate接收的函数obj,先打印出来。

{foo: "bar", baz: "bim"}

输出数组,很简单。

for in 循环,修改iterate函数

function iterate (obj){
  for(var key in obj){
       //这里用中括号是因为,key 是一个带引号的字符  
       return key + ":" + obj[key]          
    }  
}

//返回

foo:bar
baz:bim
bop:bip

怎么多一个,但是我打印obj的时候,只有两个啊。

看了下for in ,只遍历一个对象的可枚举属性。

可枚举属性是啥?

可枚举属性是指那些内部 “可枚举” 标志设置为 true 的属性,对于通过直接的赋值和属性初始化的属性,该标识值默认为即为 true。可枚举的属性可以通过 for...in 循环进行遍历(除非该属性名是一个 Symbol)。属性的所有权是通过判断该属性是否直接属于某个对象决定的,而不是通过原型链继承的。一个对象的所有的属性可以一次性的获取到。有一些内置的方法可以用于判断、迭代/枚举以及获取对象的一个或一组属性,下表对这些方法进行了列举。对于部分不可用的类别,下方的示例代码对获取方法进行了演示。

 相关链接:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Enumerability_and_ownership_of_properties

个人理解:for in 循环是可枚举属性,其实就是对象初始化的值,和后来通过直接给值 xx.proprototype.one = '11'这种方式,如果要访问

console.log(obj.__proto__)

//返回

{bop: "bip", constructor: ƒ}

判断不可枚举的属性

in: 返回布尔值,有返回 true

if(!key in bop){
  //push 进数组  
}

propertyIsEnumerable():返回布尔值,有返回 true

if(!obj[key].propertyIsEnumerable('bip')){
  //接着执行  
}

hasOwnProperty() 方法会返回一个布尔值,指示对象自身属性中是否具有指定的属性

if(!key.hasOwnProperty('bip')){
  //继续执行  
}

Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组。

return Object.getOwnPropertyNames(obj).map(function (key){
   //因为后面添加属性只会从后面添加 
    return key + ":" + obj[key]

})

Object.getOwnPropertyNames() 返回一个数组,该数组对元素是 obj自身拥有的枚举或不可枚举属性名称字符串。 数组中枚举属性的顺序与通过 for...in 循环(或 Object.keys)迭代该对象属性时一致。数组中不可枚举属性的顺序未定义。

return Object.getOwnPropertyNames(obj).map(function (key){
   //因为后面添加属性只会从后面添加 
    return key + ":" + obj[key]

})

这些是官方推荐的方法,具体的用法可以看上面的链接。

都可以实现上面的题目,可能会有一些兼容的问题,导致提交出错。

这里面 使用 hasOwnProperty 和 getOwnPropertyNames 都可以提交,不知道测试的内容到底是啥,Object.keys(obj),用他来循环push进去,因为返回的数组是三个,而value值是4个,第四个就是后面加上去的,所以这种方式也是可以的,这里推荐比较好的方法。

getOwnPropertyNames 

return Object.getOwnPropertyNames(obj).map(function (key) {
        return key + ': ' + obj[key];
    });

一道小小的题目,对于对象的基础知识算是一个考验。

原文地址:https://www.cnblogs.com/damai/p/8710081.html