ES6新增语法(一)——let、const、var的区别
ES6简介
ES6是ECMAScript 6.0的简称,是javascript语言的下一代标准,已经在2015年6月正式发布上线。目的就是为了统一javascript的语法标准,可以用来开发大型应用程序,称为企业级开发语言。
ES6与JavaScript的关系:
ES6是JavaScript的规范标准,JavaScript是ES6的一种实现。
变量/赋值
块级作用域{}
ES5中作用域有:全局作用域、函数作用域,没有块作用域的概念。ES6新增了块级作用域,块作用域由{}包括,if语句里面的{}也属于块级作用域。
//通过定义的变量可以跨块作用域访问到
{
var a = 12;
console.log("a",a)
}
console.log("a",a)
//通过var定义的变量不能通过跨函数作用域访问到
(function(){
var b = 5;
})()
console.log("b",b) // not defined
var 与let和const区别:
|
var |
可以重复定义 |
是变量,不能限制修改 |
没有块级作用域 |
|
let |
不能重复定义 |
是变量 |
块级作用域,不能跨块访问 |
|
const |
不能重复定义 |
是常量,初始化时必须赋值 |
块级作用域,不能跨块访问 |
const定义的对象属性是否可以改变?
实例:修改对象的属性值。
const per = {
name:'倩倩'
}
per.name = "我是嘻哈"
console.log("per.name",per.name) //打印出我是嘻哈
通过上个实例,我们发现对象的属性是可以修改的,这是什么原因呢?
对象是引用类型的,per中保存的仅是对象的指针,意味着指针不会发生改变,修改对象的属性不会改变对象的指针,所以是允许修改的。
赋值:新增解构赋值,就是对数据拆解并赋值。解构赋值的两个规则:
- 左右两边模式必须一致
- 必须让定义和赋值同步完成。
实例:正确的结构赋值
let [a,b,c] = [1,2,3]
console.log("a",a)//1
console.log("b",b)//2
console.log("c",c)//3
实例:左右两边模式一致,数据长短不同时
let [bar, foo] = [1];
console.log("bar",bar)//1
console.log("foo",foo) // undefined
上述解构不成功,变量值等于undefined。
注意:对象也是可以解构的,但是需要注意的是对象和数组的解构有很大的区别,对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
let { bar,foo } = {
foo:'aaa',
bar:'bbb'
}
console.log('bar',bar)
console.log('foo',foo)
console.log('baz',baz) // not defined
ES6新增语法(一)——let、const、var的区别的更多相关文章
- ECMAScript简介以及es6新增语法
ECMAScript简介 ECMAScript与JavaScript的关系 ECMAScript是JavaScript语言的国际化标准,JavaScript是ECMAScript的实现.(前者是后者的 ...
- js中const,var,let区别(转载)
js中const,var,let区别 来源:https://www.cnblogs.com/zzsdream/p/6372729.html 今天第一次遇到const定义的变量,查阅了相关资料整理了这篇 ...
- const,var,let区别(转载)
1.const定义的变量不可以修改,而且必须初始化. const b = 2;//正确 // const b;//错误,必须初始化 console.log('函数外const定义b:' + b);// ...
- const,var,let 区别
js中const,var,let区别 1.const定义的变量不可以修改,而且必须初始化. 声明的是常量 1 const b = 2;//正确 2 // const b;//错误,必须初始化 3 co ...
- ES6新增语法和内置对象(let,const, Array/String/Set 扩展方法(解构赋值,箭头函数,剩余参数))
1.let ES6中新增的用于声明变量的关键字. let 声明的变量只在所处于的块级有效. 注意:使用 let 关键字声明的变量才具有块级作用域,var 关键字是不具备这个特点的. 1. 防止循环变量 ...
- 【ES6新增语法详述】
目录 1. 变量的定义 let const 2. 模版字符串 3. 数据解构 4. 函数扩展 设置默认值 箭头函数 5. 类的定义 class 6. 对象的单体模式 "@ ES6新增了关于变 ...
- 面向对象编程-终结篇 es6新增语法
各位,各位,终于把js完成了一个段落了,这次的章节一过我还没确定下面要学的内容可能是vue也可能是前后端交互,但无论是哪个都挺兴奋的,因为面临着终于可以做点看得过去的大点的案例项目了,先憋住激动地情绪 ...
- ES6 — 新增关键字let、const
ECMAScript 是什么? 首先,我们都知道JavaScript由三部分组成:ECMAScript,DOM,BOM: 其中的ECMAScript是Javascript的语法规范. ECMAScri ...
- es6 | 新增语法 | 总结
电梯 原文 https://www.jianshu.com/p/5f40c43c6f85 重点: 遍历map结构 正则扩展 at相当于charAt() ,可以识别中文normarize()includ ...
随机推荐
- pytest + allure
参考allure官网: https://docs.qameta.io/allure/#_pytest 1.使用命令pip install pytest-allure安装 注意:我遇到的一个现象,用命令 ...
- 前端工具 | JS编译器 Brace 使用教程
前言 开发人员一般是在电脑上面安装了IDE完成日常的开发任务,因为项目业务需求,用户想要在线写JS脚本,纯粹的字符串,很"费用户".那就需要一个在线JS编译器,需要轻量级,好用,语 ...
- fiddler选项卡-Statistc(统计)
Statistc Statistc是fiddler用来对session列表里的Session相关情况的统计,利用这个选项,可以对请求进行性能以及其他数据分析 1.界面 2.参数详解 建议:打开fidd ...
- linux文件内容列传行_行转列
================ 文件内容列传行_行转列 ================ 一.列转行 1.编辑测试文件 vi log.txt 16:23:00 8.2% 1773620k 16:2 ...
- 使用IDEA创建Maven项目
一.创建一个普通的Maven项目 1.启动IDEA 2.创建一个Maven项目 3.Maven的目录结构 二.使用模板创建一个MavenWeb项目 1.启动IDEA 2.创建一个MavenWeb项目 ...
- 【Java】Debug断点调试常用技巧
Debug操作技巧 Show Execution Point 将光标回到当前断点停顿的地方 Step Over 执行当前行代码,并将运行进度跳转到下一行. Step Into 进入到当前代码行的方法内 ...
- Spring Boot WebFlux-01——WebFlux 快速入门实践
第01课:WebFlux 快速入门实践 Spring Boot 2.0 spring.io 官网有句醒目的话是: BUILD ANYTHING WITH SPRING BOOT Spring Boot ...
- 惊艳面试官的 Cookie 介绍
Cookie 是什么 Cookie 是用户浏览器保存在本地的一小块数据,它会在浏览器下次向同一服务器再发起请求时被携带并发送到服务器上. Cookie 主要用于以下三个方面: 会话状态管理(如用户登录 ...
- Redis压测
测试命令 这条命令redis自带 redis-benchmark [option] [option value] redis 性能测试工具可选参数如下所示: 序号 选项 描述 默认值 1 -h 指 ...
- 如何在Linux下部署Samba服务?
Samba简介 Samba是在Linux和UNIX系统上实现SMB协议的一个免费软件,由服务器及客户端程序构成.SMB(Server Messages Block,信息服务块)是一种在局域网上共享文件 ...