javascript Array的基本用法

数组基本用法

1. concat() 拼接数组，原数组不变

let arr = [1,2,3,4,5]
let arrCopy = arr.concat(6, [7,8,9])
console.log(arrConcat) // [1,2,3,4,5,6,7,8,9]
console.log(arr) // [1,2,3,4,5]

2. join() 、toString() 数组转字符串

let arr = [1,2,3,4]
console.log(arr.join('-'))  // 1-2-3-4
console.log(arr.toString())  // 1,2,3,4

3. pop() 删除并返回数组的最后一个元素，数组变化，返回数组的最后一个元素

let arr = [1,2,3,4]
console.log(arr.pop())  // 4
console.log(arr)  // [1,2,3]

4. push() 向数组的末尾添加一个或者多个元素，并返回数组的长度

let arr = [1,2,3,4]
console.log(arr.push(a)) // 5
console.log(arr) // [1,2,3,4,a]

5. shift() 删除并返回数组的第一个元素

let arr = [1,2,3,4]
console.log(arr.shift())  // 1
console.log(arr)  // [2,3,4]

6. unshift() 向数组的开头添加一个或更多的元素，并返回新的长度

let arr = [1,2,3,4]
console.log(arr.unshift(a)) // 5
console.log(arr)  // [a,1,2,3,4]

7. reverse() 颠倒数组中的元素序列

let arr = [1,2,3,4]
console.log(arr.reverse()) // [4,3,2,1]

8. slice() 截断数组，返回新数组，原数组不变

let arr = [1,2,3,4]
let arr2 = arr.slice()
console.log(arr2)  // [1,2,3,4]
let arr3 = arr.slice(0, 2)
console.log(arr3)  // [1,2]
arr2.shift()
console.log(arr2)  // [2,3,4]
console.log(arr)  // [1,2,3,4]

• 注：slice() 有复制数组的作用，在js中数组是引用类型存储在堆中，不可以直接赋值给其他变量，如果赋值给其他变量，两个变量共用一个数组地址，其中一个变量改变，两一个变量数组也会改变；所以slice()这个方法解决了数组的复制性，除了slice()这个方法，还有concat()方法也可复制数组

9. sort() 按升序排列数组项

let numberArr = [12,34,25,54,7,9]
console.log(numberArr.sort())  // [12,25,34,54,7,9]
let stringArr = ['a','d','b']
console.log(stringArr.sort())  // ['a','b','d']

• 注：在排序时，sort()方法会调用每个元素的toString()方法，然后比较字符串，根据字符串进行排序
• 注：sort()方法可以接受一个函数作为参数，比较的函数接受两个参数，通过返回正数，0，负数进行排序决定。

function compareArr(value1, value2) {
  if (value1 > value2) {
    return -1
  } else if (value1 < value2) {
    return 1
  } else {
    return 0
  }
}
let numberArr = [12,34,25,54,7,9]
console.log(numberArr.sort(compareArr))  // [54, 34, 25, 12, 9, 7]

10. splice() 向数组指定位置删除、添加元素

• 注：splice(位置，删除个数，插入元素) 三个参数的意义

let arr = [1,2,3,4,5,6,7,8]
console.log(arr.splice(0, 1))  // 1
console.log(arr)  // [2,3,4,5,6,7,8]
let a = [1,2,3,4,5,6,7,8]
a.splice(2,1,2,3,4)
console.log(a) //  [1,2,2,3,4,5,6,7,8]

11. indexOf() 、lastIndexOf() 定位数组元素，可以接受两个参数，第一个是查找的元素，第二个参数是起始点

let arr = [1,2,3,4,6,2,3,7,8,9];
console.log(arr.indexOf(2)); // 1
console.log(arr.lastIndexOf(4)); // 3
console.log(arr.indexOf(2,5)); // 5
console.log()arr.lastIndexOf(4, 2) // -1  从第三位开始查找（向前查找）
console.log(arr.lastIndexOf(3)); // 6
console.log(arr.indexOf(3))  // 2

12. forEach() 、map() 、filter() 、every() 、some() 数组遍历循环

• forEach() 没有返回值

let arr = [1,2,3,4,5,6,7]
arr.forEach((value, index) => {
  console.log(value, index)
})
// 1, 0  2,1  3,2  4,3  5,4  6,5  7,6

• map() 返回每次函数调用的结果组成的数组，映射

let arr = [1,2,3,4,5,6,7]
let arr2 = arr.map((value, index) => {
  return value * index
})
console.log(arr2)
console.log(arr)
// [0, 2, 6, 12, 20, 30, 42]
// [1, 2, 3, 4, 5, 6, 7]

• filter() 返回满足条件的元素组成的数组

let arr = [1,2,3,4,5,6,7]
let arr2 = arr.filter((value, index) => {
  return index == 2 || index == 3
})
console.log(arr2)
console.log(arr)
// [3, 4]
// [1, 2, 3, 4, 5, 6, 7]

• every() 只要数组中的每个元素满足条件就返回true，否则返回false

let arr = [1,2,3,4,5,6,7]
let every = arr.every((value, index) => {
  return value == index
})
console.log(every)
console.log(arr)
// false
// [1, 2, 3, 4, 5, 6, 7]

• some() 主要数组中的有一个元素满足条件就返回true，否则返回false

let arr = [1,2,3,4,5,6,7]
let some = arr.some((value, index) => {
  return value == index
})
console.log(some)
console.log(arr)
// false
// [1, 2, 3, 4, 5, 6, 7]

感谢您的view，留个赞再走呗

• 感谢浏览姑娘的文章，来自一个写前端的姑娘！