js数组常见的一些方法

自我学习记录（一直会更新🌺）

常见的方法14种方法：push、pop、unshift、shift、concat、join、slice、splice、reverse、sort、toString、toLocaleString、valueOf、toSource

其他好用的方法： foreach（）、map（）、filter（）、reduce（）、reduceRight（）、every（）、some（）、indexOf（）、lastIndexOf()、find（）、findIndex（）、includes（）

1.forEach():循环遍历数组，参数（当前处理元素、数组索引、数组本身），无返回值

array.forEach((item, index, array) {
	// do something
}, thisArg)

arr.forEach(item => console.log(item))

2.map():映射 ,其结果是该数组中的每个元素都调用一个提供的函数后返回的结果，有返回值

let array = arr.map(function callback(currentValue, index, array) {
	// do something
}, thisArg)

3.filter() 过滤出满足过滤条件的数组，有返回值

var array = arr.filter(function callback(currentValue, index, array) {
	// do something
}, thisArg)

4.reduce() 和 5.reduceRight():

这两个方法都会实现迭代数组的所有项，然后构建一个最终返回的值。reduce()方法从数组的第一项开始，逐个遍历到最后。而 reduceRight()则从数组的最后一项开始，向前遍历到第一项。

参数（前一个值，当前值， 索引项， 数组对象） 回调函数第一次执行时，accumulator 和 currentValue 的取值有两种情况：调用 reduce 时提供initialValue，accumulator 取值为 initialValue ，currentValue 取数组中的第一个值；没有提供 initialValue ，accumulator 取数组中的第一个值，currentValue 取数组中的第二个值。

array.reduce(function(accumulator,currentValue,currentIndex,array),initialValue)

🌺小试牛刀🌺

1.url中的查询参数解析成字典对象

var newurl = 'http://dev.cekid.com:9018/r/products?store_code=8002&citycode=320100&cityname=%E5%90%88%E8%82%A5%E5%B8%82&cityid=340100&entityid=8029&entityname=%E5%90%88%E8%82%A5%E7%BE%8E%E6%B8%B8'
function parseUrl(url) {
	var arr = url.slice(url.indexOf('?')+1).split('&')
	var newArr = arr.reduce((prev, next) => {
		prev[next.split('=')[0]] = next.split('=')[1]
		return prev
	}, {})
	return newArr
}
parseUrl(newurl)

2.二维数组降级

function concatArr(arr) {
	var newArr = arr.reduce((prev, next) => {
		return prev.concat(next)
	}, [])
	return newArr
}
concatArr([[1, 2], [2, 3, 4, 1], [2, 2]])
// [1, 2, 2, 3, 4, 1, 2, 2]

3.数组求和

function total(arr) {
	let sum = arr.reduce((prev, next) => {
		prev = prev + next
		return prev
	}, 0)
	return sum
}
total([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]) // 55

6.every():判断数组中的每一项是否都满足条件，只有所有项都满足条件的返回true

function isNumber (arr) {
	let _arr = arr.every((item) => {
		return typeof(item) === 'number'
	})
	return _arr
}
isNumber([1, 2, 3, 4]) // true
isNumber([1, 2, 'sa', 4]) // false

7.some():判断数组中是否存在满足条件的项，只要有一项满足就会返回true

function isNumber (arr) {
	let _arr = arr.some((item) => {
		return typeof(item) === 'number'
	})
	return _arr
}
isNumber(['ww', 'mm', 'sa', 4]) // true
isNumber(['ww', 'mm', 'sa', 'true']) // false

8.indexOf() 和 9.lastIndexOf()

两个方法都是返回要查找的项在数组中出现的第一个索引位置，不同的是indexof()是从数组开头查找，lastIndexOf()是从数组的末尾查找，如果不存在，则返回-1 参数（要查找的项，【可以选的项】查找起点位置index）

arr.indexOf(searchElement)
arr.indexOf(searchElement[, fromIndex = 0])
arr.lastIndexOf(searchElement[, fromIndex = arr.length - 1])

// switch 控制是从数组开始位置查，还是数组末尾查
function _indexOf(arr, item, index, _switch) {
	return _switch ? arr.indexOf(item, index) : arr.lastIndexOf(item, index)
}

_indexOf([1, 2, 'mm', 3, 2, 'mm', 1], 'mm', 0, true) // 2
_indexOf([1, 2, 'mm', 3, 2, 'mm', 1], 'mm', 6, false) // 5
_indexOf([1, 2, 'mm', 3, 2, 'mm', 1], 'mm', 4, false) // 2
_indexOf([1, 2, 'mm', 3, 2, 'mm', 1], 'mm', 1, false) // -1

10.find():方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

11.findIndex():方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

function findV(arr, _switch) {
	let newValue = null
	if (_switch) {
		newValue = arr.find(item => {
			return item > 20
		})
	} else {
		newValue = arr.findIndex(item => {
			return item > 20 
		})
	}
	return newValue
} 
findV([1, 3, 20, 11, 22], true) // 22
findV([1, 3, 20, 11, 22], false) // 4

12.includes()方法用来判断一个数组是否包含一个指定的值，如果是，返回 true或 false。

13.instanceof 和 Array.isArray(): 检测数组

var arr = [1, 2, 3, 4, 5, 6]
var arr2 = {}
arr instanceof Array // true
Array.isArray(arr) // true
Array.isArray(arr2) // false