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 相关文章推荐
js中格式化日期时间型数据函数代码
Nov 08 Javascript
javascript真的不难-回顾一下基础知识
Jan 15 Javascript
jquery实现多屏多图焦点图切换特效的方法
May 04 Javascript
js日期相关函数dateAdd,dateDiff,dateFormat等介绍
Sep 24 Javascript
利用Node.JS实现邮件发送功能
Oct 21 Javascript
vue引入axios同源跨域问题
Sep 27 Javascript
vue项目中使用Svg的方法
Oct 24 Javascript
vsCode安装使用教程和插件安装方法
Aug 24 Javascript
微信小程序3种位置API的使用方法详解
Aug 05 Javascript
使用flow来规范javascript的变量类型
Sep 12 Javascript
Vue+penlayers实现多边形绘制及展示
Dec 24 Vue.js
TypeScript 内置高级类型编程示例
Sep 23 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+mysql保存和输出文件
2006/10/09 PHP
基于php split()函数的用法详解
2013/06/05 PHP
PHP 面向对象程序设计(oop)学习笔记(一) - 抽象类、对象接口、instanceof 和契约式编程
2014/06/12 PHP
php中stdClass的用法分析
2015/02/27 PHP
php实现网站顶踩功能的完整前端代码
2015/07/19 PHP
php实现不通过扩展名准确判断文件类型的方法【finfo_file方法与二进制流】
2017/04/18 PHP
详解PHP函数 strip_tags 处理字符串缺陷bug
2017/06/11 PHP
JQuery从头学起第一讲
2010/07/04 Javascript
图片onload事件触发问题解决方法
2011/07/31 Javascript
使用apply方法处理数组的三个技巧[译]
2012/09/20 Javascript
JavaScript实现拼音排序的方法
2012/11/20 Javascript
javascript游戏开发之《三国志曹操传》零部件开发(三)情景对话中仿打字机输出文字
2013/01/23 Javascript
javascript ajax 仿百度分页函数
2013/10/29 Javascript
初识Node.js
2014/09/03 Javascript
js实现图片和链接文字同步切换特效的方法
2015/02/20 Javascript
详解JavaScript编程中正则表达式的使用
2015/10/25 Javascript
浅谈js函数三种定义方式 &amp; 四种调用方式 &amp; 调用顺序
2017/02/19 Javascript
Vue.js弹出模态框组件开发的示例代码
2017/07/26 Javascript
使用3D引擎threeJS实现星空粒子移动效果
2020/09/13 Javascript
基于jquery trigger函数无法触发a标签的两种解决方法
2018/01/06 jQuery
vue打包相关细节整理(小结)
2018/09/28 Javascript
JavaScript实现旋转木马轮播图
2020/03/16 Javascript
python进阶教程之函数参数的多种传递方法
2014/08/30 Python
CentOS 6.5下安装Python 3.5.2(与Python2并存)
2017/06/05 Python
基于 Django 的手机管理系统实现过程详解
2019/08/16 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
win10从零安装配置pytorch全过程图文详解
2020/05/08 Python
利用Python中的Xpath实现一个在线汇率转换器
2020/09/09 Python
python实现发送QQ邮件(可加附件)
2020/12/23 Python
党政领导班子群众路线对照检查材料思想汇报
2014/09/27 职场文书
医学专业大学生职业生涯规划书
2014/10/25 职场文书
财务经理岗位职责
2015/01/31 职场文书
感恩父母主题班会
2015/08/12 职场文书
创业的9条正确思考方式
2019/08/26 职场文书
解决Jupyter-notebook不弹出默认浏览器的问题
2021/03/30 Python
Mybatis-Plus 使用 @TableField 自动填充日期
2022/04/26 Java/Android