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 替换数组中的特定值

    有时在创建代码时需要替换数组中的特定值,有一种很好的简短方法可以做到这一点,咱们可以使用.splice(start、value to remove、valueToAdd),这些参数指定咱们希望从哪里开始修改、修改多少个值和替换新值。
    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 Array.from 达到 .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.置空数组

    有时候我们需要清空数组,一个快捷的方法就是直接让数组的 length 属性为 0,就可以清空数组了。

    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 用数据填充数组

    在某些情况下,当咱们创建一个数组并希望用一些数据来填充它,这时 .fill()方法可以帮助咱们。

    var newArray = new Array(10).fill(“1”);
    console.log(newArray); // returns [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]

    7 数组合并

    使用展开操作符,也可以将多个数组合并起来。 

    var fruits = [“apple”, “banana”, “orange”];
    var meat = [“poultry”, “beef”, “fish”];
    var vegetables = [“potato”, “tomato”, “cucumber”];
    var food = […fruits, …meat, …vegetables];
    console.log(food); // [“apple”, “banana”, “orange”, “poultry”, “beef”, “fish”, “potato”, “tomato”, “cucumber”]
    

    8.求两个数组的交集

    求两个数组的交集在面试中也是有一定难度的正点,为了找到两个数组的交集,首先使用上面的方法确保所检查数组中的值不重复,接着使用.filter 方法和.includes方法。如下所示: 

    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]
    9.从数组中删除虚值
    在 JS 中,虚值有 false, 0,'', null, NaN, undefined。咱们可以 .filter() 方法来过滤这些虚值。
    var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false];
    var trueArr = mixedArr.filter(Boolean);
    console.log(trueArr); // returns [“blue”,
    

    10 从数组中获取随机值

    有时我们需要从数组中随机选择一个值。一种方便的方法是可以根据数组长度获得一个随机索引,如下所示:

    var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
    var randomColor = colors[(Math.floor(Math.random() * (colors.length)))]

    11.反转数组
    现在,咱们需要反转数组时,没有必要通过复杂的循环和函数来创建它,数组的 reverse 方法就可以做了:

    ar colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
    var reversedColors = colors.reverse();
    console.log(reversedColors); // returns [“brown”, “black”, “yellow”, “orange”, “purple”, “pink”, “navy”, “green”, “white”, “blue”]

    12 lastIndexOf() 方法
    某个元素在数组中最后出现的位置的下标:

    var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7];
    var lastIndex = nums.lastIndexOf(5);
    console.log(lastIndex); // returns 9

    13.对数组中的所有值求和
    JS 面试中也经常用 reduce 方法来巧妙的解决问题

    var nums = [1, 5, 2, 6];
    var sum = nums.reduce((x, y) => x + y);
    console.log(sum); // returns 14
  • 相关阅读:
    RN-Android构建失败:Caused by: org.gradle.api.ProjectConfigurationException: A problem occurred configuring root project 'AwesomeProject'.
    Android更新包下载成功后不出现安装界面
    真机调试: The application could not be installed: INSTALL_FAILED_TEST_ONLY
    react native 屏幕尺寸转换
    Android Studio生成签名文件,自动签名,以及获取SHA1和MD5值
    React Native安卓真机调试
    git提交代码报错Permission denied, please try again
    The sandbox is not in sync with the Podfile.lock. Run 'pod install' or update your CocoaPods installation.
    命令行设置快捷命令
    Linux 常用指令
  • 原文地址:https://www.cnblogs.com/snowhite/p/14524245.html
Copyright © 2011-2022 走看看