javascript中的for循环和for...in循环还是有些区别的,比如定义一个数组,然后用for..in循环输出

var array=[1,2,3,4,5,6];

for(var s in array)

{

console.log(s+' ');

}

输出的结果是0 1 2 3 4 5 竟然不是输出1-6。然后又定义了个比较有区分的(姑且这么叫吧)数组

var array=['jack','marry','jackson'];

for(var s in array)

{

console.log(s+' ');

}

输出0 1 2 这样看起来for..in输出的是数组的索引,而不是数组内容,以前在学习C#的时候for..in输出的是数组中的原始值,而不是索引 。

但是如果是定义一个对象,对象中有属性,并且给属性赋初始值,那么用for..in输出的是属性名,且看下面:

var obj = new Object();

obj.name = '大象';

obj.value1 = '12';

obj.value2 = '334';

for (var items in obj) {

console.log(items);

}

输出的是 name、 value1、 value2。这样看来在对象中属性就相当于对象中的索引。

看看下面的例子:

var array =["admin","manager","db"];

//给Array的原型添加一个name属性

Array.prototype.name= "zhangsan";

for(var i in array){

alert(array[i]);

}

运行结果:

admin

manager

db

zhangsan

奇观了,怎么平白无故的冒出来一个zhangsan

现在,再看看使用 for循环会怎样?

vararray = ["admin","manager","db"];

//给Array的原型添加一个name属性

Array.prototype.name = "zhangsan";

for(var i =0 ; i<array.length; i++){

alert(array[i]);

};

运行结果:

admin

manager

db

现在明白了,for..in循环会把某个类型的原型(prototype)中方法与属性给遍历出来,所以这可能会导致代码中出现意外的错误。为了避免这个问题,我们可以使用对象的hasOwnProperty()方法来避免这个问题,如果对象的属性或方法是非继承的,那么hasOwnProperty() 方法返回true。即这里的检查不涉及从其他对象继承的属性和方法,只会检查在特定对象自身中直接创建的属性。

再看看下面的例子:

vararray = ["admin","manager","db"];

Array.prototype.name= "zhangshan";

for(vari in array){

//如果不是该对象自身直接创建的属性(也就是该属//性是原型中的属性),则跳过显示

if(!array.hasOwnProperty(i)){

continue;

}

alert(array[i]);

运行结果:

admin

manager

db

javascript中的for in循环和for in循环的使用陷阱的更多相关文章

  1. 浅谈JavaScript中的Function引用类型

    引言 在JavaScript中最有意思的就是函数了,这一切的根源在于函数实际上是一个对象.每一个函数都是Function类型的实例,而且都和其他引用类型的实例一样具有属性和方法.函数作为一个对象,因此 ...

  2. JavaScript中让Html页面中循环播放文字

    JavaScript中让Html页面中循环播放文字 <html> <head> <meta http-equiv="Content-Type" con ...

  3. 深入了解 JavaScript 中的 for 循环

    在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循 ...

  4. Javascript中的循环变量声明,到底应该放在哪儿?

    相信很多Javascript开发者都在声明循环变量时犹豫过var i到底应该放在哪里:放在不同的位置会对程序的运行产生怎样的影响?哪一种方式符合Javascript的语言规范?哪一种方式和ecma标准 ...

  5. JavaScript中for..in循环陷阱介绍

    for...in循环中的循环计数器是字符串,而不是数字它包含当前属性的名称或当前数组元素的索引,下面有个不错的示例大家可以参考下   大家都知道在JavaScript中提供了两种方式迭代对象: (1) ...

  6. javascript中for/in循环及使用技巧

    JavaScript 支持不同类型的循环: for - 循环代码块一定的次数 for/in - 循环遍历对象的属性 while - 当指定的条件为 true 时循环指定的代码块 do/while - ...

  7. Javascript中while和do-while循环用法详解

    while循环 while 语句与 if 语句相似,都有条件来控制语句(或语句块)的执行,其语言结构基本相同:while(conditions){    statements;} while 语句与 ...

  8. 深入了解JavaScript中的for循环

    在ECMAScript5中,有三种for循环,分别是: 简单for循环 for-in forEach 在ES6中,新增了一种循环 for-of 简单for循环 const arr = [1, 2, 3 ...

  9. JavaScript中的for in循环

    在学习AJAX的时候,发现JavaScript中for in循环,这种循环对于遍历JSON是很好用的.于是写下了这篇博文 作用 for in循环本质上是forEach循环,它主要有两个作用 遍历数组 ...

  10. 让你高效的理解JavaScript中的同步、异步和事件循环

    "同步请求","异步请求"相信这两词在程序猿的世界中频频出现,到底是词性的妖娆,还是撸代码的基础要求,下面直接分享本人学习的好东西,保证让你深入浅出,爽得不要不 ...

随机推荐

  1. Java设计模式学习记录-桥接模式

    前言 这次介绍结构型设计模式中的第二种模式,桥接模式. 使用桥接模式的目的就是为了解耦,松散的耦合更利于扩展,但是会增加相应的代码量和设计难度. 桥接模式 桥接模式是为了将抽象化与实现化解耦,让二者可 ...

  2. 复制神器Ditto使用方法详细说明

    1.普通的粘贴快捷键设置: 我设置成ctrl+1 --> ctrl+10.但是注意,有些程序里ctrl有特殊功能,这样ctrl+[0-9]键会出现问题,所以建议将粘贴快捷键设置的复杂一点,例如c ...

  3. SpringMVC+jquery.uploadify 上传文件

    前言 以前用Asp.net MVC+uploadify上传文件,最近学习SpringMVC,所以就用SpringMVC+uploadify做个上传文件的demo. 刚开始用form表单的方式提交,在C ...

  4. Spring JDBCTemplate连接SQL Server之初体验

    前言 在没有任何框架的帮助下我们操作数据库都是用jdbc,耗时耗力,那么有了Spring,我们则不用重复造轮子了,先来试试Spring JDBC增删改查,其中关键就是构造JdbcTemplate类. ...

  5. AngularJS+Ionic开发-1.搭建开发环境

    临时项目需要使用AngularJS+Ionic+Cordova技术,半年前跟别人用过一段时间做过几个页面,目前别人已经无法联系了,只能我自己上了. 上次做完项目后,想抽时间好好巩固一下这方面的知识面来 ...

  6. 【Linux】Centos之安装Nginx及注意事项

    相关内容链接 [Linux]nginx常用命令 [nginx]详细配置说明 1.Nginx的简单说明 a.  Nginx是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务 ...

  7. BZOJ2820: YY的GCD(反演)

    题解 题意 题目链接 Sol 反演套路题.. 不多说了,就是先枚举一个质数,再枚举一个约数然后反演一下. 最后可以化成这样子 \[\sum_{i = 1}^n \frac{n}{k} \frac{n} ...

  8. JMeter 配置元件之计数器Counter

    配置元件之计数器Counter   by:授客 QQ:1033553122 测试环境 apache-jmeter-2.13 1.   计数器简介 允许用户创建一个在线程组范围之内都可以被引用的计数器. ...

  9. beego+vue父子组件通信(父子页面传值、父子组件传值、父子路由传值)

    场景:有head和foot,为父组件 侧栏tree为子组件 点击tree,右侧孙组件根据点击tree的id,来更改表格内容. 首先是父子(本例中是子组件与孙组件)通信,目前是父传到子,暂时还没有子传到 ...

  10. Spring 事件

    JDK事件 java通过java.util.EventObject类和java.util.EventListener接口描述事件和监听器 事件源,事件的产生者,任何一个EventObject都必须拥有 ...