盒子
盒子
文章目录
  1. JavaScript数组操作
    1. ECMAScript5中数组的方法

JavaScript数组操作

2017.01.12 maotingfeng

JavaScript数组操作

  • join() 方法将数组中所有的元素都转化为字符串并连接在一起，返回最后生成的字符串。可以指定一个可选的字符串在生成的字符串中来分隔数组的各个元素，如果不指定分隔符，默认使用英文逗号。一般配合String.split()方法的操作。

    1
    2
    var a = [ 1 , 2, 3 ] ;
    a.join() ;	// "1,2,3"

  • reverse()方法将数组中的元素颠倒排序，返回逆序的数组，不创建新数组，在原有的数组上逆序。

  • sort()方法将数组的元素排序，并返回排序后的数组，不创建新数组，在原有的数组上排序。当不带参数调用sort()时，数组元素以字母顺序排序，如果数组包含undefined元素，它们会被排到数组的尾部。

    1
    2
    var a = [ 33 , 4 , 1111 , 222 ] ;
    a.sort( function(a,b){ return a - b ; } )	// a = [4, 33, 222, 1111]

  • concat()方法创建并返回一个新数组，它的元素包括调用concat()的原始数组的元素和concat()的每个参数。如果这些参数中的任何一个自身是数组，则连接的是数组的元素，而不是数组本身。但要注意，concat()不会递归扁平化的数组。

    1
    2
    3
    4
    5
    6
    var a = [ 1 , 2 , 3 ] ;
    a.concat( 4 , 5 ) ; 	// [ 1 , 2 , 3 , 4 ,5 ]
    var b = [ 1 , 2 ,3 ] ;
    b.concat( [ 4 , 5 ] ) ; // [ 1 , 2 , 3 , 4 , 5]
    var c = [ 1 , 2 , 3 ]
    c.concat( [ 4 , [ 5 ] ] ) ;	// [ 1 , 2 , 3 , 4 , [ 5 ] ]

  • slice()方法返回指定数组的一个片段或址数组，返回新数组。它的两个参数分别指定了片段的开始和结束位置。返回的数组包含第一个参数指定的位置和到第二个参数（不包含第二个参数）指定的位置之间的数组元素。

    • 如果指定一个参数，返回的数组包含从开始位置到数组结尾的所有元素。
    • 如果参数中出现负数，它表示相对于数组中最后一个元素的位置。-1指定了最后一个元素，-3倒数第三个元素。
    • 如果不指定开始位置，默认从0开始
    1
    2
    3
    4
    var a = [ 1 , 2 , 3 , 4 , 5 ] ;
    a.slice( 0 , 3 ) ; 	// [ 1 , 2 , 3 ]
    a.slice( -3 , -2 ) ; // [ 3 ]
    a.slice() 			// [ 1 , 2 , 3 , 4 , 5 ]

  • splice()方法在数组中插入或删除元素的通用方法，原有的数组相应的被修改，返回被删除元素的新数组。

    • 第一个参数指定了插入（或删除）的起始位置，第二个参数指定了应该从数组中删除的元素的个数。如果省略第二个参数，从起始到数组结尾的所有元素都将被删除。如果没有被删除的元素，就返回空数组。

      1
      2
      3
      4
      var a = [ 1 , 2 , 3 , 4 , 5 , 6 , 7 , 8 ];
      a.splice( 4 ) ;	// 返回[ 5 , 6 , 7 , 8 ];a是[ 1 , 2 , 3 , 4 ]
      var b = [ 1 , 2 , 3 , 4 , 5 , 6 , 7 , 8 ];
      b.splice( 4 , 2 ) ;	// 返回[ 5 , 6 ];b是[ 1 , 2 , 3 , 4 , 7 , 8 ]

    • 前两个参数指定了需要删除的数组元素，后面的任意个参数指定了需要插入到数组中的元素，从第一个参数指定的位置开始插入。

      1
      2
      var a = [ 1 , 2 , 3 , 4 , 5 ] ;
      a.splice( 2 , 2 , 'a' , 'b' , [ 'c' ] ) ; // [ 1 , 2 , 'a' , 'b' , [ 'c' ] , 5 ]

  • push()和pop()方法允许将数组当作栈来使用，都是修改原有的数组。

    • push()方法，在数组的尾部添加一个或多个元素，并且返回数组的新长度。
    • pop()方法相反，它删除数组的最后一个元素，并且返回它删除的值。

  • unshift()和shift()方法，在数组的头部进行元素的插入和删除操作。

    • unshift()在数组的头部添加一个或多个元素，返回数组的新长度。多个参数时，插入的元素顺序和参数顺序一致。
    • shift()删除数组的第一个元素并且将其返回。

  • toString()和toLocaleString()方法，将数组的每个元素转化为字符串（如有必要，将调用元素的toString()方法），并且输出用逗号分隔的字符串列表。

    1
    2
    3
    4
    [ 1 , 2 , 3 ].toString() // "1,2,3"
    [ 'a' , 'b' , 'c' ].toString() // "a,b,c"
    [ 1 , [ 2 , 'c' ] ].toString() // "1,2,c"
    // 这里和不使用参数的join()方法返回的字符串一致
    • toLocaleString()是toString()方法的本地化版本，它调用元素的toLocaleString()方法将每个数组元素转化为字符串，使用本地化的（或者自定义实现的）分隔符将这些字符串连接起来生成最终的字符串。
    1
    2
    3
    4
    // 不同的区域设置和语言设置，执行的输出结果可能不同。
    [ 1 , [ 2 , 'c' ] ].toLocaleString() // "1,2,c"
    [ new Date() ].toLocaleString()		 // "2017/1/11 上午10:31:37"
    [ 15.26440 ].toLocaleString()		 // "15.264"

ECMAScript5中数组的方法

  • forEach()方法从头至尾遍历数组，为每个元素调用指定的函数。

  • map()方法将调用的每个元素传递给指定的函数，并且返回一个数组，它包含该函数的返回值。

  • filter()方法返回的数组元素是调用的数组的一个子集，filter()会跳过稀疏数组中缺少的元素，它的返回数组总是稠密的。

  • every()和some()方法是数组的逻辑判定：它们对数组元素应用指定的函数进行判定，返回true和false。

    • every()方法针对所有元素调用判定函数，都返回true时，它才返回true。

      1
      2
      3
      var a = [ 1 , 2 , 3 , 4 , 5 ] ;
      a.every( function(x){ return x < 10 ; } )	// true
      a.every( function(x){ return x % 2 === 0 ; } )	// false

    • some()方法当数组中至少有一个元素调用判定函数返回true时，它就返回true；否则返回false。

      1
      2
      3
      var a = [ 1 , 2 , 3 , 4 , 5 ] ;
      a.some( function(x){ return x % 2 === 0 ; } )	// true
      a.some( isNaN )									// false

    • 在空数组上调用时，every()返回true，some()返回false。

    • every()判定函数第一次返回false时，会立即终止遍历，返回false；some()判定函数第一次返回true，会立即终止遍历，返回true。

  • reduce()和reduceRight()方法使用指定的函数将数组进行组合。

  • indexOf()和lastIndexOf()搜索整个数组中具体给定值的元素，返回找到的第一个元素的索引，如果没有找到，就返回-1。

    • indexOf()从头至尾搜索，而lastIndexOf()则反向搜索。
支持一下
扫一扫，支持lcoder