zoukankan      html  css  js  c++  java
  • js 技巧

    1.删除重复项
    
    var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
    
    
    // First method
    var uniqueFruits = Array.from(new Set(fruits));
    console.log(uniqueFruits); // returns [“banana”, “apple”, “orange”, “watermelon”, “grape”]
    // Second method
    var uniqueFruits2 = […new Set(fruits)];
    console.log(uniqueFruits2); // returns [“banana”, “apple”, “orange”, “watermelon”, “grape”]
    2.替换指定值
    
    var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
    fruits.splice(0, 2, “potato”, “tomato”);
    console.log(fruits); // returns [“potato”, “tomato”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”]
    3.特殊map
    
    var friends = [
        { name: ‘John’, age: 22 },
        { name: ‘Peter’, age: 23 },
        { name: ‘Mark’, age: 24 },
        { name: ‘Maria’, age: 22 },
        { name: ‘Monica’, age: 21 },
        { name: ‘Martha’, age: 19 },
    ]
    
    
    var friendsNames = Array.from(friends, ({name}) => name);
    console.log(friendsNames); // returns [“John”, “Peter”, “Mark”, “Maria”, “Monica”, “Martha”]
    4.清空数组
    
    var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];
    
    
    fruits.length = 0;
    console.log(fruits); // returns []
    5.数组=>对象
    
    
    var fruits = [“banana”, “apple”, “orange”, “watermelon”];
    var fruitsObj = { …fruits };
    console.log(fruitsObj); // returns {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}
    6.数组交集
    
    var numOne = [0, 2, 4, 6, 8, 8];
    var numTwo = [1, 2, 3, 4, 5, 6];
    var duplicatedValues = […new Set(numOne)].filter(item => numTwo.includes(item));
    console.log(duplicatedValues); // returns [2, 4, 6]
    7.移除虚值
    
    var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false];
    var trueArr = mixedArr.filter(Boolean);
    console.log(trueArr); // returns [“blue”, 9, true, “white”]

     ?.操作符

    在javaScript中,对象的属性链访问,很容易因为某一个属性不存在出现 Cannot read property 'xxx' of undefined的问题,那么Optional Chaining就添加了?.操作符,它会先判断前面的值,如果undefined或者null,就结束后面的调用,直接返回undefined;
    const obj = {
      foo: {
        bar: {
          baz: 42,
        },
      },
    };
    
    const baz = obj?.foo?.bar?.baz; // 42
    
    const safe = obj?.qux?.baz; // undefined
    
    // Optional chaining and normal chaining can be intermixed
    obj?.foo.bar?.baz; // Only access `foo` if `obj` exists, and `baz` if
                       // `bar` exists
    
    // Example usage with bracket notation:
    obj?.['foo']?.bar?.baz // 42
    
    
    // Top function can be called directly, too.
    function test() {
      return 42;
    }
    test?.(); // 42
    
    exists?.(); // undefined
    
    
    // Top classes can be called directly, too.
    class Test {
    }
    new Test?.(); // test instance
    
    new exists?.(); // undefined

    安装:

    npm install --save-dev @babel/plugin-proposal-optional-chaining

    yarn add @babel/plugin-proposal-optional-chaining --dev

    配置.babelrc:

    { "plugins": ["@babel/plugin-proposal-optional-chaining"] }
  • 相关阅读:
    hdu 1028 Ignatius and the Princess III (n的划分)
    CodeForces
    poj 3254 Corn Fields (状压DP入门)
    HYSBZ 1040 骑士 (基环外向树DP)
    PAT 1071 Speech Patterns (25)
    PAT 1077 Kuchiguse (20)
    PAT 1043 Is It a Binary Search Tree (25)
    PAT 1053 Path of Equal Weight (30)
    c++ 常用标准库
    常见数学问题
  • 原文地址:https://www.cnblogs.com/sybboy/p/11810902.html
Copyright © 2011-2022 走看看