寒假学习计划及日志

学习计划

• ES6
• Node.js
• VUE.JS
• Uni-App

学习日志

• 2020/12/27 es6 P27-P29

• Promise

  const P = new Promise((resolve,reject)=>{
         
    settimeout(()=>{
         
      resolve('用户数据');//成功
      //reject('程序出错');//错误
    },1000);
  });
  //调用then()方法
  //then()包含两个方法参数{1.当成功(resolve)时运行value方法2.当失败(reject)时运行reason方法}且赋值
  P.then(value=>{
         
    console.log(value);
  },reason=>{
         
    console.error(reason);
  });
  //调用catch()方法
  //catch()与then()类似，但then()包含成功(value)和失败(reason)两个参数，而cantch()只有失败参数(reason)
  P.catch(reason=>{
         
    console.error(reason);
  });
  

• 2020/12/29 es6 P30-P31

• Set

• //Set基本语法及属性
  //去重性
  const a = new Set(['张三','李四','王五','张三']);//'张三','李四','王五'
  const b = new Set(['111','222']);
  
  //向集合中添加一个对象
  a.add('张飞');//'张三','李四','王五','张飞'
  
  //向集合中删除一个对象
  a.delete('张三');//'李四','王五','张飞'
  
  //查看集合中是否包含一个对象
  a.has('李四');//true
  a.has('李逵');//false
  
  //清除一个集合
  a.clear();
  
  //遍历一个集合
  for(let v of b){
         
    console.log(v);
    //111
    //222
  }
  

• //Set集合实践
  //设置两组数组
  let a = [1,2,3,5,6,6];
  let b = [2,3,4,5,7];
  //a数组去重
  const result = new Set(a);//1,2,3,5,6
  
  //a与b交集
  const result2 = [...new Set(a)].filter(item => {
         
    let b2 = new Set(b);
    if(b2.has(item))return true;
    else return false;
  });
  console.log(result);//2,3,5
  //简写语法
  const r2 = [...new Set(a)].filter(item => new Set(b).has(item));//2，3，5
  
  //a与b并集
  const result3 = [...new Set(...a,...b)];//1,2,3,4,5,6,7
  
  //a与b差集
  const r2 = [...new Set(a)].filter(item => !(new Set(b).has(item)));//1,4,6,7
  

• 2020/12/31 es6 P32-P34

• Map

• //Map的基本语法及使用
  //声明一个Map
  let m = new Map();
  
  //给Map m添加一个普通类型的元素
  m.set('name','kjkjkl');//第一个参数为键值key,第二个参数为值value
  //给Map m 添加一个对象键值类型的元素,值为方法
  let n = {
         
    sex:'男'
  }
  m.set(n,function(){
         
    console.log('我是一个方法');
  });
  //删除Map中的一个元素
  m.delete('name');
  //获取Map中的一个键的值
  m.get(n);//f();
  //声明一个变量用作存储Map中n键值的方法
  let f = m.get(n);
  f();
  

• Class

• //声明一个Class
  class Phone{
         
    //constructor方法(每个类中有且只有一个constructor方法,该方法采用固定名称)即:构造函数方法
      constructor(brand,price){
         
        this.brand = brand;
        this.price = price;
      }
      //声明一个功能方法
      vivo(){
         
        console.log('我是一部vivo手机');
      }
      iphoneX(){
         
        console.log('我是一部iphoneX,我比vivo手机贵');
      }
  }
  //vivo手机初始化
  let vivo = new Phone('vivo',1999);
  vivo.vivo();//我是一部vivo手机
  
  //苹果X初始化
  let iphonex = new Phone('iphoneX',9999);
  iphonex.iphoneX();//我是一部iphoneX,我比vivo手机贵
  

• //class静态成员
  //声明一个class
  class Phone{
         
    //声明静态变量name
    static name = 'kjkjkl';
    //生命静态方法f()
    static f(){
         
      console.log('test test test');
    }
  }
  //初始化类
  let p = new Phone();
  console.log(Phone.name);//kjkjkl
  console.log(p.name);//undefined
  Phone.f();//test test test
  p.f();//直接报错
  //结论:静态化变量，方法，对象无法被赋值给初始化的对象直接读取
  

• 2021/1/1 es6 p35-p38

• //class之类的继承
  //声明一个父类Phone
  class Phone{
         
    constructor(brand,price){
         
      this.brand = brand;
      this.price = price;
    }
    call(){
         
      console.log('我可以打电话');
    }
  }
  //声明一个子类SmartPhone
  //固定写法extends
  class SmartPhone extends Phone{
         
    constructor(brand,price,color,size){
         
      //继承 固定写法super
      super(brand,price);
      this.color = color;
      this.size = size;
    }
    //生成成员函数
    Photo(){
         
      console.log('我可以照相');
    }
    PlayGame(){
         
      console.log('我可以打游戏');
    }
    //继承/重写成员函数call()
    call(){
         
      console.log('我可以打视频电话');
    }
  }
  //实例化对象
  let p = new SmartPhone('vivo',1200,'black',6.3);
  p.Photo();//我可以照相
  p.PlayGame();//我可与打游戏
  p.call();//我可以打视频电话
  console.log(p);//SmartPhone{vivo,1200,black,6.3}Photo:f();PlayGame:f();/Phone:call():f()
  

• //class中getter和setter设置
  //声明一个类Phone
  class Phone{
         
    //设置price的get
    get price(){
         
      console.log('价格属性被读取了');
      return '返回结果';
    }
    //设置price的set
    //set中至少要有一个参数
    set price(newVal){
         
      console.log('价格参数被修改了');
    }
    //实例化对象
    let s = new Phone();
    s.price = 'free';//价格参数被修改了
    console.log(s.price);//1.价格参数被读取了2.返回结果
  }
  //结论:使用场景{get:处理动态数据}{set:多种条件处理}
  

• 2021/1/2 es6 p39-p40 数值扩展和对象方法扩展

• //数值扩展
  //1.Javascript的最小精度 Number.EPSILON
  console.log(0.1 + 0.2);//0.3000000000004 非0.3
  function eq(a,b){
         
    if(Math.abs(a + b) < Number.EPSILON){
         
      return true;
    }else{
         
      return false;
    }
  }
  console.log(eq(0.1 + 0.2,0.3));//true
  
  //2.二进制和八进制
  console.log(0b1010);//10
  console.log(0o777);//511
  console.log(100);//100
  console.log(0xff);//255
  
  //3.检测一个数是否为有限数 Number.isFinite
  console.log(Number.isFinite(100));//true
  console.log(Number.isFinite(0));//true
  console.log(Number.isFinite(Infinity));//false
  
  //4.检测一个数值是否为NaN Number.isNaN
  console.log(Number.isNaN(123));//false
  console.log(Number.isNaN(123/'test'));//true
  
  //5.字符串转整数，字符串转浮点数 Number.ParseInt||Number.parseFloat
  console.log(Number.ParseInt('123abc'));//123
  console.log(Number.ParseFloat('1.23a'));//1.23
  
  //6.判断一个数是否为整数 Number.isInteger
  console.log(Number.isInteger(10));//true
  console.log(Number.isInteger(10.2));//false
  
  //7.将数字的小数部分抹掉 Math.trunc
  console.log(Math.trunc(10.2));//10
  
  //8.判断一个数字为正数 负数 还是0 Math.sign
  console.log(Math.sign(100),Math.sign(-100),Math.sign(0));//1 -1 0
  

• //对象方法扩展
  //1.判断两个值是否完全相等 Object.is
  console.log(Object.is(1,1));//true;
  console.log(Object.is(1,0));//false;
  console.log(Object.is(NaN,NaN));//true;
  console.log(NaN === NaN);//false
  
  //2.对象的合并 Object.assign
  let Config1 = {
         
    host:'127.0.0.1',
    port:8080,
    uid:'kjkjkl',
    pwd:'123456',
    add:'test'
  }
  let Config2 = {
         
    host:'localhost',
    port:80,
    uid:'lmf',
    pwd:'123'
  }
  Object.assign(Config1,Config2);//第一个对象属性会被第二个对象属性覆盖
  console.log(Config1);//{host:'localhost',port:80,uid:'lmf',pwd:'123',add:'test'}
  
  //3.设置原型对象 setPrototypeOf
  let s1 = {
         
    name:'kjkjkl'
  }
  let s2 = {
         
    game:['CF','LOL','MC']
  }
  Object.setPrototypeOf(s1,s2);
  console.log(s);//{name:'kjkjkl',_proto_:Object(play:['CF','LOL','MC'])}
  
  //获取原型对象 getPrototypeOf
  //截取上面例子
  console.log(getPrototypeOf(s));//play:['CF','LOL','MC'],_proto_:Object