javascript中的for in 和 in运算符

版权声明:本文为吴孔云博客原创文章,转载请注明出处并带上链接,谢谢。 https://blog.csdn.net/wkyseo/article/details/51218198

之前只知道有for in循环,不清楚in运算符。for in 和 in 遍历对象在原型上增加的属性也会遍历出来。 in运算符的规则:对运算符左右两个操作数的要求比较严格。in运算符要求第1个(左边的)操作数必须是字符串类型或可以转换为字符串类型的其他类型,而第2个(右边的)操作数必须是数组、对象或者new生成的对象。只有第1个操作数的值是第2个操作数的属性名,才会返回true,否则返回false。 for in 和in运算符的key在对象中是对象的属性,在Array中是数组的索引

for in

var obj = {
    "key1":"value1",
    "key2":"value2",
    "key3":"value3"
};
function enumeKey(){
    for(var key in obj ){
        console.log(key);
    }
}
enumeKey() //key1 key2 key3

数组的遍历无法保证顺序,尽量避免使用,for-in循环用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。所以最好数组使用正常的for循环(还可以使用ECMA-262 标准的for each),对象使用for-in循环。

// 对象
var man = {
   hands: 2,
   legs: 2,
   heads: 1
};

// 在代码的某个地方
// 一个方法添加给了所有对象
if (typeof Object.prototype.clone === "undefined") {
   Object.prototype.clone = function () {};
}

上面代码,我们有一个使用对象字面量定义的名叫man的对象。在man定义完成后的某个地方,在对象原型上增加了一个很有用的名叫 clone()的方法。此原型链是实时的,这就意味着所有的对象自动可以访问新的方法。为了避免枚举man的时候出现clone()方法,你需要应用hasOwnProperty()方法过滤原型属性。如果不做过滤,会导致clone()函数显示出来,在大多数情况下这是不希望出现的。

// 1.
// for-in 循环
for (var i in man) {
   if (man.hasOwnProperty(i)) { // 过滤
      console.log(i, ":", man[i]);
   }
}
/* 控制台显示结果
hands : 2
legs : 2
heads : 1
*/

// 2.
// 反面例子:
// for-in loop without checking hasOwnProperty()
for (var i in man) {
   console.log(i, ":", man[i]);
}
/*
控制台显示结果
hands : 2
legs : 2
heads : 1
clone: function()
*/

另外一种使用hasOwnProperty()的形式是取消Object.prototype上的方法,好处在于在man对象重新定义hasOwnProperty情况下避免命名冲突。

for (var i in man) {
   if (Object.prototype.hasOwnProperty.call(man, i)) { // 过滤
      console.log(i, ":", man[i]);
   }
}
//另外一种写法,方法变量缓存,jquery的大部分写法
var i, hasOwn = Object.prototype.hasOwnProperty;
for (i in man) {
    if (hasOwn.call(man, i)) { // 过滤
        console.log(i, ":", man[i]);
    }
}

javascript中in运算符

注意事项: 对于一般的对象属性需要用字符串指定属性的名称

var mycar = {make: "Honda", model: "Accord", year: 1998};
"make" in mycar  // returns true
"model" in mycar // returns true

//对于数组属性需要指定数字形式的索引值来表示数组的属性名称(固有属性除外,如length)。

// Arrays
var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
0 in trees        // returns true
3 in trees        // returns true
6 in trees        // returns false
"bay" in trees    // returns false (you must specify the index number,
                  // not the value at that index)
"length" in trees // returns true (length is an Array property)

//in的右边必须是一个对象,如:你可以指定一个用String构造器生成的,但是不能指定字符串直接量的形式:

var color1 = new String("green");
"length" in color1 // returns true
var color2 = "coral";
"length" in color2 // generates an error (color is not a String object)

//如果你使用delete操作符删除了一个属性,再次用in检查时,会返回false,如:

var mycar = {make: "Honda", model: "Accord", year: 1998};
delete mycar.make;
"make" in mycar;  // returns false

var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
delete trees[3];
3 in trees; // returns false


//如果你把一个属性值设为undefined,但是没有使用delete操作符,使用in检查,会返回true.

var mycar = {make: "Honda", model: "Accord", year: 1998};
mycar.make = undefined;
"make" in mycar;  // returns true


var trees = new Array("redwood", "bay", "cedar", "oak", "maple");
trees[3] = undefined;
3 in trees; // returns true

javascript对象运算符

  • in 判断左侧运算数是否为右侧运算数的成员
  • instanceof 判断对象是否属于某个类或构造函数
  • new 根据构造函数创建一个新的对象,并初始化该对象
  • delete 删除指定对象的属性,数组元素或变量
  • .及[] 存取对象和数组元素,如果把key赋值为变量var,只能用[var]
  • () 函数调用,改变运算符优先级等

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏企鹅号快讯

每周四更面试题:True+True=?

面试题:True + Ture == ? Python 的 “+” 号会根据操作对象数据类型的不同而进行重载,操作对象为数字类型时,它是算术运算符;操作对象为序...

20870
来自专栏海天一树

小朋友学C++(12):多态

(一) 先编写函数: #include <iostream> using namespace std; class Shape { protected:...

33860
来自专栏java初学

final关键字

407120
来自专栏三流程序员的挣扎

Python 自学二——类型

', '.join(['cats', 'rats', 'bats']) # 以 `, ` 分隔 'cats, rats, bats' s = 'cat ra...

19330
来自专栏互扯程序

大牛:你真的懂反射吗?

现在是资源共享的时代,同样也是知识分享的时代,如果你觉得本文能学到知识,请把知识与别人分享。

15130
来自专栏DannyHoo的专栏

为什么NSString要用Copy来修饰?

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u010105969/article/details/...

20120
来自专栏hbbliyong

Javascript构造函数

     构造函数注意事项: 1.默认函数首字母大写 2.构造函数并没有显示返回任何东西。new 操作符会自动创建给定的类型并返回他们,当调用构造函数时,new...

367110
来自专栏desperate633

浅谈Java的反射(Reflection)什么是反射?为什么我们需要反射?如何使用反射总结

反射被广泛运用在那些需要检查和控制改变在运行时的行为的程序中。反射的概念常常和自检(introspection)搞混。 维基百科中的自检(introspect...

26020
来自专栏深度学习之tensorflow实战篇

mongodb11天之屠龙宝刀(九)js函数入门:MongoDB基于js的数据类型修改

mongodb11天之屠龙宝刀(九)js函数入门:MongoDB基于js的数据类型修改 Mongodb并不提供Alter table这样的语句或者工具修...

35340
来自专栏进击的君君的前端之路

JavaScript基础笔记

25940

扫码关注云+社区

领取腾讯云代金券