javascript中的for in循环和for循环的使用

javascript for...in 语句

for...in 语句用于对数组或者对象的属性进行循环操作。

for ... in 循环中的代码每执行一次,就会对数组的元素或者对象的属性进行一次操作。

Tip:for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。

语法:

for (变量 in 对象)
{
    在此执行代码
}

“变量”用来指定变量,指定的变量可以是数组元素,也可以是对象的属性。

实例:使用 for ... in 循环遍历数组。

<html>
<body>
<script type="text/javascript">
var x
var mycars = new Array()
mycars[0] = "Saab"
mycars[1] = "Volvo"
mycars[2] = "BMW"
for (x in mycars)
{
document.write(mycars[x] + "<br />")
}
</script>
</body>
</html>

应用可见这里:http://caibaojian.com/js-max-repeat.html

注意一:for in循环不会按照属性的下标来排列输出。http://www.cnblogs.com/rubylouvre/p/3396042.html

"first":"first",
   "zoo":"zoo",
  "2":"2",
  "34":"34",
  "1":"1",
  "second":"second"
};
for (var i in obj) { console.log(i); };
输出:
1
2
34
first
zoo
second

执行时按chrome执行,先把当中的非负整数键提出来,排序好输出,然后将剩下的定义时的顺序输出。由于这个奇葩的设定,让avalon的ms-with对象排序不按预期输出了。只能强制用户不要以纯数字定义键名。

实例1:在数组的原型对象上定义了一个新的属性,使用for循环没出现问题

function getNewArray(){
var array=[1,2,3,4,5];
Array.prototype.age=13;
var result = [];
for(var i=0;i<array.length;i++){
result.push(array[i]);
}
alert(result.join(‘‘));
}

实例2:采用了for in循环,但是给我们期望的一样还是得到了12345的正确结果

function getArrayTwo(){
var array=[1,2,3,4,5 ];
var result=[];
for(var i in array){
result.push(array[i]);
}
alert(result.join(‘‘));
}

实例3:给原型添加属性之后,默认情况下枚举,最后输出1234513

function getNewArrayTwo(){
var array=[1,2,3,4,5 ];
Array.prototype.age=13;
var result=[];
for(var i in array){
result.push(array[i]);
}
alert(result.join(‘‘));
}

所以建议不要对数组执行for in循环,事实上,在高性能javascript这本书中,也强调了for in循环的不好,因为它总是会访问该对象的原型,看下原型上是否有属性,这在无意中就给遍历增加了额外的压力。

解决方法:

如果某个对象具有给定名称的属性,那么Object.prototype.hasOwnProperty(name)返回true。如果该对象是从原型链中继承了该属性,或者根本没有这样的一个属性,则返回false。通过hasOwnProperty限定for in循环在当前中遍历,而不用去考虑它的原型属性。

function finalArray(){
var array=[1,2,3,4,5 ];
Array.prototype.age=13;
var result=[];
for(var i in array){
if(array.hasOwnProperty(i)){
result.push(array[i]);
}
}
alert(result.join(‘‘));
}

注意事项:

有一部分浏览器,例如早期的safari浏览器,不支持这个方法

时间: 2025-01-05 05:53:35

javascript中的for in循环和for循环的使用的相关文章

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

for...in循环中的循环计数器是字符串,而不是数字它包含当前属性的名称或当前数组元素的索引,下面有个不错的示例大家可以参考下 大家都知道在JavaScript中提供了两种方式迭代对象: (1)for 循环: (2)for..in循环: 使用for循环进行迭代数组对象,想必大家都已经司空见惯了.但是,使用for.. in循环时,大家可要注意了,为什么这么说呢?大家听我娓娓道来.... javascript提供了一种特殊的循环(也就是for .. in循环),用来迭代对象的属性或数组的每个元素,

JavaScript基础Javascript中的循环

1.普通循环JavaScript中一般的循环写法是这样的: // sub-optimal loop for (var i = 0; i < myarray.length; i++) { // do something with myarray[i] } 这种写法的问题是,每循环一次,都需要从myarray对象中读取length属性,这对于JavaScript来说,可能会导致较大的性能问题.如果myarray是一些大型的对象,或是DOM对象更犹是如此,因为DOM对象的这些方法都是在执行时才进行查询

深入了解 JavaScript 中的 for 循环

学习前端的同学注意了!!! 学习过程中遇到什么问题或者想获取学习资源的话,欢迎加入前端学习交流群,群号码:328058344   在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循环,是: for-of 下面我们就来看看这 4 种 for 循环. 简单 for 循环 下面先来看看大家最常见的一种写法: const arr = [1, 2, 3];

javascript中各种循环总结

我们如何遍历数组中的元素?20年前JavaScript刚萌生时,你可能这样实现数组遍历: 1 var arr=["one","two","three"]; 2 for(var i=0;i<arr.length;i++){ 3 document.write(arr[i]); 4 }   自ES5正式发布后,你可以使用内建的forEach方法来遍历数组: myArray.forEach(function (value) { console.lo

JavaScript 中 for 循环

在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循环,是: for-of 下面我们就来看看这 4 种 for 循环. 简单 for 循环 下面先来看看大家最常见的一种写法: 1 2 3 4 const arr = [1, 2, 3]; for(let i = 0; i < arr.length; i++) {     console.log(arr

Javascript中的循环

Javascript中有两种循环的方法for循环和for-in循环 for循环主要用来循环数组,for-in循环应该用来遍历非数组对象.从技术上来说,for-in循环也可以用来遍历数组(JS中数组也是对象),但这样做并不是很好,当该数组被自定义函数扩大后,有可能导致逻辑上的错. for循环的常规写法 for(var i = 0; i < myarray.length; i++){ //对myarray[i]进行操作 } 在常规写法中,每次循环时都要重新访问计算数组的长度,将会导致代码运行速度下降

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

不放走任何一个细节.相信很多Javascript开发者都在声明循环变量时犹豫过var i到底应该放在哪里:放在不同的位置会对程序的运行产生怎样的影响?哪一种方式符合Javascript的语言规范?哪一种方式和ecma标准未来的发展方向匹配?本文将对四种常见的声明循环变量的书写方式进行简单的分析和比较. 习惯1:不声明直接使用 function loop(arr) { for (i = 0; i < arr.length; i++) { // do something } } 非常危险的使用习惯,

深入理解javascript中的事件循环event-loop

前面的话 本文将详细介绍javascript中的事件循环event-loop 线程 javascript是单线程的语言,也就是说,同一个时间只能做一件事.而这个单线程的特性,与它的用途有关,作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM.这决定了它只能是单线程,否则会带来很复杂的同步问题.比如,假定JavaScript同时有两个线程,一个线程在某个DOM节点上添加内容,另一个线程删除了这个节点,这时浏览器应该以哪个线程为准? 为了利用多核CPU的计算能力,HTML

JavaScript 中的12种循环遍历方法

题目:请介绍 JavaScript 中有哪些循环和遍历的方法,说说它们的应用场景和优缺点? 1.for 循环 let arr = [1,2,3];for (let i=0; i<arr.length; i++){ console.log(i,arr[i])}// 0 1// 1 2// 2 3 for 循环是 Js 中最常用的一个循环工具,经常用于数组的循环遍历. 2.for in 循环 let obj = {name:'zhou',age:'**'}for(let i in obj){ con

JavaScript中的if循环语句

<html> <head>  <meta charset="UTF-8">  <title></title>  <script type="text/javascript">   /*    * 向页面中输出连续数字    */   //document.write(1);   var n=1;   document.write(n++ + "<br />");