zoukankan      html  css  js  c++  java
  • ES6中变量let的属性以及在for循环中的使用

    let和var的差别

    1、let没有变量提升,申明变量的同时必须对变量赋值

    2、let不允许重复申明变量

    3、let的作用域是块级作用域,这一点在for循环中可以提现

    <ul id="ul1">
      <li class="li">1</li>
      <li class="li">2</li>
      <li class="li">3</li>
      <li class="li">4</li>
    </ul>

    <script>

    window.onload = function () {
      var app = document.getElementsByClassName('li');

      // for循环变量输出
      // for (var i = 0; i < app.length; i++) {
        // // 在for循环里绑定的事件要等循环结束后才会执行
        // app[i].onclick = function () {
        // console.log(i)
        // };
      // }
      // // 第一个循环这里点击输出的都是4


      // // 第一个for循环拆解后就是下面这个for循环
        // for (var i = 0; i < app.length; i++) {
          // var ss = function () {
            // console.log(i)
          // };
        // }
      // // 在for循环运行结束后再执行点击事件,调用ss函数,此时变量i的值当然是4
      // app[0].onclick = ss
      // app[1].onclick = ss
      // app[2].onclick = ss
      // app[3].onclick = ss

      // let申明的变量只在块级作用域{}中,所以在for循环外调用会报undefined
      // for (let i = 0; i < app.length; i++) {
        // let ss = function () {
          // console.log(i)
        // };
      // }
      // // 在for循环运行结束调用ss报错
      // app[0].onclick = ss
      // app[1].onclick = ss
      // app[2].onclick = ss
      // app[3].onclick = ss


      // 使用let变量可以直接在for循环变量输出i
      for (let i = 0; i < app.length; i++) {
        app[i].onclick = function () {
          console.log(i)
        };
      }
    }

      

    </script>

  • 相关阅读:
    SpringCloud分布式开发五大神兽
    Spring Cloud 架构 五大神兽的功能
    kafka 基础知识梳理-kafka是一种高吞吐量的分布式发布订阅消息系统
    ETL工具之Kettle的简单使用一(不同数据库之间的数据抽取-转换-加载)
    libjson 编译和使用
    一个用C++写的Json解析与处理库
    DB-library 常用函数
    什么是C++虚函数、虚函数的作用和使用方法
    C++用iconv进行页面字符转换
    QT学习:c++解析html相关
  • 原文地址:https://www.cnblogs.com/webwangjie/p/9370763.html
Copyright © 2011-2022 走看看