1、let、var、const
var:
函数作用域,存在变量提升,可重复声明
let:
块级作用域,不存在变量提升,不可重复声明,存在暂时性死区问题(块级作用域内,使用全局变量后再用let声明同名变量,会导致报错)
const:
用来声明常量,声明时必须赋值,一旦定义无法修改,不可重复赋值。
块级作用域,不存在变量提升,不可重复声明,存在暂时性死区问题
2、解构赋值
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。
数组解构赋值
可以从数组中提取值,按照对应位置,对变量赋值。
本质上,这种写法属于“模式匹配”,只要等号两边的模式相同,左边的变量就会被赋予对应的值。
let [a, b, c] = [1, 2, 3]; // a = 1 ,b = 2, c = 3
let [foo, [[bar], baz]] = [1, [[2], 3]]; // foo = 1 ,bar = 2, baz = 3
let [ , , third] = ["foo", "bar", "baz"]; // third = "baz"
let [x, , y] = [1, 2, 3]; // x = 1, y = 3
let [head, ...tail] = [1, 2, 3, 4]; // head = 1, tail = [2, 3, 4]
let [x, y, ...z] = ['a']; // x = "a", y = undefined, z = []
//不完全解构
let [x, y] = [1, 2, 3]; // x = 1, y = 2
let [a, [b], d] = [1, [2, 3], 4]; // a = 1, b = 2, d = 4
//赋默认值
let [x, y = 'b'] = ['a']; // x = 'a', y = 'b'
let [x, y = 'b'] = ['a', undefined]; // x = 'a', y = 'b'
let [x, y = 'b'] = ['a', 'c']; // x = 'a', y = 'c'
如果解构不成功,变量的值就等于undefined
。
let [foo] = []; // foo = undefined
let [bar, foo] = [1]; // bar = 1, foo = undefined
如果等号的右边不是数组(或者严格地说,不是可遍历的结构),那么将会报错。
// 报错
let [foo] = 1;
let [foo] = false;
let [foo] = NaN;
let [foo] = undefined;
let [foo] = null;
let [foo] = {
};
对象解构赋值
对象的解构与数组有一个重要的不同。数组的元素是按次序排列的,变量的取值由它的位置决定;而对象的属性没有次序,变量必须与属性同名,才能取到正确的值。
let {
bar, foo } = {
foo: 'aaa', bar: 'bbb' }; // foo = "aaa", bar = "bbb"
let {
baz } = {
foo: 'aaa', bar: 'bbb' }; // baz = undefined
如果解构失败,变量的值等于undefined
。
let {
foo} = {
bar: 'baz'}; // foo = undefined
如果变量名与属性名不一致,必须写成下面这样。
let obj = {
first: 'hello', last: 'world' };
let {
first: f, last: l } = obj; // f = 'hello', l = 'world'
这实际上说明,对象的解构赋值是下面形式的简写
let {
foo: foo, bar: bar } = {
foo: 'aaa', bar: 'bbb' };
也就是说,对象的解构赋值的内部机制,是先找到同名属性,然后再赋给对应的变量。真正被赋值的是后者,而不是前者。
let {
foo: baz } = {
foo: 'aaa', bar: 'bbb' };
baz // "aaa"
foo // error: foo is not defined
注意,对象的解构赋值可以取到继承的属性。
const obj1 = {
};
const obj2 = {
foo: 'bar' };
Object.setPrototypeOf(obj1, obj2);
const {
foo } = obj1;
foo // "bar"
3、模板字符串
模板字符串(template string)是增强版的字符串,用反引号(`)标识。它可以当作普通字符串使用,也可以用来定义多行字符串,或者在字符串中嵌入变量。模板字符串中嵌入变量,需要将变量名写在 ${}
之中。
// 普通字符串
`In JavaScript '\n' is a line-feed.`
// 多行字符串
`In JavaScript this is
not legal.`
console.log(`string text line 1
string text line 2`);
// 字符串中嵌入变量
let name = "Bob", time = "today";
`Hello ${
name}, how are you ${
time}?`
4、字符串新增方法
includes(), startsWith(), endsWith()
传统上,JavaScript 只有indexOf
方法,可以用来确定一个字符串是否包含在另一个字符串中。ES6 又提供了三种新方法。
- includes():返回布尔值,表示是否找到了参数字符串。
- startsWith():返回布尔值,表示参数字符串是否在原字符串的头部。
- endsWith():返回布尔值,表示参数字符串是否在原字符串的尾部。
let s = 'Hello world!';
s.startsWith('Hello') /