1.扩展运算符，rest（剩余）运算符，用于操作数组和对象( {} )
...
之前在解构赋值里提到过
let [a,b,...c] = [1,2,3,4,5,6,7];
// a :1
// b :2
// c:[4,5.6.7]
注意，...只能写在最后，不能写在中间，比如 ：
let [a,b,...c,d] = [1,2,3,4,5,6,7]; // 报错
可以用来展开数组
let arr = ['a','b','c'];
console.log(...arr) // a b c
用来给函数传参，比如要给一串数字进行简单的排序
show(1,8,3,4,5); // [1,3,4,5,8]
function show(...arr){
return arr.sort();
}
如果不用...的话,用不定参来写，那就需要写成这样的
show(1,8,3,4,5); // [1,3,4,5,8]
function show(){
let arr = Array.prototype.slice.call(arguments);
return arr.sort();
}
很明显用...的话语法会简洁很多。（而且，如果你使用箭头函数的话，箭头函数是没有arguments这个东西的）
还可以利用...快速复制一个数组，很方便
let arr = [1,2,3,4,5];
let arr2 = [...arr]; // 将数组arr复制到arr2 ，并且修改arr2不会改变arr；
复制数组，还可以用Array.from();
let arr = [1,2,3,4,5];
let arr2 = Array.from(arr); // 作用同上
2.数组的循环
数组的循环有很多，arr.forEach(); arr.map(); arr.filter(); arr.some(); arr.every(); arr.reduce(); arr.reduceRight(); 但是常用的也就是arr.forEach() 和 arr.map()，所以只说一下这两个的语法。
arr.forEach() 和 arr.map()的参数都是一样的，接收三个参数。
arr.forEach(( val, index , arr )=>{});
// val:数组每一项的值，index:数组的下标，arr:将原数组原模原样的返回
看个例子：
let arr = ['apple','banana','orange'];
arr.forEach(( val, index , arr )=>{
console.log(val,index,arr);
});
// apple 0 ['apple','banana','orange']
// banana 1 ['apple','banana','orange']
// orange 2 ['apple','banana','orange']
arr.forEach()就是用来代替for循环的，一般没有返回值，对比之下arr.map()一般都需要配合return使用，如果不写return的话，就跟forEach没有什么区别了，所以建议在使用map的时候写上返回值，emmm
arr.map()的用处主要就是改变数据结构，比如后台返回的数据，我们需要做一下处理，举个栗子
let arr = [
{time:'04-28',name:'aaa'},
{time:'04-29',name:'bbb'},
{time:'04-30',name:'ccc'},
];
let arr2 = arr.map(( val, index , arr )=>{
let json = {...val}; //剩余运算符也可以对json使用
json.time = `2019-${val.time}`;
return json;
});
console.log(arr);
console.log(arr2);
提一嘴arr.filter();顾名思义，就是过滤，它的参数跟forEach和map一样，如果回调函数返回true就留下来。
3.for...of...
for...of...循环可以代替forEach循环
let arr = ['apple','banana','orange'];
for(let val of arr){
console.log(val);// apple banana orange
}
可能你也发现了，这个返回值只有值没有下标，如果你想要下标，可以这么写
let arr = ['apple','banana','banana'];
for(let index of arr.keys()){
console.log(index );// 0 1 2
}
可能你又发现了，谁只要下标啊，当然是值和下标都想要啊，那你可以这么写
let arr = ['apple','banana','orange'];
for(let item of arr.entries()){
console.log(item );
// [0, "apple"]
// [1, "banana"]
// [2, "orange"]
}
可能你又又发现了，返回的是个数组？那不如解构一下？
let arr = ['apple','banana','orange'];
for(let [index,val] of arr.entries()){
console.log(index,val);
// 0 "apple"
// 1 "banana"
// 2 "orange"
}
完美~~~
4.对象 （json）
1.对象的简洁语法
let name = 'aaa';
let age = '18';
let json = {
name,
age,
showName(){
// .......
}
}
注意，对象里面的函数就不要用箭头函数了，可能会出现this指向不对的问题，举一反三要分情况，emmmm
2.Object.assign(); 用来合并对象
let json1 = {a:1};
let json2 = {b:2};
let json3 = {c:3};
Object.assign({},json1 ,json2 ,json3 ); //{a: 1, b: 2, c: 3}
而且，后面的会覆盖前面的
let json1 = {a:1};
let json2 = {b:2};
let json3 = {c:3,a:3};
Object.assign({},json1 ,json2 ,json3 ); //{a: 3, b: 2, c: 3}
这个可以用来传参，比如封装ajax，默认一套参数，传过去另一套，最后合并，自己传的参数会覆盖掉默认的参数.....
5.模块化module
需要在script 标签里加上 type="module"
<script type="module"></script>
定义和使用
// 定义模块 //使用模块
import './module/1.js'; //路径可以是相对路径也可以是绝对路径
export const a = 12; import {a} from './module/1.js';
export { import {a,b,c} from './module/1.js';
a,
b,
c
}
export { import {aaa,bbb,ccc} from './module/1.js';
a as aaa, import {aaa as a,bbb as b,ccc as c} from './module/1.js';
b as bbb,
c as ccc
}
export default a = 12; import a from './module/1.js';
export default a = 12; import a , {b,c} from './module/1.js';
export let b = 5;
export let c = 102;
import 只会导入一次，而且有提升效果。
默认import 语法不能写入if语句当中，如果想要动态引入js模块，可以使用import();
let a = 12;
if(a==12){
import( './module/1.js');
}else{
import( './module/2.js');
}
import()的返回值是一个promise对象，可以使用.then
6.类和继承
1.1让我们先来回忆下ES6之前的类
funciton Person(name,age){
this.name = name; // 属性
this.age = age;
}
// 方法
Person.prototype.showName = function(){
return `姓名为${this.name}`;
}
let p1 = new Person('Clark Gable',28);
console.log(p1.name);// Clark Gable
console.log(p1.showName );// 姓名为Clark Gable
1.2ES6之前的继承
比如上面的是父类，那子类的写法是
function Student(name,skill){
Person.call(this,name); //继承属性
this.skill = skill ;
}
Student.prototype = new Person(); // 继承方法
let stu1 = new Student('Jack','啥也不会');
console.log(stu1.name);// Jack
console.log(stu1.skill);// 啥也不会
console.log(stu1.showName()); // 姓名为Jack
2.1下面我们看看ES6的类
class Person{
constructor(name,age){ // 属性
this.name = name;
this.age = age;
}
showName(){
return `姓名为${this.name}`;
}
showAge(){
return `年纪为${this.age}`;
}
}
let p1 = new Person('Clark Gable',28);
console.log(p1.showName());// 姓名为Clark Gable
console.log(p1.showAge());// 年纪为28
2.2看看ES6的继承
class Student extends Person{
constructor(name,skill){
super(name);
this.skill = skill;
}
showSkill(){
return `技能是${this.skill}`;
}
}
let stu1 = new Student('Jack','会点啥');
console.log(stu1.name); //Jack
console.log(stu1.skill); //会点啥
console.log(stu1.showSkill()); //技能是会点啥
console.log(stu1.showName()); //姓名为Jack
7.Set
Set本身是一个构造函数，用来生成 Set 数据结构。类似数组，但是里面的成员不能有重复值
let arr1 = new Set(['a','b','c','b']);
console.log(arr1) ;// {'a','b'}
怕你们不信，截图为证：
利用不能有重复值这一点可以进行数组去重...
let arr = [1,3,5,2,3,4,2,10,9];
let arr1 = [...new Set(arr)]; // [1, 3, 5, 2, 4, 10, 9]
set身上本身有一些方法，
let arr1 = new Set(['a','b','c','b']);
arr1.add('a');//{'a','b','c','d'}
arr1.delete('a');//{'b','c','d'}
arr1.has('a');//true / false
arr1.size ;//number 3
arr1.clear();// 清空了
