1 什么是es6
ES的全称是ECMAScript,它是由ECMA国际标准化组织制定的一项脚本语言的标准化规范。
2为什么要使用es6
ES5不能满足目前前端越来越复杂,庞大的现状,可以说已经过时了,ES6是对ES5的增强和升级。
1.主流的浏览器都已经全面支持ES6
2.行业内较新的前端框架都已经全面使用ES6的语法
3.微信小程序,uni-app等都是基于ES6的语法
4.从就业出发,中小型公司,全栈,简历上多一个技能,试用期也能更快的上手。
3es6新特性
1. let和const声明变量和常量 var
let
let
let
let:for循环体现let的父子作用域(for同步,btn[i].οnclick=function(){} 异步)
const:声明变量时必须赋值(只可一次声明)
2. 解构赋值
2.1变量用法(数组):let [name,age,sex] = [‘HHS’,21,‘男’];
对象的解构赋值:
2.2数组解构赋值( 两边对应即可 ):
基础:let [name,age,sex] = [‘HHS’,21,‘男’];
嵌套:let [name, [sex, age]] = [‘HHS’, [‘男’, 21]] ;
2.3基本类型解构赋值(了解即可,不常用)
let [a,b,c,d,e] = ‘我是中国人’;
3. 数据集-Set(类似数组) set和array都是 [ ]
3.1与数组的区别:无重复数据(重复是只留一个)
3.2创建一个集合 let set = new Set([‘张三’,‘李四’]);
3.3一个属性 set.size
3.4四个方法(add,delete,has,clear)
add (添加数据) set.add(‘刘德华’).add(‘黎明’)
delete(删除数据) set.delete(‘刘德华’);
has(判断是否存在) set.has(‘刘德华’);
clear(清空集合) set.clear( );
4. 数据集合-Map(类似对象) map和对象都是 { }
4.1对象的key只能是string,map没有要求(key唯一)
4.2创建一个map对象(key与value之间是(,),对象之间是(:))
4.3 size
4.4 set()/get()/delete()/has()/clear() 方法
map.set(‘friends’,[‘赵六’,‘李七’]);
map.get(‘name’);
map.delete(‘name’);
has/clear与Set类似
4.5 keys(),values(),entries()
获取所有key,所有value,两个一起entry,,因为是全部所有都是复数
4.6遍历map
Js中forEach语法: array.forEach(函数),函数=function(value,index){……}}
Value和index随便取名,前面为值,后面为下标
5. 新增数据类型Symbol(了解)
ES5的对象属性名都是字符串,容易造成属性名冲突
ES6引入新的元素数据类型Symbol表示独一无二的值
6. 新增语法糖Class
在其他语言中面向对象的方式都是通过Class来创建
在我们js中却是基于原型-构造函数来实现的(可能给开发者找出一定的误导)
7. 内置对象拓展(了解)
8. 8. 延展操作符
将str中的字符串,拆解成一个数组
9. 函数新增方法
9.1形参设置默认值
ES5中,调用函数且未传参数处理办法
9.2延展操作符(函数拓展多样化)
9.3箭头函数()=>{ }
与之前的函数功能差不多,只是写法更加灵活