不要用for in语句对数组进行遍历
for...in主要用于对数组和对象的属性进行遍历。for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。
语法:for (variable in object) {...}
variable:每次迭代,一个不同的属性名将会赋予variable。object:可枚举属性被迭代的对象。
对数组操作
var a=[5,4,3,2,1];
var x=0;
console.log(typeof x);//number
for (x in a) {
console.log("a["+x+"]: "+a[x]);
console.log(typeof x);//string
}
console.log(x);//
console.log(typeof x);//string
//output:
// a[0]: 5
// a[1]: 4
// a[2]: 3
// a[3]: 2
// a[4]: 1
可以发现在for in函数中变量以字符串的形式出现,这时候在函数中操作a[x+1]的话是无效的,x+1会进行字符串拼接。
对象操作
var obj={"1":"first",
"two":"zoo",
"3":"2",
"three":"34",
"4":"1",
"2":"second"
};
for (var i in obj) {
console.log(i+":"+obj[i]);
};
//output:
//1:first
//2:second
//3:2
//4:1
//two:zoo
//three:34
可发现,for...in 并不能够保证返回的是按一定顺序的索引,但是它会返回所有可枚举属性,包括继承属性。
给原型添加属性之后,默认情况下枚举,会把原型属性一并输出,如下所示。由于它总是会访问该对象的原型,看下原型上是否有属性,这在无意中就给遍历增加了额外的压力。
例:
function fun4(){
var a=[1,2,3,4,5];
Array.prototype.age=13;
for(var i in a){
console.log("a["+i+"]: "+a[i]);
}
}
//outuput:
//a[0]: 1
//a[1]: 2
//a[2]: 3
//a[3]: 4
//a[4]: 5
//a[age]: 13
解决方法:
如果你只要考虑对象本身的属性,而不是它的原型,那么使用 getOwnPropertyNames() 或执行 hasOwnProperty() 来确定某属性是否是对象本身的属性 (也能使用propertyIsEnumerable)。
下面利用 hasOwnProperty() 的方法使隐藏的继承属性不会被显示。如果该对象是从原型链中继承了该属性,或者根本没有这样的一个属性,则返回false。如果某个对象具有给定名称的属性,则返回true。
function fun4(){
var a=[1,2,3,4,5];
Array.prototype.age=13;
for(var i in a){
if( a.hasOwnProperty( i ) ) {
console.log("a["+i+"]: "+a[i]);
}
}
}
//outuput:
//a[0]: 1
//a[1]: 2
//a[2]: 3
//a[3]: 4
//a[4]: 5
在迭代进行时被添加到对象的属性,可能在之后的迭代被访问,也可能被忽略。通常,在迭代过程中最好不要在对象上进行添加、修改或者删除属性的操作,除非是对当前正在被访问的属性。这里并不保证是否一个被添加的属性在迭代过程中会被访问到,不保证一个修改后的属性(除非是正在被访问的)会在修改前或者修改后被访问,不保证一个被删除的属性将会在它被删除之前被访问。
Note: 意思就是尽量不要对数组对象使用for in遍历。
不要用for in语句对数组进行遍历的更多相关文章
- Java使用foreach语句对数组成员遍历输出
/** * 本程序使用foreach语句对数组成员进行遍历输出 * @author Lei * @version 2018-7-23 */ public class ForeachDemo { pub ...
- Javascript技巧之不要用for in语句对数组进行遍历
一,为什么不要用for in语句 jqModal这个jquery插件估计很多人都使用过,在jqModal源码内部,有一个函数为hs,其中有个嵌套循环如下, for(var i in {jqmShow: ...
- 使用typedef语句定义数组类型
使用typedef语句定义数组类型 1. 一维数组类型的定义格式 typedef <元素类型关键字><数组类型名>[<常量表达式>]; 例如: (1) ty ...
- 使用foreach语句对数组成员进行遍历
/*** 使用foreach语句对数组成员进行遍历* **/ public class ForeachDemo { public static void main(String[] args) { i ...
- for+next()实现数组的遍历及while list each 的使用
//要求使用for循环语句来完成该数组的遍历//输出每一项的键名和对应值: $a = array( 'a' => 34, 5 => 51, ...
- 手写js代码(一)javascript数组循环遍历之forEach
注:原文地址http://blog.csdn.net/oscar999/article/details/8671546 我这里是仿照学习! 1.js的数组循环遍历 ①数组的遍历首先想到的是for()循 ...
- 初识Javascript.03 -- switch、自增、while循环、for、break、continue、数组、遍历数组、合并数组concat
除了注意大小写,别的木啥了 Switch语句 Switch(变量){ case 1: 如果变量和1的值相同,执行该处代码 break; case 2: 如果变量和2的值相同,执行该处代码 break; ...
- java 数组声明定义 数组内存分配 数组初始化 数组引用 数组的遍历
一,数组的定义 Java 中定义数组的语法有两种: 1. type arrayName[]; 2. type[] arrayName;type 为Java中的任意数据类型,包括基本类型和组合类型,ar ...
- PHP之旅3 php数组以及遍历数组 以及each() list() foreach()
php的数组的定义 <?php //php中定义数组时可以通过索引直接进行赋值: $mArr[0]="哈哈"; $mArr[1]=70; $mArr[2]='haha'; e ...
随机推荐
- 了解vue
什么是Vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. 状态,其实指的是实例之间的 ...
- 关于 百度 Ueditor (在chrome浏览器) 上传图片时 打开文件夹的延迟问题
在使用 ueditor 开发时, 作为一个web文本编辑器使用时. 当点击上传图片时, 文件夹要延迟好久才能打开. 解决: 针对多图片上传, 将/ueditor/dialogs/image/image ...
- selenium+python自动化84-chrome手机wap模式(登录淘宝页面)
前言 chrome手机wap模式登录淘宝页面,点击验证码无效问题解决. 切换到wap模式,使用TouchActions模块用tap方法触摸 我的环境 chrome 62 chromedriver 2. ...
- 下载Chrome独立版(alternate/offline Installer)的地方
因为Great fire wall,Chrome无法更新,下载独立版(alternate/offline Installer)的地方 很多朋友可以用proxy firefox访问google,却无法让 ...
- C语言中字符串存储方法
众所周知,C语言中没有数据类型能够存储字符串, char数据类型仅仅能够存储一个字符的数据,那么在C语言中关于存储字符串这一难题我们改何去何从呢? 下面将详述相关的字符串存储方法; 1,使用字符数组存 ...
- kubernet使用笔记
centos7.3下安装及部署:http://www.linuxidc.com/Linux/2017-02/140723.htm
- mock 测试 MVC
SpringMVC测试框架 基于RESTful风格的SpringMVC的测试,我们可以测试完整的Spring MVC流程,即从URL请求到控制器处理,再到视图渲染都可以测试. 一 MockMvcBui ...
- VBA 编写类
一.初识类 现在,请打开你的VBE,主菜单-插入-类模块. 插入了一个类模块,也就建立了一个类.类模块的名字就是类的名字.你现在看到的,她的名字叫“类1”,这是VBA按她姐妹排行给她取的的,是的,VB ...
- 14 ConfigParse模块
1.ConfigParse模块的基本概念 此模块用于生成和修改常见配置文档. ConfigParser 是用来读取配置文件的包. 配置文件的格式如下:中括号“[ ]”内包含的为section.sect ...
- UI5-文档-4.33-Routing Back and History
现在我们可以导航到细节页面并显示发票,但是还不能回到概览页面.我们将向细节页面添加一个back按钮,并实现一个函数,再次显示概述页面. Preview A back button is now dis ...