ES6学习笔记(一)——let和const
1.ES6学习之let、const
(1).var、let、const 变(常)量声明
ES5 只有全局作用域和函数作用域,没有块级作用域,这带来很多不合理的场景。
在ES6中let就诞生了,实际上它为javascript新增了块级作用域。
let只在变量声明时 ,所在的代码块中有效。
由于这一特性,let很适合在for循环中使用。
如下图是一个demo:
let声明变量的特点:
a:不存在变量提升;
console.log(m);//Uncaught ReferenceError: m is not defined
let m = 'es6'; console.log(n);
var n = 'es5';
b:不允许重复声明;
let m = 'es6';
let m = 'new-es6';
console.log(m);//Uncaught SyntaxError: Identifier 'm' has already been declared var n = 'es5';
var n = 'new-es5';
console.log(n);
c:暂时性死区;
只要块级作用域内存在let
命令,它所声明的变量就“绑定”(binding)这个区域,不再受外部的影响。
var a = 666;
if(true){
a = 'abc';//Uncaught ReferenceError: a is not defined
let a;
}
(2)小栗子:
正确:
var a = 666;
{
let a = 456;
}
alert(a);// let b = 777;
{
b = 567;
}
alert(b);//
报错:
let c = 888;
{
var c = 678;//Uncaught SyntaxError: Identifier 'c' has already been declared
}
alert(c);
2.变量的解构赋值
解构适用于:数组、对象、字符串、数值、布尔值和函数的参数等。
(1)完全解构
即:等号左边的模式,完全匹配等号右边的内容。
:) 解构成功:
a.数组解构:
let [m, [[n], k]] = [1, [[3], 6]];
console.log(m); //
console.log(n); //
console.log(k); // let [ , , c] = ["aaa", "bbb", "ccc"];
console.log(c); // "ccc" let [x, , y] = [1, 2, 3];
console.log(x); //
console.log(y); // let [f, ...s] = [1, 2, 3, 4];
console.log(f); //
console.log(s); // [2, 3, 4]
b.对象解构:
var { foo: baz } = { foo: 'aaa', bar: 'bbb' };
baz // "aaa" let obj = { first: 'hello', last: 'world' };
let { first: f, last: l } = obj;
f // 'hello'
l // 'world'
对象可以嵌套解构:
下面代码中,只有line
是变量,loc
和start
都是模式,不会被赋值。
var node = {
loc: {
start: {
line: 1,
column: 5
}
}
}; var { loc: { start: { line }} } = node;
line //
loc // error: loc is undefined
start // error: start is undefined
对象的解构也可以指定默认值。代码如下:
var {x = 3} = {};
x // var {x, y = 5} = {x: 1};
x //
y // var {x:y = 3} = {};
y // var {x:y = 3} = {x: 5};
y // var { message: msg = 'Something went wrong' } = {};
msg // "Something went wrong"
:( 解构失败:会输出undefined
let [a, b, ...e] = ['hello'];
console.log(a); // "hello"
console.log(b); // undefined
console.log(e); // []
(2)不完全解构
即:等号左边的模式,只匹配一部分的等号右边的内容。
:) 解构成功:
let [x, y] = [1, 2, 3];
console.log(x); //
console.log(y); //
:( 解构失败:
严格地说,如果等号的右边不是数组,或者说不是可遍历的结构,将会报错。
// 报错
let [foo] = 1;
let [foo] = false;
let [foo] = NaN;
let [foo] = undefined;
let [foo] = null;
let [foo] = {};
友情链接:http://es6.ruanyifeng.com/#docs/destructuring
ES6学习笔记(一)——let和const的更多相关文章
- es6学习笔记1 --let以及const
let语句的基本用法: 1.let声明的变量为块级作用域,只在最近的{}里面有效,如果在外部引用就会报错. { let a = 10; var b = "hello" } ale ...
- ES6学习笔记(1)----let和const命令
参考书<ECMAScript 6入门>http://es6.ruanyifeng.com/ let和const命令 let 总结1.声明变量基本使用方法与var 相同 不同点 a.在代 ...
- ES6学习笔记之 let与const
在js中,定义变量时要使用var操作符,但是var有许多的缺点,如:一个变量可以重复声明.没有块级作用域.不能限制修改等. //缺点1:变量可以重复声明 var a=1; var a=2; conso ...
- ES6学习笔记<一> let const class extends super
学习参考地址1 学习参考地址2 ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015:也 ...
- es6学习笔记-class之一概念
前段时间复习了面向对象这一部分,其中提到在es6之前,Javasript是没有类的概念的,只从es6之后出现了类的概念和继承.于是乎,花时间学习一下class. 简介 JavaScript 语言中,生 ...
- ES6学习笔记<五> Module的操作——import、export、as
import export 这两个家伙对应的就是es6自己的 module功能. 我们之前写的Javascript一直都没有模块化的体系,无法将一个庞大的js工程拆分成一个个功能相对独立但相互依赖的小 ...
- ES6学习笔记<四> default、rest、Multi-line Strings
default 参数默认值 在实际开发 有时需要给一些参数默认值. 在ES6之前一般都这么处理参数默认值 function add(val_1,val_2){ val_1 = val_1 || 10; ...
- ES6学习笔记<三> 生成器函数与yield
为什么要把这个内容拿出来单独做一篇学习笔记? 生成器函数比较重要,相对不是很容易理解,单独做一篇笔记详细聊一聊生成器函数. 标题为什么是生成器函数与yield? 生成器函数类似其他服务器端语音中的接口 ...
- ES6学习笔记<二>arrow functions 箭头函数、template string、destructuring
接着上一篇的说. arrow functions 箭头函数 => 更便捷的函数声明 document.getElementById("click_1").onclick = ...
随机推荐
- prototype 用法
prototype使得js面向对象使用了prototype之后,使用它里面的属性或者函数 需要new出一个对象才可以使用.否则不使用prototype,直接向对象注入 function Person( ...
- Sql Server分页分段查询百万级数据四种项目实例
实际项目中需要实现自定义分页,最关键第一步就是写分页SQL语句,要求语句效率要高. 那么本文的一个查询示例是查询第100000-100050条记录,即每页50条的结果集.查询的表名为infoTab,且 ...
- css - 紧贴底部的页脚
有的时候,由于页面长度不够,页面底部的页脚会很尴尬的跑上来,如图: 有的同学可能会想用position:fixed;bottom:0;来永远居底.但有些场景确实不适合. 这是我从YII2中找到的简单解 ...
- Android应用APP脱壳笔记
[TOC] 天下游 模拟定位技术点简析 通过代码分析初步猜测模拟定位用到的几处技术点: 获取了Root权限 通过反射获取 android.os.ServiceManager 对应的函数 getServ ...
- netty的理解
netty作为nio应用的典范,在很多设计方面都值得我们在程序开发中学习. 1.事件驱动,三种事件的传播机制.一种是在channel上触发,一种是在pipeline上触发,一种是在context上触发 ...
- Navicat for MySQL 之数据库迁移
1.将数据库下的表迁移出来 2.将表全部迁入另一个数据库 重新连接数据库看看吧!
- Linux Linux常用命令二
whoami 我是谁命令 --该命令用户查看当前系统当前账号的用户名 --由于系统管理员通常需要使用多种身份登录系统,李儒通常使用普通用户登录系统,然后再以su命令切换到root身份对系统进行灌篮.这 ...
- A Survey of Shape Feature Extraction Techniques中文翻译
Yang, Mingqiang, Kidiyo Kpalma, and Joseph Ronsin. "A survey of shape feature extraction techni ...
- EXCEL VBA代码,实现点击Sheet1按钮控件保存不连续单元格的数据到Sheet2中,然后清空输入内容
Private Sub SaveAndClear() Dim Header, Deatil, Order As Range Dim lastrow1, lastrow2 As Long Dim i A ...
- DBCP与C3P0数据库连接池
数据库连接池是做什么的? 学过计算机网络的都知道,在一个内部局域网中.大部分用的都是私有地址,要想和外部 打交道,必须要有相应的合法外部地址相相应.然而内部用户数量巨大.一台机子一个外部IP 是不现实 ...