js数组

js中数组是比较常用的对象,同时js中的数组也十分的灵活。
一. 创建数组的方式

  • 字面量数组

     var arr=[1,2,3,4]
    
  • 使用Array构造函数

    var arr=new Array()//创建了一个空数组
    var arr=new Array(6)//[undefined × 6]
    arr.length//6
    用Array创建数组时,当里面的参数只有一个时,表示的是数组的长度.
    var arr=new Array(1,2,3)//[1, 2, 3]
    arr.length //3
    arr[0]  //1
    arr[1]  //2
    arr[2]  //3
    用Array创建数组时,当里面的参数不止一个时,里面的参数代表的是数组的值
    

二. 数组的属性length

  • length属性表示的是一个数组的长度,即数组中元素的个数

     数组中的每个元素都有一个索引号,而且索引号是从0开始。
     var arr=[1,2,3,4,5]
     console.log(arr.length)//5
     arr[0]// 1  数组的第一个元素,索引号从0开始。
     arr[4]//5   数组的最后一个元素,索引号为length-1;
    正是因为索引号从0开始,所以一个数组的上、下限分别为0和length-1
    
  • js中length属性是可变的

     arr.length=6//增大数组的长度
     console.log(arr.length)//6
    

三、 数组的添加和删除
(1)push():在一个数组的最后一个元素后面添加元素,这个方法会改变原数组

     var arr=[1,2,3,4]
     var newarr=arr.push(0)//在arr数组的后面加上0这个值。
     console.log(newarr)//这个输出的结果是5,因为输出的是加入0后这个数组的长度。
     console.log(arr)//[1, 2, 3, 4, 0]用push()添加元素后,原来的数组改变了

(2)pop():删除数组的最后一个元素,这个方法也会改变原数组。

  var arr=[1,2,3,4]
  var newarr=arr.pop()//删除数组的最后一个元素
  console.log(newarr)//4,返回的是要删除的这个元素的值。
  console.log(arr)//[1,2,3] 原数组改变了。

(3)unshift():向数组头部添加一个元素,会改变原数组
var arr=[1,2,3,4]
var newarr=arr.unshift(0);在数组的头部添加0这个元素。
console.log(newarr)//5,和push方法一样,返回的是改变后的数组的长度。
console.log(arr)//[0, 1, 2, 3, 4]
(4)shift():删除数组的头部元素,会改变原数组

   var arr=[1,2,3,4]
   var newarr=arr.shift()
   console.log(newarr)//1,和pop方法一样,返回的是删除的元素的值。
   console.log(arr)//[2, 3, 4]
  • 这四个方法都是用于对数组的删除和添加的,但是只能在数组的头部和尾部添加和删除,而且这四个方法都会改变原数组
    (5)splice():用于对数组的插入和删除,而且不限于在数组的尾部和首部添加和删除,同样也会改变原数组,返回一个由删除元素组成的新数组,没有删除则返回空数组

  • 当在splice(a,b)里传入两个参数时,可以实现数组元素的删除.其中a参数表示的是绝对索引值,b参数表示的是而是删除动作执行的次数。

    var arr=[1,2,3,4,5]
    arr.splice(2,3)//[3, 4, 5],返回的是由删除元素组成的新数组,splice(2,3) 表示从索引号为2的这个元素开始删除的动作执行3次,所以删除的是3,4,5,这几个元素。
    console.log(arr)//[1,2]

  • 当在splice(a,b,val)中传入三个参数时,可以实现数组的插入与替换,其中val表示的是插入的值。

  • 当第二个参数为0时,表示插入,不删除原数组的任何元素。

     var arr=[1,2,3,4,5]
     arr.splice(1,0,4)//[]没 有删除所以返回一个空数组。
     console.log(arr)//[1, 4, 2, 3, 4, 5],元素组被改变,在索引号为1的元素前面插入了值为4的元素。
    
  • 当第二个参数不为0时,表示先删除在插入,及我们平常所说的替换。

    var arr=[1,2,3,4,5]
    arr.splice(1,1,5)//[1]返回有删除的元素组成的新数组。
    console.log(arr)//[1, 5, 3, 4, 5],把索引号为1的元素删除,然后把值为5的元素加入进去,也就是5替换了原来的2.
    
  • 有了splice()方法后,我们可以用splice()方法分别实现上面的push()、pop()、unshift().shift()等方法。

    • 用splice实现push()

        function push(arr,val) {
        arr.splice(arr.length,0,val)
        return arr
        }
       var arr=[1,2,3,4]
       push(arr,val)//[1, 2, 3, 4, 5]
      
    • 用splices实现pop()

      function pop(arr) {
      var b=arr.splice(arr.length-1,1)[0]
      console.log(arr)
       }
      var arr=[1,2,3,4]
      push(arr,val)//[1, 2, 3]
      
    • 用splice实现unshift();

      function unshift(arr,val) {
      arr.splice(0,0,val)
      console.log(arr);
       }
       var arr=[1,2,3,4]
       unshift(arr,0)// [0, 1, 2, 3, 4]
      
    • 用splice实现shift();

      function shift(arr) {
      arr.splice(0,1);
      return arr;
        }  
       var arr=[1,2,3,4]
       shift(arr)//[2, 3, 4]
      

四、数组的其他操作

  • join():是把数组元素使用参数作为连接符连接成一字符串,不会修改原数组内容
    var arr=[“hello”,”jirengu”,”my”,”name”]
    arr.join(” “);//”hello jirengu my name”
    console.log(arr)//[“hello”, “jirengu”, “my”, “name”]
  • sort():sort方法用于对数组进行排序,会改变原数组。
  • slice(start,end):用于返回数组中的一个片段或子数组。不会改变原数组,而是返回一个新数组。
    var arr=[1,2,3,4]
    arr.slice(1,2)//[2]
    console.log(arr)//[1,2,3,4]
  • concat(array):用于拼接数组,
    var arr1=[1,2,3,4]
    var arr2=[5,6,7,8]
    var arr3=arr1.concat(arr2)
    console.log(arr3);//[1, 2, 3, 4, 5, 6, 7, 8]
  • Array.isArray(obj):这是ES5中的方法,用于判断一个对象是不是数组。
    var a=[1,2,3]
    var b=function() {console.log(‘1’)};
    console.log(Array.isArray(a));//true
    console.log(Array.isArray(b));//false
  • indexOf(element):这是ES5中的方法,用于查找数组内指定元素位置,查到第一个后放回其索引,没有找到就返回-1;
    var arr1=[‘a’,’b’,’c’,’d’,’a’,’e’]
    console.log(arr1.indexOf(‘a’))//0
  • forEach(ele,index,arr):这是ES5中的方法,用于遍历数组。参数为一个回调函数,回调函数中有三个参数。
    var arr1=[‘a’,’b’,’c’,’d’,’a’,’e’]
    arr1.forEach(function(e,idx,array) {
    array[idx]=e.toUpperCase();
    });
    console.log(arr1)//”A”, “B”, “C”, “D”, “A”, “E”]
    原文作者:饥人谷_廖珍
    原文地址: https://www.jianshu.com/p/c2b19972fa60
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞