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 相关文章推荐
一直复略了的一个问题,关于表单重复提交
Feb 15 Javascript
JS获取各种浏览器窗口大小的方法
Jan 14 Javascript
Angularjs编写KindEditor,UEidtor,jQuery指令
Jan 28 Javascript
json传值以及ajax接收详解
May 24 Javascript
浅谈javascript中new操作符的原理
Jun 07 Javascript
require.js+vue开发微信上传图片组件
Oct 27 Javascript
javascript事件的绑定基础实例讲解(34)
Feb 14 Javascript
利用vue + koa2 + mockjs模拟数据的方法教程
Nov 22 Javascript
微信小程序实现分享商品海报功能
Sep 30 Javascript
JS实现打砖块游戏
Feb 14 Javascript
vue学习笔记之Vue中css动画原理简单示例
Feb 29 Javascript
js面向对象方式实现拖拽效果
Mar 03 Javascript
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
PHP 5.3新特性命名空间规则解析及高级功能
2010/03/11 PHP
ThinkPHP实现二级循环读取的方法
2014/11/03 PHP
PHP文件上传、客户端和服务器端加限制、抓取错误信息、完整步骤解析
2017/01/12 PHP
php写入txt乱码的解决方法
2019/09/17 PHP
juqery 学习之四 筛选过滤
2010/11/30 Javascript
JSON 的正确用法探讨:Pyhong、MongoDB、JavaScript与Ajax
2016/05/15 Javascript
Angular.js中$apply()和$digest()的深入理解
2016/10/13 Javascript
js实现符合国情的日期插件详解
2017/01/19 Javascript
jquery实现放大镜简洁代码(推荐)
2017/06/08 jQuery
Angularjs单选框相关的示例代码
2017/08/17 Javascript
vue2.0 elementUI制作面包屑导航栏
2018/02/22 Javascript
Angular4 组件通讯方法大全(推荐)
2018/07/12 Javascript
微信小程序实现发送验证码按钮效果
2018/12/20 Javascript
初试vue-cli使用HBuilderx打包app的坑
2019/07/17 Javascript
JavaScript浅层克隆与深度克隆示例详解
2020/09/01 Javascript
[51:53]完美世界DOTA2联赛循环赛 LBZS vs DM BO2第二场 11.01
2020/11/02 DOTA
详解Python中for循环的使用方法
2015/05/14 Python
详解Python3中字符串中的数字提取方法
2017/01/14 Python
Python如何读取MySQL数据库表数据
2017/03/11 Python
python使用两种发邮件的方式smtp和outlook示例
2017/06/02 Python
详解python中的文件与目录操作
2017/07/11 Python
深入解析Python小白学习【操作列表】
2019/03/23 Python
python实现批量视频分帧、保存视频帧
2019/05/31 Python
利用Python实现Shp格式向GeoJSON的转换方法
2019/07/09 Python
使用pandas读取文件的实现
2019/07/31 Python
春节到了 教你使用python来抢票回家
2020/01/06 Python
完美解决keras保存好的model不能成功加载问题
2020/06/11 Python
Opencv+Python识别PCB板图片的步骤
2021/01/07 Python
美国护肤咨询及美容产品电商:Askderm
2017/02/24 全球购物
主键(Primary Key)约束和唯一性(UNIQUE)约束的区别
2013/05/29 面试题
工厂厂长的职责
2013/12/12 职场文书
西安导游词
2015/02/12 职场文书
机关保密工作承诺书
2015/05/04 职场文书
美丽心灵观后感
2015/06/01 职场文书
干部考核工作总结2015
2015/07/24 职场文书
Python pyecharts案例超市4年数据可视化分析
2022/08/14 Python