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


Posted in Javascript onSeptember 01, 2015

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 相关文章推荐
使用focus方法让光标默认停留在INPUT框
Jul 29 Javascript
复制网页内容,粘贴之后自动加上网址的实现方法(脚本之家特别整理)
Oct 16 Javascript
JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法
Aug 03 Javascript
node.js缺少mysql模块运行报错的解决方法
Nov 13 Javascript
ionic cordova一次上传多张图片(类似input file提交表单)的实现方法
Dec 16 Javascript
AngularJS自定义指令之复制指令实现方法
May 18 Javascript
AngularJS创建一个上传照片的指令实例代码
Feb 24 Javascript
JavaScript实现京东购物放大镜和选项卡效果的方法分析
Jul 05 Javascript
js实现适配移动端的拖动效果
Jan 13 Javascript
JS自定义滚动条效果
Mar 13 Javascript
原生js+canvas实现下雪效果
Aug 02 Javascript
JS实现选项卡插件的两种写法(jQuery和class)
Dec 30 jQuery
jQuery仿淘宝网产品品牌隐藏与显示效果
Sep 01 #Javascript
JavaScript中this详解
Sep 01 #Javascript
JS实现的自定义右键菜单实例二则
Sep 01 #Javascript
jQuery中常用的遍历函数用法实例总结
Sep 01 #Javascript
jquery常用函数与方法汇总
Sep 01 #Javascript
js+CSS实现模拟华丽的select控件下拉菜单效果
Sep 01 #Javascript
JQuery自适应窗口大小导航菜单附源码下载
Sep 01 #Javascript
You might like
用JAVASCRIPT如何给&amp;lt;textarea&amp;gt;&amp;lt;/textarea&amp;gt;赋值
2007/04/20 Javascript
JavaScript 实现模态对话框 源代码大全
2009/05/02 Javascript
jQuery 树形结构的选择器
2010/02/15 Javascript
ExtJS 2.0 GridPanel基本表格简明教程
2010/05/25 Javascript
利用JQuery的load函数动态加载其它页面的内容的实现代码
2010/12/14 Javascript
EasyUI中的tree用法介绍
2011/11/01 Javascript
Javascript 页面模板化很多人没有使用过的方法
2012/06/05 Javascript
js导出table数据到excel即导出为EXCEL文档的方法
2013/10/10 Javascript
Jquery响应回车键直接提交表单操作代码
2014/07/25 Javascript
JavaScript实现穷举排列(permutation)算法谜题解答
2014/12/29 Javascript
JavaScript_ECMA5数组新特性详解
2016/06/12 Javascript
JS判断iframe是否加载完成的方法
2016/08/03 Javascript
使用BootStrapValidator完成前端输入验证
2016/09/28 Javascript
JavaScript页面实时显示当前时间实例代码
2016/10/23 Javascript
JavaScript实现垂直滚动条效果
2017/01/18 Javascript
完美实现js选项卡切换效果(二)
2017/03/08 Javascript
详解Vue使用 vue-cli 搭建项目
2017/04/20 Javascript
详解Nodejs mongoose
2018/06/10 NodeJs
vue+koa2实现session、token登陆状态验证的示例
2019/08/30 Javascript
vue请求服务器数据后绑定不上的解决方法
2019/10/30 Javascript
vue 页面跳转的实现方式
2021/01/12 Vue.js
原生js实现自定义滚动条
2021/01/20 Javascript
python中常用检测字符串相关函数汇总
2015/04/15 Python
Python对字符串实现去重操作的方法示例
2017/08/11 Python
详解Python装饰器
2019/03/25 Python
Python面向对象之Web静态服务器
2019/09/03 Python
Python中实现输入超时及如何通过变量获取变量名
2020/01/18 Python
PyTorch中Tensor的数据类型和运算的使用
2020/09/03 Python
AmazeUi Tree(树形结构) 应用小结
2020/08/17 HTML / CSS
科颜氏美国官网:Kiehl’s美国
2017/01/31 全球购物
丝绸和人造花卉、植物和树木:Nearly Natural
2018/11/28 全球购物
银行会计财务工作个人的自我评价
2013/10/29 职场文书
幼儿园的门卫岗位职责
2014/04/10 职场文书
公司出纳岗位职责
2015/03/31 职场文书
Python使用openpyxl批量处理数据
2021/06/23 Python
windows系统安装配置nginx环境
2022/06/28 Servers