首页 > 其他分享> 文章详细

Es6新特性简单练习

2021-12-09 19:03:40 阅读：151 来源： 互联网

标签：Es6 console log arty 练习特性 sex let name

十年河东，十年河西，莫欺少年穷

学无止境，精益求精

参考：https://www.cnblogs.com/ruhaoren/p/11575179.html

Es6 提出了部分新特性，诸如，扩展运算符、剩余参数、Let,const,this指向，for in ,for of，set，map，模板字符串，解构赋值等。

今天索性针对这些小技能，做个练习，方便以后查阅。

代码如下：

  onl oad() {
    this.getdata();
  },

  getdata() {
    let that = this;
    //扩展运算符... 展开对象
    let Parm = {
      url: "url",
      method: "get",
      data: {
        pageindex: 1,
        pagesize: 10
      }
    }
    that.KzFun(Parm);
    //扩展运算符... 展开数组
    let Parm2 = [{
      a: 11,
      b: 22,
      c: 33
    }];
    that.KzFun(Parm2);
    //模板字符串 反引号
    let name = '陈卧龙'
    let str = `你好，我的名字是：${name}`;
    console.log(str);
    //扩展运算符 对象合并
    let arty_1 = {
      name: "陈",
      sex: "男"
    };
    let arty_2 = {
      name: "张",
      sex: "女"
    };
    let arty = {
      ...arty_1,
      ...arty_2
    };
    console.log(arty);
    //
    //扩展运算符 数组合并
    let arty_3 = [{
      name: "陈卧龙",
      sex: "男"
    }, {
      name: "莉莉",
      sex: "女"
    }];
    let arty_4 = [{
      name: "陈大六",
      sex: "男"
    }, {
      name: "婷婷",
      sex: "女"
    }];
    let arty5 = [...arty_3, ...arty_4];
    console.log(arty5);
    //Set 去重
    let MySet = new Set();
    MySet.add(1);
    MySet.add(1);
    MySet.add(2);
    MySet.add(1);
    console.log(MySet);
    //解构赋值-数组
    let Jgfz = [{
      name: "小花咪",
      cate: "猫科动物"
    }, {
      name: "小花狗",
      cate: "犬科动物"
    }];
    let [a, b] = Jgfz;
    console.log(a);
    console.log(b);
    //解构赋值-对象
    let dxjgfz = {
      jgname: "小花咪",
      jgcate: "猫科动物"
    };
    let {
      jgname,
      jgcate,
      sex
    } = dxjgfz;
    console.log(jgname);
    console.log(jgcate);
    console.log(sex); //找不到对应关系，为undefined-------------------------------------------------------
    //For OF  For in 遍历数组
    let Fof = ['北京', '上海', '广州'];
    for (let index in Fof) {
      console.log(index) //输出索引
    }
    //   For in 遍历对象   For OF 不可以遍历对象，会报错---------------------------------------------------
    for (let item of Fof) {
      console.log(item) //输出具体的Item值
    }
    let Fin = {
      name: "梨花",
      cate: "猫科动物",
      age: 2,
      sex: "雄性"
    };
    for (let index in Fin) {
      console.log(index) //输出索引
      console.log(Fin[index]) //输出索引
    }
    //Map 键值对结构体  For OF 遍历map
    let Arr2 = new Map();
    Arr2.set("key1", "value1");
    Arr2.set("key2", "value2");
    for (let [name, value] of Arr2) {
      console.log(name) //
      console.log(value) //
    }
    for (let item of Arr2) {
      console.log(item) //item 为数组
    }
    // 常量 Const  一旦赋值  不可修改
    const cns=1;
    //cns=2;//报错----------------------------------------------

    // 其他诸如箭头函数、class构造器，super【调用父类方法】 和 extends【继承父类】，this 指向，Var 和 Let 的区别在于作用域 等不做演示
  },

  KzFun(...Parm) {
    console.log(...Parm)
  }

参考博客：https://www.cnblogs.com/wang--chao/p/14656871.html 和 https://blog.csdn.net/weixin_43641218/article/details/108396556

@天才卧龙的不博客

标签：Es6,console,log,arty,练习,特性,sex,let,name
来源： https://www.cnblogs.com/chenwolong/p/es66.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

Es6新特性简单练习