ES6的简介
1.ES6的发展史:
ECMAScript 6 简称 ES6,是 JavaScript 语言的下一代标准,已经在2015年6月正式发布了。它的目标是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。
ECMAScript和js的关系:
ECMAScript是一个语言的标准,js相当于是实现者,为什么这么说
因为我们所用的JavaScript语言就是:ECMAScript+WEBAPI
其实我们现在用的比较多的是ES3.1
1996年ES才正式出现(ES1.0),中间依次为1998年(ES2.0),1998年(ES3.0),大概2007年的时候(ES6)出现,但很快就被废除,因为在编程的过程中不太好用,改动太大,2008年(ES3.1)基于ES4.0上,2009年(ES5.0)正式发布,2013年(ES6)草案完成到2015年(ES6.0)正式发布,从2016年开始就不用版本号,改用年份为代号了,就比如说:ES2015
2.新特性
let声明变量不会挂在window中,不会造成全局的污染
ES6中新增了一个作用域,块级作用域放在{}中如图:
{
let a = 10;
var b = 1;
}
console.log(a)
console.log(b)
a is not defined;后面的代码不在运行了
let不会有声明的提前,
// var 的情况
console.log(a);
var a=2
console.log(a); // 输出undefined 2
// let 的情况
console.log(b);
let b =5 // 报错b is not defined;
let b =5;
console.log(b)//5
这里注意一点其实let声明的是会提前的,会形成暂时死区
let不允许重复声明如图:
{
let a = 10;
var a = 1;} //报错 Identifier 'a' has already been declared
{
let a = 10;
let a = 1;} //报错 Identifier 'a' has already been declared
const一旦声明就不可以修改
const PI = 3.1415;
PI // 3.1415
PI = 3; //Assignment to constant variable.不能改变常量的值
Const声明的变量不会改变,const一旦声明变量,就必须初始化,不能以后进行赋值,与let一样不可重复声明。
const message = "Goodbye!";
const message = 30;
//报错Identifier 'message' has already been declared
3. ...运算符
(1).收集符只能出现一次
(2).一个函数剩于参数收集,只能在最后一个形参
复制数组:数组是符合的数据类型,直接复制的话,只是复制了在堆区中数组的内存地址,而不是克隆了一个新的数组
const a1 = [1, 2];
const a2 = a1;
a2[0] =3;
a1 // [3, 2]
a2并不是a1的克隆,而是指向同一份数据的另一个指针。修改a2,会直接导致a1的变化
在es6中这样复制数组
const a1 = [1, 2];
const a2 = [...a1];
合并数组:
const arr1 = ['a', 'b'];
const arr2 = ['c'];
const arr3 = ['d', 'e'];
ES5 的合并数组arr1.concat(arr2, arr3);
// [ 'a', 'b', 'c', 'd', 'e' ]
ES6 的合并数组[...arr1, ...arr2, ...arr3]
// [ 'a', 'b', 'c', 'd', 'e' ]
...运算符可以将字符串转为真正地数组
[...'hello']
// [ "h", "e", "l", "l", "o" ]
5.函数:这里指的是箭头函数
首先是this的指向问题
(1)对象调用函数,this指向对象
(2)直接调用函数,this指向window
(3)如果使用new关键字,this就指新创建的对象
(4)如果使用apply,call,,this指向绑定的数据
(5)如果是DOM时间函数,this就指向事件源
语法:箭头函数是一个函数表达式,理论上,任何使用函数表达式的地方都可以改成箭头函数
箭头函数的简写方式
(1)如果函数参数只有一个,可以省略括号不写
(2)如果箭头函数只有一条返回语句,可以省略{},可以省略return
注意:返回值是一个对象的时候,就会认为是一个函数体,所以要把返回值变成表达式的形式
(1).箭头函数中没有this的指向,argument,new,target,如果要强行使用,则指向外层的函数对应的this,argument,new,target
(2)箭头函数没有原型,所以说占用空间非常小,只能当作构造函数来使用
应用场景:
(1).监听临时使用地函数,并不会刻意去调用
(2)继续去沿用外层地this
(3)对象的属性不要去用箭头函数,除非特别的需求
(4)数组方法的时候,保证代码的简洁