js数组的基本操作

作者: 星星的成长之路 | 来源:发表于2018-04-16 14:33 被阅读0次

    四个方面探索数组:

    1. 方法作用;
    2. 传递的参数;
    3. 有没有返回值,返回值是什么;
    4. 元数组是否改变;
    (1) push向数组末尾添加 (也可以通过索引在数组末尾添加内容)
    • 参数:要增加的内容,可以有多个参数;如果不传参数,返回的是数组本身的长度;
    • 返回值:有,数组增加后的长度(length);
    • 原数组改变;
    (2) pop删除数组中最后一项(也可以用arr.length--或者arr.length-=5)
    • 参数:不需要;
    • 返回值:删除的那一项;
    • 原数组改变;
    (3)shift删除数组中第一项
    • 参数:不需要;
    • 返回值:删除掉的那一项;
    • 原数组改变;
    (4)unshift 向数组开头添加(可多个)
    • 参数:要添加的内容,可以有多个参数;
    • 返回值:添加后数组的长度;
    • 原数组改变;
    (5)splice 删除, 增加,修改 (原数组改变)
    • splice(n,m) 从索引n开始删除m个;返回值是被删除的内容组成的新数组;原数组发生改变;
    • splice(n)从索引n开始删除到末尾;返回值是被删除的内容组成的新数组;原数组改变;
    • splice(n,m,x) 从索引n开始删除m个,把删除部分替换成x;返回值是被删除的内容组成的新数组;原数组发生改变;
    • splice(n,0,x)从索引n开始,一个都不删除,把x插入到原来数组索引n内容前面; 返回一个空数组,原数组改变;
    补充:
    • arr.splice();返回一个空数组,原数组不变;
    • arr.splice(0);返回一个复制的新数组;原数组清空;
    • arr.splice(0,1) 删除数组第一项arr.splice(arr.length-1,1) ;arr.splice(arr.length-1) 删除数组最后一项
    • arr.splice(0,0,x) 把x添加到数组开头
    • arr.splice(arr.length,0,x) 把x添加到数组末尾!记得一定不能是arr.length-1!
    (6)slice 截取原素组不改变,返回一个新的数组
    • arr.slice();arr.slice(0);返回一个复制的新数组;原数组不变;相当于克隆了一份数组;
    • slice(n) 从索引n开始,一直截取到末尾,组成新数组返回;当n为负数时,从arr.length-n索引开始,截取到末尾;
    • slice(n,m) 从索引n开始,截取到索引m处,不包括m那一项;返回一个截取的内容组成的新数组;当m为负值时,m==arr.length-m;
    补充:
    • arr.slice(2,2);arr.slice(n,n);返回一个空数组;
    • arr.slice(n,arr.length-m)===arr.slice(n,-m);
    补0方法:
    var num;
    if(num<10){
    console.log('0'+num);
    }
    else{
        console.log(num);
    }
    console.log(('0'+num).slice(-2));
    
    (7) concat拼接多个数组
    • 返回值是一个新数组,里面是拼接的每一项;
    var arr=[1,2,3,4];
    var arr2=[100,200];
    console.log(arr2.concat(arr,1000));//[100,200,1,2,3,4,1000]
    console.log(arr);//[1,2,3,4]
    
    (8) toString
    • 将数组转化为字符串,原数组没改变
      复制一个数组,返回一个新数组:
    var arr=[1,2,3,4,5];
    console.log(arr); //[1,2,3,4,5]
    console.log(arr.toString());//1,2,3,4,5
    console.log(arr.join());//1,2,3,4,5
    console.log(arr.join('+'));//1+2+3+4+5
    
    (9) join
    • 按照指定的分隔符把数组拆分成字符串
    • 补充:eval可将字符串转换为js表达式(eval不是数组方法)
    var arr=[1,2,3,4,5,6];
    console.log(arr.join('+'));1+2+3+4+5+6
    console.log(eval(arr.join('+')));21
    
    console.log(arr.join('*'));1*2*3*4*5*6
    console.log(eval(arr.join('*')));720
    

    数组的排列和排序

    (10)reverse 原数组改变
    • 把数组倒过来排列,原数组改变,返回的是倒过来后的新数组;
    (11)sort排序
    • 默认给10以内从小到大排序,原数组改变;1,12,34,5,6,78,9;
    从小大大排序:
    console.log(arr1.sort(function(a,b){
    return a-b;
    }));//Array[1,5,6,9,12,34,78]
    
    从大到小排序:
    console.log(arr1.sort(function(a,b){
        return b-a;
    }));// Array[78,34,12,9,6,5,1]
    
    在标准浏览器兼容,但在IE6-8不兼容
    
    (12)IndexOf/lastIndexOf(在字符串中也有这两个方法,可兼容所有浏览器)
    • 数组中第一次出现/最后一次出现的内容的索引位置,如果找到索引就返回,如果没有返回-1(可以用于数组去重);
    (13)forEach
    var arr1=[1,12,34,15,60];
    arr1.forEach(function(item,index){//item是数组中的每一项;index是数组的索引
        console.log(index+":"+item);0:11:122:343:154:60
    })  
    
    (14)map 也是一种遍历,主要用于修改数组内容
    var arr1=[1,12,34,15,60];
    var arr2=arr1.map(function(item,index){//item是数组中的每一项;index是数组的索引
        item*=10;
        return item;
    })
    console.log(arr2); // Array[10,120,340,150,600]
    

    (15)filter 筛选查找

    var arr1=[1,12,34,15,60,4];
    var arr3=arr1.filter(function(item,index){
        if(index!=3){
            return true;
           }
        else{
            return false;
           }
    })
    console.log(arr1);// [1,12,34,15,60,4]
    console.log(arr3);// [1,12,34,60,4]
    

    补充:

    • 对象数据:
      创建一个对象,会开辟一个内存空间,产生一个引用地址,把这个地址赋值给变量
    var a1=[1,2,3,4];
    var a2=a1;
    a2[0]=100;
    console.log(a1);// Array[100,2,3,4]
    console.log(a2);// Array[100,2,3,4]
    var a1=[1,2,3,4];//开辟一个空间,有一个地址
    var a2=a1;//a1的引用地址赋值给a2
    a2=[100];//a2指向了一个新的空间
    a2[0]=1;//新的空间第一项为1
    console.log(a1);// Array[1,2,3,4]
    console.log(a2);// Array[1]
    
    • 基本数据类型:
      直接操作值;
    var num1=1;
    var num2=num1;
    num2 = 3;
    console.log(num1);1
    console.log(num2);3
    
    • 判断null和undefined用两个等号==,否则都用三个等号===;

    相关文章

      网友评论

        本文标题:js数组的基本操作

        本文链接:https://www.haomeiwen.com/subject/yrhekftx.html