async & class类 & 深度克隆

async函数

async函数利用同步流程模拟异步操作，真正意义上解决异步回调的问题。 async函数发送ajax请求：

      function sendXML(url) {
//    promise实例
    let promise = new Promise((resolve,reject)=>{
//      发送ajax请求，
      $.ajax({
        url,
        type:'GET',
//        成功，修改为成功状态
        success:data=>{
          console.log(data)
          resolve(data)
        },
//        失败，调用成功的状态，为了不阻塞先一步异步等待的执行
        error:error=>{
          resolve('数据传输错误')
        }
      })
    })
//    返回promise对象
    return promise;
  }

  async function getUrl() {
//    第一次发送请求的结果返回给result
    let result = await sendXML('http://localhost:3000/news1?id=2');
    let url = `http://localhost:3000${result.commentsUrl}`;
//    再次发送请求
    await sendXML(url);
//    验证流程是否执行完毕
    console.log('sss')
  }
  getUrl();

class类

class类定义的一把步骤

• 1、通过class实现类的继承
• 2、在类中通过constructor定义类的属性和方法
• 3、定义类的一般方法
• 4、通过new创建实例
• 5、通过extends实现类的继承
• 6、通过super调用父类的构造方法
• 7、重写父类的一般方法

    //class构造类
class Person{
//  通过constructor定义类的属性
  constructor(name,age){
    this.name=name,
      this.age=age
  }
//  定义类的一般方法
  setName(){
    console.log(this.name,this.age)
  }
}

//new实例对象
let person = new Person('zhenzhen',18);
  person.setName()
  console.log(person);

//通过extends继承类的属性
  class Child extends Person{
    constructor(name,age,sex){
//      子类没有自己的this对象，必须调用父类的this对象，否则会报错
//      super只能继承父类的原型对象
//      super只能在派生类中使用，派生类就是继承其他类的新类
      super(name,age);
      this.sex=sex;
    }

//    重写从父类中定义的一把方法
  setName(){
    console.log(this.name,this.age,this.sex)
  }
  }

  let child = new Child('qing',12,'女');
  child.setName();
  console.log(child);

深度克隆

• 1、数据类型：
  • 数据分为基本的数据类型(String, Number, boolean, Null, Undefined)和对象数据类型
  • 基本数据类型：
    • 特点： 存储的是该对象的实际数据
  • 对象数据类型：
    • 特点： 存储的是该对象在栈中引用，真实的数据存放在堆内存里
• 2、复制数据
  • 基本数据类型存放的就是实际的数据，可直接复制
    • let number2 = 2;
    • let number1 = number2;
• 克隆数据：对象/数组
  • 1、区别： 浅拷贝/深度拷贝
    • 判断： 拷贝是否产生了新的数据还是拷贝的是数据的引用
    • 知识点：对象数据存放的是对象在栈内存的引用，直接复制的是对象的引用
    • let obj = {username: 'kobe'}
    • let obj1 = obj; // obj1 复制了obj在栈内存的引用
  • 2、常用的拷贝技术
    • 1). arr.concat(): 数组浅拷贝
    • 2). arr.slice(): 数组浅拷贝
    • 3). JSON.parse(JSON.stringify(arr/obj)): 数组或对象深拷贝, 但不能处理函数数据
    • 4). 浅拷贝包含函数数据的对象/数组
    • 5). 深拷贝包含函数数据的对象/数组

数组/对象深度克隆

//1、定义一个函数判断数组类型
  function getTargetClass(target) {
    target = Object.prototype.toString.call(target).slice(8,-1);
  }

//  2、克隆数组/对象
  function clone(target) {
//  3、 调用函数，判断目标的类型
    let result,targetClass = getTargetClass(target);
    if (target === 'Object'){ //如果是 对象
      result = {}
    }else if(target === 'Array'){  //如果是 数组
      result=[];
    }else {  //是基本的数据类型，直接返回目标
      return target;
    }

//  4、  遍历目标数据
    for(let keys in target){
//  5、  通过for..in遍历，数组拿到的是下标，对象拿到的是属性名，都可以作为对象每一项的标记
      let item = target[keys];
//  6、  再判断每一项的值是否为对象或者数组，例如[1,2,3,{name:'kebi'}]----再次遍历
      if(getTargetClass(item) === 'Object' || 'Array'){
//       如果是对象或者数组，再次调用函数进行遍历
        result[keys] = clone(item);
      }else{  //如果不是，直接返回
        result[keys] = item;
      }
    }
//  7、  将执行的结果返回出去
    return result;
  }

//  8、 验证
let arr= [1,2,3,{name:'kebi'}];
  let arr2= clone(arr);
  console.log(arr2,arr);
  arr2.name='ni';
  console.log(arr2,arr)