数组的常用方法

数组的常用方法

数组的声明

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
// 数组的声明
var arr1 = [1, 2, 3, 4, 5];
var arr2 = new Array(6, 7, 8, 9, 10);
var arr3 = new Array(4);
console.log(arr1);
console.log(arr2);
console.log(arr3);
// 访问数组项
console.log(arr1[1]) // 2
// 数组下标越界
console.log(arr2[6]) // undefined
// 数组长度
console.log(arr3.length) // 4
// 数组的检测方法
console.log(Array.isArray(arr2)) // true

数组的常用方法1 —— 以下4种方法均会改变原数组

  1. 数组的push()方法

    1
    2
    3
    4
    5
    6
    7
    // 数组的头尾操作
    var arr4 = [1,2,3,4]
    var backValue // 接收返回值

    // push 尾部推入一项，无返回值
    arr4.push(5)
    console.log(arr4) // [1,2,3,4,5]

  2. 数组的pop()方法

    1
    2
    3
    // pop 尾部去除一项，且将删除的那一项作为返回值
    backValue = arr4.pop()
    console.log(arr4, backValue) // [1,2,3,4]

  3. 数组的unshift()方法

    1
    2
    3
    // unshift 数组头部插入一项
    arr4.unshift(0)
    console.log(arr4) // [0,1,2,3,4]

  4. 数组的shift()方法

    1
    2
    3
    // shift 数组头部去除一项，且将删除的那一项作为返回值
    backValue = arr4.shift()
    console.log(arr4, backValue) // [1,2,3,4]

数组的常用方法2

  1. splice() 方法 —— 万能方法，arr.splice(索引开始,长度,内容)，改变原数组

    1. 替换数组的指定项，返回值为被替换掉的项，且返回类型为数组

      1
      2
      3
      4
      var arr1 = ['A','B','C','D','E','F']
      var backValue
      backValue = arr1.splice(2,3,'AA','BB','CC')
      console.log(arr1, '返回值：',backValue) // ['A','B','AA','BB','CC','F'] 返回值：['C','D','E']

    2. 向数组中增加某些项,返回值为空数组

      1
      2
      backValue = arr1.splice(3,0,'1','2','3')
      console.log(arr1, '返回值：',backValue) //['A','B','AA','1','2','3','BB','CC','F'] 返回值：['']

    3. 删除数组的某些项，返回值为被删除的项，且返回类型为数组

      1
      2
      backValue = arr1.splice(2,3)
      console.log(arr1, '返回值：',backValue) //['A','B','3','BB','CC','F'] 返回值：['AA','1','2']

  2. slice() 方法 —— 类似于字符串.slice() 方法，arr.slice(索引起始，索引结束) ，不包括索引结束的那一项，可以为负数；改变原数组

    1
    2
    3
    4
    // var newArr = arr1.slice(2,5)
    // var newArr = arr1.slice(2) 
    var newArr = arr1.slice(2,-1)
    console.log(newArr)

数组的常用方法3

  1. 数组 join() 方法，用于数组转为字符串，传参作为每项的连接符，且不改变原数组

    1
    2
    3
    4
    5
    6
    7
    8
    var arr = ['A','B','C','D','E','F']
    var newArr
    newArr = arr.join() // 会携带逗号转为字符串
    console.log(newArr) // A,B,C,D,E,F
    newArr = arr.join('') //最常用
    console.log(newArr) // ABCDEF
    newArr = arr.join('☆')
    console.log(newArr) // A☆B☆C☆D☆E☆F

  2. 字符串 split() 方法，用于数组转为字符串，传参作为每项的连接符，且不改变原数组

    1
    2
    3
    4
    5
    6
    7
    var str = '淤泥不染莲，白璧映初心'
    newArr = str.split() // 不传参，会将整个str作为数组的一项
    console.log(newArr)  // ['淤泥不然莲，白璧映初心']
    newArr = str.split('')  // 传入空串，将每一个字符作为数组的每一项
    console.log(newArr) // ['淤','泥','不','染','莲','，','白','璧','映','初','心']
    newArr = str.split('，')  // 按照指定的字符分割
    console.log(newArr)  // ['淤泥不染莲','白璧映初心']

  3. concat() 方法，用于数组的联结，返回值为联结后的新数组，则此方法不改变原数组

    1
    2
    3
    4
    5
    var arr1 = [1,2,3,4]
    var arr2 = [5,6,7,8]
    var arr3 = [9,10,11,12]
    newArr = arr1.concat(arr2,arr3)
    console.log(newArr) //  [1,2,3,4,5,6,7,8,9,10,11,12]

  4. reverse() 方法

    1
    2
    newArr = arr1.reverse()
    console.log(newArr) // [4,3,2,1]

  5. 拓展：将字符串 ‘A-B-C-D-E-F-G’进行翻转（不要’-‘）

    1
    2
    3
    4
    5
    var str1 = 'A-B-C-D-E-F-G'
    var strToArr = str1.split('-') // 将字符串转为数组，且去掉'-'
    strToArr.reverse() // 使用数组的 reverse() 方法将数组翻转
    var newStr = strToArr.join('') // 将翻转后的数组转为字符串
    console.log(newStr)

  6. indexOf() 方法， 查找第一个被找到的数组项的索引值，找不到则返回 -1

    1
    2
    3
    4
    var arrIdx = [1,2,3,4,5]
    var index = arrIdx.indexOf(3)
    var notFound = arrIdx.indexOf('3')
    console.log(index,notFound) // 2 -1

  7. includes() 方法，判断数组是否包含指定的数组项，返回值为布尔类型（true/false）

    1
    2
    3
    4
    var arrIcd = [1,2,3,4,5]
    var includes = arrIcd.includes(2)
    var notIcd = arrIcd.includes('2')
    console.log(includes,notIcd) true false

  8. 拓展： 字符串中某个索引位置的字符

    1
    2
    3
    4
    5
    var str3 = '淤泥不染莲，白璧映初心'
    var num1 = str3[4] // '莲'
    var num2 = str3[6] // '白'
    var num3 = str3[20] // undefined
    console.log(num1,num2,num3)