for in 与 Object.keys 与 hasOwnProperty区别

1、结论

for in遍历对象所有可枚举属性 包括原型链上的属性

Object.keys遍历对象所有可枚举属性 不包括原型链上的属性

hasOwnProperty 检查对象是否包含属性名,无法检查原型链上是否具有此属性名

2、示例代码

<!DOCTYPE html>
<html lang="zh">

    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="X-UA-Compatible" content="ie=edge" />
        <title>for in 与 Object.keys 与 hasOwnProperty区别</title>
    </head>

    <body>
        <script type="text/javascript">
            var aa = [12, 34, 5];
            Array.prototype.add = function() {}
            for(let i in aa) {
                console.log(i);
                //输出0 1 2 add
            }
            console.log(‘--------------‘)
            console.log(Object.keys(aa));
            //输出0 1 2 

            console.log(aa.hasOwnProperty(‘add‘))
            //输出false
            console.log(aa.hasOwnProperty(‘0‘))
            //输出true
        </script>
    </body>

</html>

3、ESLINT对for in的限制

当你在某个对象上用 for in 语句遍历对象属性,而又忘了用 hasOwnProperty 判断属性来源的时候,你就会发现被你扩展的原型属性也会被遍历出来,这往往都不是我们想要的结果。

总的来说,操作中引入继承的属性会让问题复杂化,大多数时候,我们只关心对象自身的属性。所以,尽量不要用for...in循环,而用Object.keys()代替

ES2017 引入了跟Object.keys配套的Object.valuesObject.entries,作为遍历一个对象的补充手段,供for...of循环使用。

let {keys, values, entries} = Object;
let obj = { a: 1, b: 2, c: 3 };

for (let key of keys(obj)) {
  console.log(key); // ‘a‘, ‘b‘, ‘c‘
}

for (let value of values(obj)) {
  console.log(value); // 1, 2, 3
}

for (let [key, value] of entries(obj)) {
  console.log([key, value]); // [‘a‘, 1], [‘b‘, 2], [‘c‘, 3]
}

原文地址:https://www.cnblogs.com/mengfangui/p/9041705.html

时间: 2024-10-11 16:34:43

for in 与 Object.keys 与 hasOwnProperty区别的相关文章

对象是否拥有某个属性,in和for in以及object.hasOwnProperty(&#39;&#215;&#215;&#215;&#39;)的异同,以及Object.defineProperty(),Object.keys(),Object.getOwnPropertyNames()的用法

1.在某个对象是否拥有某个属性,判断的方法有很多,常用的方法就是object.hasOwnProperty('×××'),这个方法是不包括对象原型链上的方法的,举个例子: var obj = { name:'fei' } console.log(obj.hasOwnProperty('name'))//true console.log(obj.hasOwnProperty('toString'))//false 在这个例子中,obj对象存在的name属性的时候,调用这个方法才是返回true,我们

Object.keys、Object.getOwnPropertyNames区别

定义 Object.keys 定义:返回一个对象可枚举属性的字符串数组: Object.getOwnPropertyNames 定义:返回一个对象可枚举.不可枚举属性的名称: 属性的可枚举性.不可枚举性 定义:可枚举属性是指那些内部 “可枚举” 标志设置为 true 的属性,对于通过直接的赋值和属性初始化的属性,该标识值默认为即为 true,对于通过 Object.defineProperty 等定义的属性,该标识值默认为 false. 例子 var obj = { "prop1":

for in,Object.keys()与for of的用法与区别

Array.prototype.sayLength=function(){ console.log(this.length); } let arr = ['a','b','c','d']; arr.name='数组'; Object.defineProperties(arr,{ type:{ value:true, writable:true, enumerable:true } }) // for in 一般用于遍历对象的属性: 1.作用于数组的for in除了会遍历数组元素外,还会遍历自定义

object.keys()与for in的区别

object.keys()返回一个数组,数组值为对象自有的属性,不会包括继承原型的属性 for in:遍历对象可枚举属性,包括自身属性,以及继承自原型的属性 原文地址:https://www.cnblogs.com/superclound/p/11247708.html

在原生不支持的旧环境中添加兼容的 Object.keys

1 if (!Object.keys) { 2 Object.keys = (function () { 3 var hasOwnProperty = Object.prototype.hasOwnProperty, //原型上的方法,只取自身有的属性: 4 hasDontEnumBug = !({toString: null}).propertyIsEnumerable('toString'), //ie6一下,!之后的内容为false; 5 dontEnums = [ 6 'toString

in操作符/Object.keys()/ Object.getOwnPropertyNames()

in操作符 1.单独使用,判断是否能通过某个实例访问到某个属性 function Person(){ } Person.prototype.name = "Nicholas"; Person.prototype.age = 29; Person.prototype.job = "Software Engineer"; Person.prototype.sayName = function(){ alert(this.name); }; var person1 = n

javascript中 for in 、for 、forEach 、for of 、Object.keys().

一 .for ..in 循环 使用for..in循环时,返回的是所有能够通过对象访问的.可枚举的属性,既包括存在于实例中的属性,也包括存在于原型中的实例.这里需要注意的是使用for-in返回的属性因各个浏览器厂商遵循的标准不一致导致对象属性遍历的顺序有可能不是当初构建时的顺序.(实例+原型中的可枚举属性) 1.遍历数组 虽然for..in主要用于遍历对象的属性,但同样也可以用来遍历数组元素. 2:for..in和for遍历数组时下标类型不一样 var colors = ['red', 'gree

对象属性 Object.getOwnPropertyNames() Object.keys for...in

1.Object.getOwnPropertyNames()方法返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括Symbol值作为名称的属性)组成的数组. Object.getOwnPropertyNames(obj) 参数obj是一个对象,其自身的可枚举和不可枚举属性的名称被返回. 返回值是:在给定对象上找到的自身属性对应的字符串数组. 实例: var arr = ["a", "b", "c"]; console.log(Ob

in、Object.keys

for in 会遍历对象.数组以及该对象原型链上可以枚举的属性 返回的结果都是String类型 在某些情况下,遍历数组的顺序可能是随机的 1234567891011121314 Array.prototype.getLength = function() { return this.length;};var arr = ['a', 'b', 'c'];arr.name = 'June';Object.defineProperty(arr, 'age', { enumerable: true, v