1.以往js变量

  • var

    • 1.可以重复声明
    • 2.无法限制修改（指不能声明常量）
    • 3.没有块级作用域（指{}这样的）

2.现在ES6变量

  • let 不能重复声明-变量，可以修改，块级作用域
  • const 不能重复声明-常量，不可以修改，块级作用域

3.实例：块级作用域有什么用处

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>块级作用域03</title>

    <script>

        window.onload = function() {

            var aBtn = document.getElementsByTagName('input')

                // 效果1

                // for (var i = 0; i < aBtn.length; i++) {

                //     aBtn[i].onclick = function() {

                //         alert(i);

                //         // 按钮执行结果三次全为3

                //     };

                // }

                // 效果2

                // for (var i = 0; i < aBtn.length; i++) {

                //     (function(i) {

                //         aBtn[i].onclick = function() {

                //             alert(i);

                //             // 按钮执行结果三次分别为0,1,2

                //         };

                //     })(i);

                // }

                // 效果3

            for (let i = 0; i < aBtn.length; i++) {

                aBtn[i].onclick = function() {

                    alert(i);

                    // 按钮执行结果三次也分别为0,1,2

                };

            }

        }

    </script>

</head>

<body>

    <input type="button" value="按钮1">

    <input type="button" value="按钮2">

    <input type="button" value="按钮3">

</body>

</html>

ES6-变量let和常量const的更多相关文章

  1. 石川es6课程---3、变量let和常量const

    石川es6课程---3.变量let和常量const 一.总结 一句话总结: let非常好用,尤其是let的块级作用域可以解决之前要(function(){})()立刻执行函数做的块级作用域 1.js中 ...

  2. ES6中的var let const应如何选择

    javascript世界里面的每个人都在说有关ECMAScript 6 (ES6,也称作ES 2015)的话题,对象的巨大变化 ( 类 , super() , 等), 函数 (默认参数等), 以及模块 ...

  3. ES6 — 新增关键字let、const

    ECMAScript 是什么? 首先,我们都知道JavaScript由三部分组成:ECMAScript,DOM,BOM: 其中的ECMAScript是Javascript的语法规范. ECMAScri ...

  4. ES6 入门系列 - let 和 const 命令

    let命令 基本用法 ES6新增了let命令,用来声明变量.它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效. { let a = ; ; } a // ReferenceEr ...

  5. es6学习笔记--let和const

    今天学习了es6中的let和const命令,借此整理一下笔记. let : let 和 var 的声明方式一样,但有 var 比不上的优点.下面用 var 和 let 的例子来加深对 let 的理解. ...

  6. ES6学习笔记<一> let const class extends super

    学习参考地址1  学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...

  7. ES6学习之-let 和const命令

    let 和const命令 let命令 用来声明变量,类似于var .let声明的变量 只在let命令所在的代码块内有效. 在for循环里也是如此 每次循环其实都是一个代码块 function fn() ...

  8. ES6 基础知识-----简记 let const

    ES5中只有函数作用域和全局作用域,声明变量使用var,在es6中添加声明变量 let const let 声明块级作用域变量, let 不存在变量提升 var命令会发生”变量提升“现象,即变量可以在 ...

  9. 前端项目中常用es6知识总结 -- let、const及数据类型延伸

    项目开发中一些常用的es6知识,主要是为以后分享小程序开发.node+koa项目开发以及vueSSR(vue服务端渲染)做个前置铺垫. 项目开发常用es6介绍 1.块级作用域 let const  2 ...

  10. ES6入门之let和const命令

    前言 大家好,我是一只流浪的kk,当你看到这边博客的时候,说明你已经进入了ES6学习的领域了,从本篇博客开始,我将会将自己学习到ES6的相关知识进行整理,方便大家参考和学习,那么我将带你进入第一节的内 ...

随机推荐

  1. 设计模式（Java语言）- 建造者模式

    前言 在日常的生活中,我们可以经常看到建造者模式的影子.比如,建造房子,那么房子就是一个产品,房子由门,窗,墙,地板等部门组成.然后包工头在建造房子的时候就根据设计好的图纸来建造,但是包工头并不是亲自 ...

  2. (二)Redis在Mac下的安装与SpringBoot中的配置

    1 下载Redis 官网下载,下载 stable 版本,稳定版本. 2 本地安装 解压:tar zxvf redis-6.0.1.tar.gz 移动到: sudo mv redis-6.0.1 /us ...

  3. 李婷华 201771010113 《面向对象程序设计（java）》 第二周学习总结

    第一部分:理论知识学习部分 第三章 java的基本程序设计结构 本章主要学习数据类型.变量.运算符.类型转换.字符串.输入输出.控制流程.大数值.数组等内容. 1.基本知识 (1)标识符:由字母.下划 ...

  4. 使用天祥TX-1C调试DS18B20温度传感器的收获

    翻查DS18B20的DataSheet编写操作函数,其过程遇到了不少坎,记下来备查. 对于单总线的DS18B20芯片,首先严格按照时序图写出正确的“写0”.“写1”和“读0.1”的基础函数,再以此写出 ...

  5. 【Scala】关于集合的各种知识点

    目录 映射Map 不可变Map 概述 操作实例 可变Map 概述 操作实例 Map的遍历 for循环遍历 格式 操作实例 模式匹配遍历 格式 操作实例 Tuple 元祖 概述 定义格式 获取元素方法 ...

  6. 武装你的WEBAPI-OData便捷查询

    本文属于OData系列 目录(可能会有后续修改) 武装你的WEBAPI-OData入门 武装你的WEBAPI-OData便捷查询 武装你的WEBAPI-OData分页查询 武装你的WEBAPI-ODa ...

  7. loadrunner Error -27985问题

    错误提示:Error -27985: There is no context for HTML-based functions. A previous function may not have us ...

  8. OpenCV开发笔记（五十六）：红胖子8分钟带你深入了解多种图形拟合逼近轮廓（图文并茂+浅显易懂+程序源码）

    若该文为原创文章,未经允许不得转载原博主博客地址:https://blog.csdn.net/qq21497936原博主博客导航:https://blog.csdn.net/qq21497936/ar ...

  9. mp4封装格式各box类型讲解及IBP帧计算

    mp4封装格式各box类型讲解及IBP帧计算 目录 mp4封装格式各box类型讲解及IBP帧计算 box ftyp box moov box mvhd box (Movie Header Box) t ...

  10. 漫谈Huawei LiteOS五大内核模块

    [摘要]Huawei LiteOS是华为面向IoT领域,构建的“统一物联网操作系统和中间件软件平台”,以轻量级(内核小于10k).低功耗(1节5号电池最多可以工作5年),快速启动,互联互通,安全等关键 ...