文档章节

谈谈神秘的ES6——(二)ES6的变量

JandenMa
 JandenMa
发布于 07/23 02:43
字数 588
阅读 54
收藏 0

谈谈神秘的ES6——(二)ES6的变量

我们在《零基础入门JavaScript》的时候就说过,在ES5里,变量是有弊端的,我们先来回顾一下。

首先,在ES5中,我们所有的变量都是通过关键字var来定义的。而这种变量呢,是存在弊端的,1.可重复声明;2.无法限制修改;3.没有块级作用域。而这三个弊端,可能会导致变量使用混乱、或者变量值受到污染。举一个最简单的例子:

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
</body>
<script type="text/javascript">
    var lis = document.querySelectorAll('li');
    for (var i = 0; i < lis.length; i++) {
        lis[i].onclick = function () {
            console.log(i);//都是5
        }
    }
</script>

</html>

上边这个例子呢,很明显,这个i呢,我们在点击时,i其实已经循环完毕,在ES5中,想要解决这个问题,就只能用闭包了。关于闭包,等我们讲JS进阶的时候,再详细讲一讲。

<script type="text/javascript">
    var lis = document.querySelectorAll('li');
    for (var i = 0; i < lis.length; i++) {
        lis[i].onclick = (function (j) {
            return function () {
                console.log(j);
            }
        })(i)
    }
</script>

而在ES6里边呢,我们上述的三个弊端,已经有了比较好的解决方案。

在ES6中,首次提出了let和const两个关键字,let用来声明变量,不可重复声明,可以修改,有块级作用域;const用来声明常量,不可修改,同样不可重复声明,有块级作用域。

let a = 10;
let a = 20; //Uncaught SyntaxError: Identifier 'a' has already been declared

const b = 10;
const b = 20; //Uncaught SyntaxError: Identifier 'b' has already been declared

const c = 10;
c = 20;//Uncaught TypeError: Assignment to constant variable.

好了,这节课就说到这里,下一节课,我们来讲讲函数。

                                                                                                       

如果想跟着振丹继续学习,可以微信关注【振丹敲代码】(微信号:JandenCoding)

新博文微信同步推送,还附有讲解视频哦~

也可直接扫描下方二维码关注。

© 著作权归作者所有

共有 人打赏支持
JandenMa
粉丝 12
博文 28
码字总数 27794
作品 0
汕头
私信 提问
谈谈神秘的ES6——(三)ES6的函数

谈谈神秘的ES6——(三)ES6的函数 ES6函数的改变不算太大,都是一些其他语言早就有的功能,而Javascript一直比较欠缺的,比如函数参数默认值,任意参数的表示法,最大的变化应该是支持箭头函...

JandenMa
07/30
0
0
谈谈神秘的ES6——(四)解构赋值【数组篇】

今天,我们来讲一个新的概念,叫做解构赋值。那么在ES6中,什么是解构赋值呢?我们先来给它下个定义。 在ES6中,允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(D...

JandenMa
08/09
0
0
JavaScript数组去重方法总结

前言 数组去重方法老生常谈,既然是常谈,我也来谈谈。 双层循环 也许我们首先想到的是使用 indexOf 来循环判断一遍,但在这个方法之前,让我们先看看最原始的方法: 在这个方法中,我们使用...

卟想苌亣
2017/11/17
0
0
张成文——ECMAScript 6 开发体系实践

2016年04月23日14:00時,在武汉市东湖高新技术开发区民院路38号纽宾凯鲁广国际酒店(光谷步行街地铁C出口省测绘局斜对面),舉行的规模在800人左右的2016源创会武汉站。由张成文(腾讯SNG web)分...

yunwangjun
2016/04/24
2.2K
1
ReactNative开发必备ES6知识

引言 现代前端应用通常都会使用ES6进行开发,ReactNative项目同样也会使用ES6进行开发,对于现代前端项目开发来说,掌握ES6成为一件十分必要的事情。对于ES6的学习,通常都会阅读阮一峰的《E...

芒言
06/21
0
0

没有更多内容

加载失败,请刷新页面

加载更多

最重要的是做什么,而不是怎么做。

最重要的是做什么,而不是怎么做。 做什么是战略,怎么做是战术。将军下令说,天黑前拿下这座山头,这是战略。手下的士兵可以不知道为什么要拿下这座山头,还非得是天黑之前,但士兵必须知道...

我是菜鸟我骄傲
31分钟前
0
0
w, vmstat, top, sar, nload命令查看系统状态信息

w/uptime 查看系统负载 cat /proc/cpuinfo 查看cpu核数 vmstat 监控系统状态,用法 vmstat 1,关键的几列: r, b, swpd, si, so, bi, bo, us, wa top 查看进程使用资源情况 top -c 显示详细的...

野雪球
今天
2
0
小白创建一个spring boot项目

进入 https://start.spring.io/

lilugirl
今天
3
0
Alibaba Java诊断利器Arthas实践--使用redefine排查应用奇怪的日志来源

背景 随着应用越来越复杂,依赖越来越多,日志系统越来越混乱,有时会出现一些奇怪的日志,比如: [] [] [] No credential found 那么怎样排查这些奇怪的日志从哪里打印出来的呢?因为搞不清...

hengyunabc
今天
2
0
home hosts

home hosts lwk@qwfys:~$ cat /etc/hosts127.0.0.1 localhost127.0.1.1 qwfys192.168.56.101vm600.qwfys.com39.108.212.91alpha1.ppy.com39.108.117.122alpha2.p......

qwfys
今天
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部