• JS数组操作API ------【那些年一不留神踩的坑】


    数据处理对于我们前端工程师而言,那可谓是每天都要面对的事情,今天我们就来总结一下在处理数组时,常用到的一些数组API,以及一些易错点。。。【前方干货,Are you ready? Go!】

    概览数组API:

    事实上,我们可以大致把数组 api 归结为以下几种功能:分合、调序、截取、遍历(判断、筛选、查找)

    改变原数组的:  reverse,  sort,  splice

    不会改变原数组的: slice,  indexOf,  join,  concat, every,  some,includes,  filter,  find,    fill,  reduce, forEach,map

        var arr = [1, 2, 5, 3, 4, 10];
        var arr1 = ["a", "b", "c", "d", "e"];
    
        
        // 判断数据是否为数组
        var a = Array.isArray([2,5,3,6]); // true
        // 将字符串转化为数组
        var a = Array.from("asfsds"); // ["a", "s", "f", "s", "d", "s"];
        // 1.---------- 分合-------------
        var a = arr.join("_");
        var a = arr.concat(arr1);
    
    
     // 2.------调序-----------------
        //  反转数组元素顺序
        var a = arr.reverse();
        //  排序(并不是排大小顺序)
        var arr = [1, 2, 5, 3, 4, 10];   
        var a = arr.sort();
    
        
    
    // 3.-------- 截取 ----------------    
        // splice改变原数组
        // arr.splice(m,n)      (从第m位开始,截取n个元素)
        // arr.splice(m)         (从第m位开始,一直截取到数组末位)
        // arr.splice(m,n,a,b)   (从第m位开始,删掉n个元素, 添加a, 添加b,.....)
        var arr = [1, 2, 5, 3, 4, 10];   
        var a = arr.splice(1,3,"a"); // [2,5,3]
        var arr = [1, 2, 5, 3, 4, 10];
        var a = arr.splice(1,3); // [2,5,3]
        var a = arr.splice(2,1,'w','z'); // 5(返回的是删除/截取的部分)
        // 从下标为2的地方删除1个元素,并添加两个元素
    
       
        // slice不改变原数组
        //  arr.slice(m,n)(从第m位开始,到第n位结束),不包含第n位
        var arr = [1, 2, 5, 3, 4, 10];     
        var a= arr.slice(1,3); // [2,5](不包括下标为3的)
        console.log(arr)  //  [1,2,5,3,4,10]
    
    
    // 4.----------  遍历  --------------
    
        // map 遍历数组
        arr.map((item,i) =>  console.log(item,i))    
    
        // every,some,includes 判断  是否有满足条件的元素,返回boolean值
        var a = arr.every(x=>x>3); // false
        var a = arr.some(x=>x>3);  // true
        var a = arr.includes(2)    // true
        
        // filter   筛选,返回满足条件的所有元素组成的一个新数组
        var a = arr.filter(x=>x>3);  // [5,4,10]
    
        //  find    查找,返回通过满足条件的第一个元素的值
        var a = arr.find(x=>x>3);   // 5
    
       // indexOf 查找,该方法既可操作数组,也可操作字符串,  
       // 传入我们要查找的那个值
       //返回-1时代表没有此项;  返回非负数时 代表当前元素(或元素首位)在原数组(或原字符串)中所处的位数 
       var a = arr.indexOf(2); // 1

    最后简单提一下数组的遍历方法:

    1. for (let  i=0; i<arr.length; i++)

    2. for (let i  in  arr)   --------  i 为索引值

    3. for (let i of  arr)    --------  i 位每一项

    4.  arr.forEach()

    5.  arr.map(item => console.log(item))

     【本章拓展】:

    // 把字符串类型的数组转化为真正的数组
    let switchstr = '["index.html","dashboard.html","service.html"]'
    let switch1 = switchstr.replace(/[/,",").replace(/]/,",").replace(/"+/g,"").split(",")
    switch1.pop()
    switch1.shift()
    console.log(switch1)
    
    var a = [1,2,3,4,5]
    console.log(a.toString())
    var b = '4000'
    console.log(parseInt(b))
    var c = a
    console.log(c)

    作者:牧羊狼

    出处:https://www.cnblogs.com/edwardwzw/

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利,谢谢您的配合。 Freedom is not let you do whatever you wanna but teach you not to do the things that you donnot wanna do.

  • 相关阅读:
    CodeForces 19D Points (线段树+set)
    FZU 2105 Digits Count
    HDU 5618 Jam's problem again(三维偏序,CDQ分治,树状数组,线段树)
    HDU 5634 Rikka with Phi (线段树)
    Java实现 蓝桥杯 算法提高 转圈游戏(暴力快速幂)
    Java实现 蓝桥杯 算法提高 转圈游戏(暴力快速幂)
    Java实现 蓝桥杯 算法提高 转圈游戏(暴力快速幂)
    Java实现 蓝桥杯 算法提高VIP Substrings(暴力)
    Java实现 蓝桥杯 算法提高VIP Substrings(暴力)
    Java实现 蓝桥杯 算法提高VIP Substrings(暴力)
  • 原文地址:https://www.cnblogs.com/edwardwzw/p/11674785.html
Copyright © 2020-2023  润新知