ES6学习之变量的两种命名方法示例


Posted in Javascript onJuly 18, 2017

前言

众所周知es6是ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。

它完善了ES5的命名规范,它又重新发布了两个新的命名变量的方式:let和const,但是let声明的变量只在它所在的代码块有效。

本文将给大家介绍关于ES6变量命名的两种方法,下面话不多说,来一起看看详细的介绍:

let a = 10;
 var b = 1;
}

a // ReferenceError: a is not defined.
b // 1

1、for循环的计数器,就很适合let,比如我之前遇到一个问题,就是一个ul中有很多li,要想点击每个li时都获取到哪个li的下标

for (let i = 0,len=obj.length; i < len; i++) {
      obj[i].addEventListener("click",function (){
       console.log(i)
      },false);
     }

var 在for循环中循环一个对象后得到最后那个对象的长度,而let很好的解决了那个问题,并且访问每个li的索引。

2、不存在变量提升

var命令会发生”变量提升“现象,即变量可以在声明之前使用,值为undefined。这种现象多多少少是有些奇怪的,按照一般的逻辑,变量应该在声明语句之后才可以使用。

为了纠正这种现象,let命令改变了语法行为,它所声明的变量一定要在声明后使用,否则报错。

// var 的情况
console.log(foo); // 输出undefined
var foo = 2;

// let 的情况
console.log(bar); // 报错ReferenceError
let bar = 2;

const声明一个只读的常量。一旦声明,常量的值就不能改变。

const PI = 3.1415;
PI // 3.1415

PI = 3;
// TypeError: Assignment to constant variable.

const声明的变量不得改变值,这意味着,const一旦声明变量,就必须立即初始化,不能留到以后赋值。

对于const来说,只声明不赋值,就会报错。

const的作用域与let命令相同:只在声明所在的块级作用域内有效。

总结

以上就是这篇文章的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
flexigrid 类似ext grid的JS表格代码
Jul 17 Javascript
JavaScript高级程序设计 读书笔记之十一 内置对象Global
Mar 07 Javascript
js实现数组去重、判断数组以及对象中的内容是否相同
Nov 29 Javascript
node.js中的http.response.addTrailers方法使用说明
Dec 14 Javascript
js实现选中页面文字将其分享到新浪微博
Nov 05 Javascript
理解js回收机制通俗易懂版
Feb 29 Javascript
微信公众平台开发教程(六)获取个性二维码的实例
Dec 02 Javascript
video.js使用改变ui过程
Mar 05 Javascript
详解angularjs获取元素以及angular.element()用法
Jul 25 Javascript
全面解析vue router 基本使用(动态路由,嵌套路由)
Sep 02 Javascript
小程序日历控件使用方法详解
Dec 29 Javascript
快速解决layui弹窗按enter键不停弹窗的问题
Sep 18 Javascript
vue实现表格增删改查效果的实例代码
Jul 18 #Javascript
js canvas实现适用于移动端的百分比仪表盘dashboard
Jul 18 #Javascript
vue深入解析之render function code详解
Jul 18 #Javascript
jquery插件canvaspercent.js实现百分比圆饼效果
Jul 18 #jQuery
浅谈JS封闭函数、闭包、内置对象
Jul 18 #Javascript
iscroll实现下拉刷新功能
Jul 18 #Javascript
vue.js实现单选框、复选框和下拉框示例
Jul 18 #Javascript
You might like
win7 64位系统 配置php最新版开发环境(php+Apache+mysql)
2014/08/15 PHP
PHP长网址与短网址的实现方法
2017/10/13 PHP
jQuery EasyUI API 中文文档 - NumberSpinner数值微调器使用介绍
2011/10/21 Javascript
JS跨域代码片段
2012/08/30 Javascript
基于KMP算法JavaScript的实现方法分析
2013/05/03 Javascript
javascript检测浏览器的缩放状态实现代码
2014/09/28 Javascript
node.js中的http.response.addTrailers方法使用说明
2014/12/14 Javascript
JavaScript实现自动生成网页元素功能(按钮、文本等)
2015/11/21 Javascript
Angular 4.x中表单Reactive Forms详解
2017/04/25 Javascript
jQuery中extend函数简单用法示例
2017/10/11 jQuery
基于vue组件实现猜数字游戏
2020/05/28 Javascript
vue拖拽组件使用方法详解
2018/12/01 Javascript
Vue实现简单分页器
2018/12/29 Javascript
python脚本替换指定行实现步骤
2017/07/11 Python
使用Python爬取最好大学网大学排名
2018/02/24 Python
Python文件读写保存操作的示例代码
2018/09/14 Python
Django学习笔记之为Model添加Action
2019/04/30 Python
使用python打印十行杨辉三角过程详解
2019/07/10 Python
python Dijkstra算法实现最短路径问题的方法
2019/09/19 Python
Python内置方法实现字符串的秘钥加解密(推荐)
2019/12/09 Python
Python socket聊天脚本代码实例
2020/01/02 Python
Python新手学习raise用法
2020/06/03 Python
使用CSS3来代替JS实现交互
2017/08/10 HTML / CSS
IE9下html5初试小刀
2010/09/21 HTML / CSS
HTML5中微数据概述及在搜索引擎中的使用举例
2013/02/07 HTML / CSS
DHC中国官方购物网站:日本通信销售No.1化妆品
2016/08/20 全球购物
七年级政治教学反思
2014/02/03 职场文书
房地产开盘策划方案
2014/02/10 职场文书
如何写一份好的英文求职信
2014/03/19 职场文书
活动总结怎么写
2014/04/28 职场文书
交通事故协议书范文
2014/10/23 职场文书
MySQL索引篇之千万级数据实战测试
2021/04/05 MySQL
浅谈redis五大数据结构和使用场景
2021/04/12 Redis
简单聊聊TypeScript只读修饰符
2022/04/06 Javascript
MySQL常用慢查询分析工具详解
2022/08/14 MySQL
苹果macOS 13开发者预览版Beta 8发布 正式版10月发布
2022/09/23 数码科技