JS Array常用处理 + 实践

数组一个经常需要用到的对象，特此在这里总结记录一下几种常用处理。

连接两个或多个数组 cancat()

该方法不会改变现有的数组，仅仅会返回连接数组的一个副本。将数据拼接到现有数组的后面

连接数据

var array = [1, 2,3]
array = array.concat(4,5)
console.log(array)
// 输出 数组对象[1，2，3，4，5]

连接数组

var array1 = [1, 2,3]
var array2 = [4,5,6]
array1 = array1.concat(array2)
console.log(array1)
// 输出数组对象[1，2，3，4，5，6]

将数组中的元素进行连接用字符串输出

toString()方法，可以将数组中的元素之间用逗号分隔

var array1 = [1, 2,3]
array1[3] = 5
console.log(array1.toString())
//字符串 1,2,3,5

join() 用于把数组中的所有元素放入一个字符串中，可以用指定的分隔符进行分隔。

var array1 = [1, 2,3]
console.log(array1.join()) // join() 不传任何参数默认使用逗号分隔和toString()是一样的
// 1,2,3
console.log(array1.join('.')) // 传入一个点，使用点进行分隔数组中的元素
// 1.2.3

splice()向数组中添加/删除项目

注意：该方法会改变原始数据

语法

arrayObject.splice(index,howmany,item1,.....,itemX)
index --- 添加删除项目的位置，从0开始计算
howmany ---- 要删除的项目数量，如果设置为0，则不会删除任何项目表示添加
item1...itemx ----- 向数组添加的新项目

向数组中插入元素

// 创建一个数组，比如将元素插入到第二个位置
var arr = [1,2,3]
arr.splice(1, 0, 8)
console.log(arr) // 输出 [1, 8, 2, 3]

删除指定位置的元素，和删除指定位置的元素用其他元素替代

var arr1 = [1,2,3]
arr1.splice(1, 1)
console.log(arr1) 
// 输出 [1, 3]
var arr2 = [1,2,3]
arr2.splice(1, 1, 8,9)
console.log(arr2) 
// 输出 [1, 8, 9, 3]

向数组开头和末尾添加元素

注意该方法会改变原始数组的长度

向数组末尾添加元素 push()

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

向数组开头添加元素unshift()

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

删除数组的最后一个元素 pop()

顾名思义pop 弹出，将数组比作一个堆栈，最后入栈的最早出栈，pop就是弹出数组的最后一个元素。
注意该方法会改变原始数组的长度

var arr = [1,2,3]
var popData = arr.pop()
console.log(arr) // [1,2] 
console.log(popData)  // 3

数组的一些基础用法，主要是回顾总结一下，打牢基础才能建立起高楼大厦。

分割线，下面我们来说一说数组的一些案例

数组去重

上代码

let arr = ['1', 1, 1, 2, 3, 3, 4]
let uniqArry = []
arr.forEach((item, index) => {
  (uniqArry.indexOf(item) === -1) && uniqArry.push(item)
})
console.log(uniqArry)
// 输出 [ '1', 1, 2, 3, 4 ]

本次使用的是Array.prototype.indexOf 方法检测是否有重复的数据。当然这只是一种方法，是我自己觉得最好也最简洁的，还有很多其他的解法，可以扩展下思路。

扩展阅读，参考
JS数组去重 https://github.com/hanzichi/underscore-analysis/issues/9

本文会持续更新中