博客
关于我
JavaScript中的for循环
阅读量:244 次
发布时间:2019-03-01

本文共 1538 字,大约阅读时间需要 5 分钟。

JavaScript for 循环详解:语法与实战应用

for 循环的作用

在编写 JavaScript 代码时,for循环是最常用的循环工具。它能够帮助开发者重复执行特定的代码块,极大提升工作效率。例如,想要输出1到1000之间的所有数字,手动编写将需要1000行代码,而通过for循环,只需几行代码即可轻松实现。

for 循环语法

for循环的语法结构如下:

for(变量初始化; 条件表达式; 变量更新) {
// 代码块
}

关键部分说明

  • 变量初始化:在循环开始时执行的代码块,用于初始化循环变量。
  • 条件表达式:决定是否继续执行循环的关键条件,条件为真时循环继续执行。
  • 变量更新:每次循环结束后执行的代码块,用于更新循环变量。
  • for 循环的示例

    计算1到100的总和

    以下代码能够计算1到100的总和:

    var result = 0;
    for(var i = 1; i <= 100; i++) {
    result += i;
    }
    alert(result);

    数组遍历

    使用for循环遍历数组:

    var lst = ["a", "b", "c", "d", "e"];
    for(var i = 0; i < lst.length; i++) {
    console.log(lst[i]);
    }

    for...in 循环

    遍历数组或对象

    for...in循环用于遍历数组或对象属性。例如,遍历数组:

    var lst = ["a", "b", "c", "d", "e"];
    for(var l in lst) {
    console.log(lst[l]);
    }

    输出结果为:abcde

    遍历对象

    遍历一个包含个人信息的对象:

    var object = {
    姓名:'侠侠',
    年龄:'22',
    性别:'男',
    出生日期:'1997-08-05',
    职业:'程序员',
    特长:'跳舞'
    };
    for(var i in object) {
    console.log(i + ":" + object[i]);
    }

    输出结果为:

    姓名: 侠侠

    年龄: 22
    性别: 男
    出生日期: 1997-08-05
    职业: 程序员
    特长: 跳舞

    动手小练习

  • 自定义数组并遍历
  • 定义一个长度为7的数组,遍历并输出所有元素:

    var arr = [1, 2, 3, 4, 5, 6, 7];
    for(var i in arr) {
    console.log(arr[i]);
    }
    1. 求和:1~100的奇数和
    2. var sum = 0;
      for(var i = 1; i <= 100; i++) {
      if(i % 2 != 0) {
      sum += i;
      }
      }
      console.log(sum);
      1. 求和:1~100的偶数和
      2. var sum = 0;
        for(var i = 1; i <= 100; i++) {
        if(i % 2 == 0) {
        sum += i;
        }
        }
        console.log(sum);
        1. 遍历对象属性
        2. 定义一个包含个人信息的对象,并通过for...in循环输出所有属性:

          var person = {
          姓名: '张三',
          年龄: 22,
          性格: '开朗',
          学习: '编程'
          };
          for(var key in person) {
          console.log(key + ": " + person[key]);
          }

          输出结果为:

          姓名: 张三

          年龄: 22
          性格: 开朗
          学习: 编程

    转载地址:http://ndcv.baihongyu.com/

    你可能感兴趣的文章
    nft文件传输_利用remoting实现文件传输-.NET教程,远程及网络应用
    查看>>
    NFV商用可行新华三vBRAS方案实践验证
    查看>>
    ng build --aot --prod生成文件报错
    查看>>
    ng 指令的自定义、使用
    查看>>
    nghttp3使用指南
    查看>>
    Nginx
    查看>>
    nginx + etcd 动态负载均衡实践(三)—— 基于nginx-upsync-module实现
    查看>>
    nginx + etcd 动态负载均衡实践(二)—— 组件安装
    查看>>
    nginx + etcd 动态负载均衡实践(四)—— 基于confd实现
    查看>>
    Nginx + Spring Boot 实现负载均衡
    查看>>
    Nginx + uWSGI + Flask + Vhost
    查看>>
    Nginx - Header详解
    查看>>
    Nginx - 反向代理、负载均衡、动静分离、底层原理(案例实战分析)
    查看>>
    nginx 1.24.0 安装nginx最新稳定版
    查看>>
    nginx 301 永久重定向
    查看>>
    nginx css,js合并插件,淘宝nginx合并js,css插件
    查看>>
    Nginx gateway集群和动态网关
    查看>>
    Nginx Location配置总结
    查看>>
    Nginx log文件写入失败?log文件权限设置问题
    查看>>
    Nginx Lua install
    查看>>