ES6笔记

• rest参数

<script>
  const sum = (...args) => {
    let total = 0;
    args.forEach(value => total += value)
    return total;
  };
  console.log(sum(10, 20));
  console.log(sum(10, 20, 30));
</script>

<script>
 let ary1 = ['张三','李四','王五']
  let [s1,...s2] = ary1;
  console.log(s1)
  console.log(s2);
</script>

• 扩展运算符

<script>
  //扩展运算符可以将数组拆分成逗号分隔的参数序列
  let ary = ['a','b','c']
  //...ary //'a','b','c'
  console.log(...ary);
  console.log('a','b','c');
  </script>

• 扩展运算符的应用

<script>
//扩展运算符应用于数组合并
let ary1 = [1 ,2 ,3];
let ary2 = [4 ,5 ,6];
//...ary1//1,2,3
//...ary2//4,5,6
let ary3 = [...ary1, ...ary2];
console.log(ary3);
</script>

• 合并数组的第二种方法

  //合并数组的第二种方法
  let ary1 = [1, 2, 3];
  let ary2 = [4, 5, 6];

  ary1.push(...ary2)
  console.log(ary1);
</script>

• 合并对象

 //合并对象
  const p1 = {
    name:'李四',
    age:18
  }
  // 在合并对象的时候，重复的属性会以最后一个出现的为准
  const p2 = {...p1,age:30}
  console.log(p2);
</script>

• 将伪数组转换为真正的数组

  //将伪数组转换为真正的数组
    var odivs = document.getElementsByTagName('div');
    console.log(odivs);
    var ary = [...odivs];
    ary.push('a');
    console.log(ary);
</script>

• from

<script>
 var arrayLike = {
   '0':'1',
   '1':'2',
   'length':2
 }
 var ary = Array.from(arrayLike, item => item*2)
 console.log(ary);
</script>

• promise

<script>
  // 假设计时器是ajax
  setTimeout(function () {
    // 假设a是响应的结果
    var a = 10
    // 假设a是第二次请求的参数
    setTimeout(function () {
      var b = 20
      // 第三个请求 需要参数b
      setTimeout(function () {

      }, 2000)
    }, 2000)
  }, 2000)
</script>

• promise的使用

<script>
  //创建promise的对象
  //在创建promise对象的时候，需要传入一个回调函数，
  //这个回调函数会产生两个参数
  //这两个参数是两个函数resolve()表示成功   reject()表示失败

  const p =new Promise(function (resolve, reject){
    setTimeout(()=>{
      let a =10
      if (a ==10){
        //表示成功
        resolve(++a)
      }else{
        //表示失败
        a = 20 
        reject(a)
      }
    },2000)
  })

  const p2 = new Promise((resolve,reject) =>{
    //then 表示成功
    //Cath 表示失败
    p.then(a =>{
      console.log(a);//11
      if (a == 11) {
        resolve(++a)
      }else{
        reject(a)
      }
    }).catch(error => {
      console.log(error);
    })
  })

</script>

• promise.all的使用

<script>
  const p1 = new Promise((resolve,reject) =>{
    let a = 10
    if(a == 10){
      resolve(a)
    }else{
      reject('错误1')
    }
  })
  const p2 = new Promise((resolve,reject)=>{
    let b = 20
    if(b == 20){
      resolve(b)
    }else{
      reject('错误2')
    }
  })

  //当两个请求同时成功才会成功，有一个失败则请求失败
  Promise.all([p1,p2])
    .then(res =>{
      console.log(res);
    })
    .catch(err =>{
      console.log(err);
    })
</script>

• set

<script>
//set 
let s1 = new Set()
console.log(s1);

let s2 = new Set([10,20,30,30,20,10])

//返回集合的元素个数
console.log('size:'+s2.size);
//增加新元素
console.log(s2.add(5));
//删除元素 传入某一个元素
console.log(s2.delete(20));
//has 是否包含
console.log(s2.delete(20));
//清空集合
// console.log(s2.clear());
console.log(s2);
for (const iterator of s2) {
  console.log(iterator);
}
</script>

• 数组去重

<script>
  const a = [10,20,30,40,10,20,30,8,5,7]
  const b = new Set(a)
  console.log(b);
  //转化为数组
  const c = Array.from(b)
console.log(c);

</script>

• map集合

<script>
  const map = new Map([[{ name: '网星', year: 13 }, '网星软件'], ['slogon', '不断提高行业标准']])
  // 集合大小
  console.log(map.size);
  // 新增
  console.log(map.set('old', 13));
  // 获取键值
  console.log(map.get('old'));
  // 包含
  console.log(map.has('old'));
  // 清空
  // console.log(map.clear());

  console.log(map);

  for (const iterator of map) {
    console.log(iterator);
  }
</script>

• class

<script>
//创建类
class Person{
  //静态属性
  static type = 'human'
  //构造函数（构造方法) 不能写成箭头函数
constructor(name,age){
  this.name = name
  this.age = age
}
sayHi = ()=>{
  console.log(`${this.name}: hi`);
}
//静态方法 被static 修饰
//频发使用的方法
static talk() {
  console.log('讲话');
} 
}
const person = new Person('李四',20)
console.log(person);
person.sayHi()

Person.talk()
console.log(Person.type);
</script>

• 类的继承

<script>
  class Person{
    constructor(name,age){
      this.name = name
      this.age = age
    }
    sayHi(){
      console.log(this.name + ':hi');
    }

    static talk(){
      console.log('讲话')
    }
  }



  //定义student类，并继承person，只能继承一个
  class student extends Person{
    constructor(name,age,score){
      super(name,age)
      this.score = score
    }
    sayHi(){
      console.log('hello');
    }

    static talk(){
      console.log('speak');
    }
  }

  const stu = new student('李四',18,30)
  console.log(stu);
  stu.sayHi()
  student.talk()
</script>