javascript中for/in循环及使用技巧
JavaScript 支持不同类型的循环:
for - 循环代码块一定的次数
for/in - 循环遍历对象的属性
while - 当指定的条件为 true 时循环指定的代码块
do/while - 同样当指定的条件为 true 时循环指定的代码块
1. in运算符:要求其左边的运算数是一个字符串,或可以被转换为字符串,右边的运算数是一个对象或数组。如果该运算符左边的值是右边对象的一个属性名,则返回true。
例如:
var point={x:1,y:2}; //对象直接量
var has_x="x" in point; //返回true
var has_z="z" in point; //返回false
var ts="toString" in point;//返回true,toString为继承方法
2. for/in语句:语法,
for (variable in object)
statement;
提供了一种遍历对象属性的方法。
例:
for(var prop in my_object) {
document.write("name:"+prop+";value:"+my_object[prop],"<br>");
}
javascript的数组是一种特殊的对象,因此for/in循环可以像枚举对象属性一样枚举数组下标。
可以把一个对象的所有属性名复制到一个数组中,
例:
var o= {x:1,y:2,z:3};
var a=new Array();
var i=0;
for (a[i++] in o)
;//空语句,用于初始化数组
3. in运算符与for/in语句不同,for/in语句in的左边可以是声明一个变量的var语句,数组的一个元素或者是对象的一个属性,不能使字符串。
4. 数组常用的存取属性运算符是“[]”,而不是“.”。使用“[]”来命名属性名师字符串值,是动态的,可以在运行时改变,而不是一个标识符“.”。
例:
var stock_name= get_stock_name_from_user();//从用户处获取股票名
var share= get_number_of_shares();//得到股票数量
portfolio[stock_name]= share;//动态地创建数组股票,并为每支股票赋值
将该例子与for/in循环一起使用,当用户输入了他的投资组合,可以计算当前总值
var value= 0;
for (stock in portfolio) {
value +=get_share_value(stock)*portfolio[stock];
}
stock存取的是每支股票的名字。
portfolio[stock]存取的是每支股票的数量。
for-in循环
功能:遍历对象属性,把属性名和属性值都提出来
var obj = {
"key1":"value1",
"key2":"value2",
"key3":"value3"
};
function EnumaKey(){
for(var key in obj ){
alert(key);
}
}
function EnumaVal(){
for(var key in obj ){
alert(obj[key]);
}
}
EnumaKey(obj)
//key1 key2 key3
EnumaVal(obj)
//value1 value2 value3
数组也可以这样遍历,但不推荐,因为不能保证顺序,而且如果在Array的原型上添加了属性,这个属性也会被遍历出来。
for-in循环应该用在非数组对象的遍历上,使用for-in进行循环也被称为“枚举”。
从技术上将,你可以使用for-in循环数组(因为JavaScript中数组也是对象),但这是不推荐的。因为如果数组对象已被自定义的功能增强,就可能发生逻辑错误。另外,在for-in中,属性列表的顺序(序列)是不能保证的。所以最好数组使用正常的for循环,对象使用for-in循环。
javascript中for/in循环及使用技巧的更多相关文章
- 【前端】javascript中10常用的个小技巧总结
javascript中10常用的个小技巧总结 本文转自:http://www.cnblogs.com/libin-1/p/6756393.html 1. new Set() 可能有人知道ES6中提供了 ...
- 深入理解javascript中的事件循环event-loop
前面的话 本文将详细介绍javascript中的事件循环event-loop 线程 javascript是单线程的语言,也就是说,同一个时间只能做一件事.而这个单线程的特性,与它的用途有关,作为浏览器 ...
- [译]Javascript中的for循环
本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...
- [译]Javascript中的do-while循环
本文翻译youtube上的up主kudvenkat的javascript tutorial播放单 源地址在此: https://www.youtube.com/watch?v=PMsVM7rjupU& ...
- JavaScript中的事件循环机制跟函数柯里化
一.事件循环机制的理解 test();//按秒输出5个5 function test() { for (var i = 0; i < 5; i++) { setTimeout(() => ...
- 深入了解 JavaScript 中的 for 循环
在ECMAScript5(简称 ES5)中,有三种 for 循环,分别是: 简单for循环 for-in forEach 在2015年6月份发布的ECMAScript6(简称 ES6)中,新增了一种循 ...
- JavaScript中for..in循环陷阱介绍
for...in循环中的循环计数器是字符串,而不是数字它包含当前属性的名称或当前数组元素的索引,下面有个不错的示例大家可以参考下 大家都知道在JavaScript中提供了两种方式迭代对象: (1) ...
- JavaScript 中 for in 循环和数组的问题
本文由 伯乐在线 - ElvisKang 翻译,进林 校稿.未经许可,禁止转载!英文出处:adripofjavascript.com.欢迎加入翻译小组. JavaScript的for…in循环用于迭代 ...
- 深入了解JavaScript中的for循环
在ECMAScript5中,有三种for循环,分别是: 简单for循环 for-in forEach 在ES6中,新增了一种循环 for-of 简单for循环 const arr = [1, 2, 3 ...
随机推荐
- "自定义事件"的优点在哪里?
事实上我们可以通过bind绑定一个自定义事件,然后再通过trigger来触发这个事件.例如给element绑定一个hello事件,再通过trigger来触发这个事件: //给element绑定hell ...
- 从linux内核代码分析操作系统启动过程
朱宇轲 + 原创作品转载请注明出处 + <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 在本次的实验中, ...
- nyoj 106 背包问题
点击打开链接 背包问题 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 现在有很多物品(它们是可以分割的),我们知道它们每个物品的单位重量的价值v和重量w(1<=v ...
- Selenium 疑问之二:如何使页面滚动条移动到指定元素element的位置处?
在用selenium做测试时,会遇到需要操作的元素不在当前可视页面中的情况,如果是手工测试,自然很简单,手动拖拽滚动条到目标元素处即可. 那么,selenium如何实现这种情形呢?答案是需要借助Jav ...
- PHP获取文件目录dirname(__FILE__),getcwd()
以discuz x2.5为例 D:/www/upload2.5/test.php D:/www/upload2.5/source/class/class_test.php test.php文件如下 & ...
- AngularJs 入门系列-1 使用 AngularJs 搭建页面基本框架
每当看到前端程序员在脚本.样式.表单处理逻辑中苦苦挣扎的时候,我就在想,为什么不用Angular Js 呢? Angular Js 支持页面前端的 MVC 模式开发,在 Angular JS 的支持下 ...
- 关于 C/C++ 的文章
关于 C/C++ 的文章,以前写的博客在百度,百度关了,只能一个一个复制了,百度太.....
- 增量升级(省流量更新)的Android客户端实现
转载与 zhouhuiah的专栏 http://blog.csdn.net/zhouhuiah/article/details/16939937 本文在以上两篇博客的基础上再增加了异常处理,并将生成的 ...
- NOIP总结
拿到题目先写裸的暴力,暴力一定要写对,没想出正解有暴力垫底,想出了正解也可以拿来拍 过了样例之后一定要造数据测,数据越坑越好 一定要造极限数据,哪怕造不知道答案的数据都行,主要是检测RE和TLE,正确 ...
- Orchard官方文档翻译(八) 为站点增加博客
原文地址:http://docs.orchardproject.net/Documentation/Adding-a-blog-to-your-site 想要查看文档目录请用力点击这里 最近想要学习了 ...