• ES6部分新增知识点(二)


    1、 模板字符串

    let str = '明天天气会更好!';
    let className = 'test';
    let html = `<html>
                       <head></head>
                       <body>
                            <p>今天的天气很好!</p>
                            <div class="${className}">${str}</div>
                       </body>
                    </html>`;

    2、数组的扩展

    Array.from(obj)将伪数组转化为真数组

    <ul>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
        <li>1111</li>
    </ul>
    <script>
      let allLis = document.querySelectorAll('li');
      console.log(allLis);  //NodeList(6) [li, li, li, li, li, li]
      console.log(Array.isArray(allLis));  //false
      console.log(Array.from(allLis));    //(6) [li, li, li, li, li, li]
      console.log(Array.isArray(Array.from(allLis)));  //true
      let obj = {'name': '张三'};  
      console.log(Array.from(obj));   //空数组[]
    </script>

    Array.of():将传进来的多个参数组成一个数组返回

    console.log(Array.of(1, 2, 3, 4));  //(4) [1, 2, 3, 4]
    console.log(Array.of('张三', '李四', '王五'));  //(3) ["张三", "李四", "王五"]

    3、对象的扩展

    当key 和 value是一样的时候,写一个就够了

    let name = '张三';
    let age  = 18;
    let person = {
        name,
        age
    };
    /*
    等效于
    let person = {
        'name': name,
        'age': age
    }
    */

    Object.assign():多个对象合并,返回合并后的对象

    let obj1 = {name: '张三'};
    let obj2 = {age: 18};
    let obj3 = {sex: '男'};
    let obj4 = {sex: '女'};
    let obj = {};
    Object.assign(obj, obj1, obj2, obj3, obj4);
    console.log(obj);  //{name: "张三", age: 18, sex: "女"}
    Object.assign(obj, {name: "李四", age: 20, sex: "男"});
    //后面的同名属性值覆盖前面的
    console.log(obj);//{name: "李四", age: 20, sex: "男"}

    4、延展操作符

    let str = '今天的天气很好!';
    let strArr = [...str];
    console.log(strArr); //(8) ["今", "天", "的", "天", "气", "很", "好", "!"]
    
    let student = {
        name: '张三',
        age: 18,
        sex: '男'
    }
    
    person = {...student}
    console.log(person); //{name: "张三", age: 18, sex: "男"}
    function sum(...arr){
        let sum = 0;
        for(let i = 0; i < arr.length; i++){
            sum += arr[i];
        }
        return sum;
    }
    console.log(sum(1,2,3));  //6

    小应用:数组去重

    let arr = [1, 2, 10, 20, 2, 1];
    console.log(new Set(arr));   //Set(4) {1, 2, 10, 20}
    console.log([...new Set(arr)]);  //(4) [1, 2, 10, 20]

    5、函数扩展

    5.1、形参可设置默认值

    5.2、参数形式:最后一个形参可以使用延展操作符

    5.3、箭头函数() => {},是一种匿名函数

  • 相关阅读:
    pyinstaller guid
    python filter()和map()函数
    python eval()
    day6
    repr()函数是什么鬼?
    fibonacci_question
    冒泡算法
    python 函数
    day4作业
    NOIp 2013 #1 积木大赛 Label:有趣的模拟
  • 原文地址:https://www.cnblogs.com/chuanzi/p/10431734.html
Copyright © 2020-2023  润新知