简介ES6、HTML5、CSS3新增特性。

一、es6的新特性 

1.let、cosnt的出现

（1）.相同点：let/cosnt是块级的作用域。不存在变量提升。不可重复声明

   (2).不同点：let的值和类型都可以改变，const不可以

2.变量的解构赋值

  async mounted() {
    let { data: res } = await getMenuList();
    // console.log(res);
    this.menuList = res.data;
    this.activePath = this.$store.state.path;
  },

 3.模块的导入和导出：

import  from  ""


export default {

}

4.for...of循环遍历

 mounted() {//动态绑定input框
    for (const iterator of this.inputList) {//遍历val值
      this.modules.push({ text: iterator });
    }
  },

5.基本数据类型：symbol(表示一个独一无二的值) 

6.箭头函数：

export const login = (data) => request({ url: '/login', method: 'post', data, })

 7.新的对象和方法：Map,Set.

let myMap = new Map([['name','ren'],['age',12]]);
console.log(myMap);  //{'name'=>'ren','age'=>12}
myMap.set('sex','male');
console.log(myMap);  //{'name'=>'ren','age'=>12,'sex'=>'male'}
myMap.get('name');  //'ren'
myMap.has('age');  //true
myMap.delete('age');  //true
myMap.has('age');  //false
myMap.get('age');  //undefined

let arr = [1,1,2,3,4,4];
let mySet = new Set(arr);
let newArr = Array.from(mySet);
console.log(newArr);  //[1,2,3,4]

 8.扩展运算符：

console.log([arr,...new set(arr2)])

 9.promise

https://blog.csdn.net/QWERTYQ16/article/details/123101031?spm=1001.2014.3001.5501http://xn--promise-x68lue2415c3ve

二、h5新增特性 

1.语义化标签。（

头部标签、

尾部标签、

导航标签等）。

2.新增表单属性（本地存储localStorage、sessionStorage、占位符placehoder、最大最小值min,max、画布canvas等。）

3. 新事件:

onresize	当调整窗口大小时触发
ondrag	当拖动元素时触发
onscroll	当滚动元素滚动元素的滚动条时触发
onmousewheel	当转动鼠标滚轮时触发
onerror	当错误发生时触发
onplay	当媒介数据将要开始播放时触发
onpause	当媒介数据暂停时触发

三、css3新增特性 

 css3中新增的一些特性大概可以分为：选择器，背景和边框属性，文本效果，2D/3D转换

1.选择器。（1）:last-child 选择元素的最后一个子元素

                  （2）:first-child选择元素的第一个子元素

                  （3）:nth-child()选择第几个子元素

                  （4）:disabled   禁用元素 

                  （5）:checked    复选框的状态

2.背景和边框。（1）背景图片尺寸：background-size

                         （2）边框：border-readius 圆角边框

                         （3）border-shadow/text-shadow 阴影

 

3.2D/3D转换

变形transform：

有rotate旋转、scale缩放、translate位移、skew倾斜

过渡transition：

transition是一个复合属性，可以同时定义transition-property、transition-duration、transition-timing-function、transition-delay子属性值

动画animation

动画的使用，首先通过@（-webkit-)keyframes 定义动画名称及动画的行为，再通过animation属性设置动画特征相关值进行调用