ES6的基础知识(二)

demo地点

函数

  • 默许参数

    function Person(name = "xiaohong", age = 18) {
      this.name = name;
      this.age = age;
    }
    let person1 = new Person();
    
    console.log(person1.name); // xiaohong
    
  • 省略参数

    function test(...arg) {
      let res = arg.reduce(function(sum, item) {
        return sum + item;
      });
      console.log(res); // 6
    }
    
    test(1, 2, 3);
  • 箭头函数

    let sum = (a, b) => {
      return a + b;
    };
    console.log(sum(1, 2)); // 3
    
    // 单个参数可省略小括号,直接返回可省略函数大括号
    let double = num => num * 2;
    console.log(double(2)); // 4
    
    // 箭头函数没有this,内部的this就是上层代码块的this
    let obj = {
      name: "xiaohong",
      say: function() {
        // 指向上层代码块obj
        setTimeout(() => {
          console.log(this.name); // xiaohong
        });
    
        // 指向window
        setTimeout(function(){
          console.log(this.name); // undefined
        });
      }
    };
    obj.say();
    
    let fn = () => {
      console.log(this); // window
    };
    fn();
  • Array.from()将类数组转成数组

    function sum() {
      return Array.from(arguments).reduce((val, item) => {
        return val + item;
      });
    }
    console.log(sum(1, 2, 4)); // 7
  • fill添补数组

    let arr = [, ,];
    console.log(arr.fill(1)); // [1, 1]
  • find找到数组中第一个满足前提的元素

    let arr = [1, 2, 3];
    let item = arr.find(item => {
      return item > 1;
    });
    console.log(item); // 2
  • findIndex找到数组中第一个满足前提的元素索引

    let arr = [1, 2, 3];
    let index = arr.findIndex(item => {
      return item > 1;
    });
    console.log(index); // 1
  • some数组中是不是存在满足前提的元素

    let arr = [1, 2, 3];
    let flag = arr.some(item => {
      return item >= 3;
    });
    console.log(flag); // true
  • every数组中是不是一切元素都满足前提

    let arr = [1, 2, 3];
    let flag = arr.every(item => {
      return item >= 3;
    });
    console.log(flag); // false

对象

  • 对象的属性和要领可简写

    let name = 'xiaohong';
    let obj = {
      // 当key值和变量一致时可省略
      name, 
      // 要领可简写成如许
      sayName(){}
    }
  • 对象的继续

       let obj = {
         name:'xiaohong',
         sayName(){
           console.log(this.name)
         }
       };
       let newObj = {
         name:'xiaoli'
       };
       
       Object.setPrototypeOf(newObj, obj);
       newObj.sayName(); // xiaoli
    
    
  • class类

       // 声明类,只能经由过程new天生对象,不能直接运用
       class Parent {
         // 组织函数
         constructor(name) {
           // 实例私有属性
           this.name = name;
         }
    
         // 静态属性 不需要经由过程实例挪用,类直接用
         static hello() {
           return "hello";
         }
    
         // 实例大众要领
         sayName() {
           return this.name;
         }
       }
    
       // extends继续
       class Child extends Parent {
         constructor(name) {
           // super 父级的组织函数
           super(name);
         }
       }
    
       let p = new Child("xiaoli");
       console.log(p.name); // xiaoli
       console.log(p.sayName()); // xiaoli
    
    原文作者:helloPan
    原文地址: https://segmentfault.com/a/1190000018564577
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞