ES6学习笔记

let
let类似于var，都用于对变量的定义。下面是let于var的不同：

1、let只作用于自己的块级作用域内容。

{
   	var a = 1;
   	let b = 2;
   }
console.log(a); //1
console.log(b); //报错 b is not defined

这表明，let声明的变量只在它所在的代码块有效。

2、let不允许重复声明
let不允许在相同作用域内，出现同一个变量。

3、let不存在变量提升

console.log(a); //undefined
var a = 1;
console.log(b); //报错 b is not defined
let b = 2;

let如果先使用再定义，就会报错，这种叫做“暂时性死区”。所以，let只能先定义后使用，这也是ES6所提倡的用法。

const
ES6扩展了只读常量，const就是声明只读常量的命令。一旦声明，常量的值就不能改变。

const a = 1;
console.log(a); //1
a = 2; //报错Assignment to constant variable.

const 声明常量后必须赋值，并且和let一样，只在声明所在的块级作用域内有效。

const a; //报错 Missing initializer in const declaration
if (true) {
  const b = 5;
}
console.log(b); //报错 b is not defined

=>箭头函数
ES6扩展了箭头函数“=>”

var f = v => v;
//等同于
var f = function(v) {
  return v;
};

如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。

var f = () => 5;
// 等同于
var f = function () { return 5 };

var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
  return num1 + num2;
};

如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。

var f = (n,m) => {
   var z = n+m;
   return z;
};
//等同于
var f = function(n,m){
	var z = n+m;
	return z;
}

…扩展运算符
扩展运算符（…）是将一个数组转为用逗号分隔的参数序列。

bar = function(a, b, ...args) {
    console.log(a);  //a
    console.log(b);  //b
    console.log(args); //['c','d','e']
}
bar('a', 'b', 'c', 'd', 'e');

…运算符还可以快速将一个字符串转为数组格式

let str = 'hello-es6';
let strArr = [...str];
console.log(strArr);  //["h", "e", "l", "l", "o", "-", "e", "s", "6"]

使用…运算符快速合并数组

let arr1 = ['a', 'b', 'c'];
let arr2 = ['d', 'e', 'f'];
let arr3 = ['x', 'y', 'z'];
let arr4 = [...arr1, ...arr2, ...arr3];
console.log(arr4);  // ["a", "b", "c", "d", "e", "f", "x", "y", "z"]

欢迎分享本文，转载请保留出处：前端ABC » ES6学习笔记