数组常见方法

数组常见的方法：操作方法、排序方法、转换方法、迭代方法（遍历）

一、 操作方法

数组的基本操作方法可以分为增、删、查三种

1. 增

• unshift()
  unshift 向数组的头部添加一个或多个元素，并返回数组长度 - 会修改原始数组

  	let catInfo = ['花姐'];
  	let count = catInfo.unshift("橘宝");
  	console.log(catInfo); // ['橘宝', '花姐']
  	console.log(count); // 2
  

• push()
  push 向数组的尾部添加一个或多个元素，返回值是数组的长度 - 会修改原始数组

  	let catInfo = ['花姐'];
  	let count = catInfo.push ("橘宝");
  	console.log(catInfo); // ['花姐', '橘宝']
  	console.log(count); // 2
  

• splice()
  splice(‘起始位置的下标’, ‘要删除的元素数量’, 插入的元素’…)切割数组，返回值是获取的新数组 - 会修改原始数组
  有三种情况：

  	
  	// 当起始位置不为空 与 要删除的元素数量为0，并且传入要插入的元素，返回的是空数组，原数组则为剩余的值 + 插入的元素
  	let catInfo = ["花姐", "橘宝", "喵喵"];
  	let newInfo = catInfo.splice(1, 0, '豆豆', '喵猪');
  	console.log(catInfo); // ['花姐', "橘宝", '豆豆', '喵猪', '喵喵']
  	console.log(newInfo); // []
  	
  	// 当只起始位置为0，并且省略后面全部参数，则返回的是新数组是原始数组全部的值，并且原始数组为空数组 -- 相当于清空原始数组
  	let catInfo = ["花姐", "橘宝", "喵喵"];
  	let newInfo = catInfo.splice(0);
  	console.log(catInfo); // []
  	console.log(newInfo); // ["花姐", "橘宝", "喵喵"]
  	
  	// 当起始位置 与 要删除的元素数量 不为空且不为0，则截取下标连续值为新数组的值，原始数组则为剩余的值 -- 相当于指定删除
  	let catInfo = ["花姐", "橘宝", "喵喵"];
  	let newInfo = catInfo.splice(1, 1);
  	console.log(catInfo); // ['花姐', '喵喵']
  	console.log(newInfo); // ['橘宝']
  

• concat()
  会先创建一个当前数组的副本，然后再把它的参数添加到副本末尾，最后返回这个新构建的数组 - 不会影响原始数组

  	let catInfo = ["花姐", "橘宝"];
  	let newInfo = catInfo.concat('喵喵', '喵猪');
  	console.log(catInfo); // ['花姐', '橘宝']
  	console.log(newInfo); // ['花姐', '橘宝', '喵喵', '喵猪']
  

2. 删

• shift()
  shift()方法用于删除数组的第一项，返回被删除的项 - 会修改原始数组

  	let catInfo = ["花姐", "橘宝"];
  	let newInfo = catInfo.shift();
  	console.log(catInfo); // ['橘宝']
  	console.log(newInfo); // 花姐 
  

• pop()
  pop() 方法用于删除数组的最后一项，返回被删除的项 - 会修改原始数组

  	let catInfo = ["花姐", "橘宝"];
  	let newInfo = catInfo.shift();
  	console.log(catInfo); // ['花姐']
  	console.log(newInfo); // 橘宝 
  

• splice()
  传入两个参数，分别是开始位置，删除元素的数量，返回包含删除元素的数组 - 会修改原始数组

  	let catInfo = ["花姐", "橘宝"];
  	let newInfo = catInfo.splice(0,1); // 删除第一项
  	console.log(catInfo); // ['橘宝']
  	console.log(newInfo); // ['花姐']
  

• slice()
  slice(‘起始位置的下标’,‘终止位置的元素下标（不包含）’) 用于创建一个包含原有数组中一个或多个元素的新数组 - 不会影响原始数组

  	let catInfo = ['花姐', '橘宝', '豆豆', '喵猪', '喵喵'];
  	let newInfo1 = catInfo.slice(1);
  	let newInfo2 = catInfo.slice(1, 4);
  	console.log(catInfo); // ['花姐', '橘宝', '豆豆', '喵猪', '喵喵']
  	console.log(newInfo1); // ['橘宝', '豆豆', '喵猪', '喵喵']
  	console.log(newInfo2); // ['橘宝', '豆豆', '喵猪']
  

3. 查

• includes()
  返回要查找的元素在数组中的位置，找到返回true，否则false

  	let catInfo = ['花姐', '橘宝'];
  	console.log(catInfo.includes('橘宝')); // true
  

• indexOf()
  返回要查找的元素在数组中的位置，如果没找到则返回 -1

  	let catInfo = ['花姐', '橘宝'];
  	console.log(catInfo.indexOf('橘宝')); // 1
  

• find()
  返回第一个匹配的元素

  	let catInfo = ['花姐', '橘宝'];
  	let result = catInfo.find((element, index) => element == '橘宝')
  	console.log(result); // 橘宝
  

• findIndex()
  该方法会返回符合条件的元素的索引位置，之后不会再调用执行函数，如果没有符合条件的元素返回 -1、原数组不变

  	let catInfo = ['花姐', '橘宝'];
  	let result = catInfo.findIndex((element, index) => element == '橘宝')
  	console.log(result); // 1
  

二、 排序方法

• reverse()
  将数组元素方向反转

  	let catInfo = ['花姐', '橘宝'];
  	catInfo.reverse();
  	console.log(catInfo); // ['橘宝', '花姐']
  

• sort()
  sort()方法接受一个比较函数，用于判断哪个值应该排在前面

  	function compare(value1, value2) {
  	    return value1 - value2;
  	}
  	let values = [0, 1, 5, 10, 15];
  	values.sort(compare); // 0,1,5,10,15
  	
  	function compare(value1, value2) {
  	    return value2 - value1;
  	}
  	let values = [0, 1, 5, 10, 15];
  	values.sort(compare); //  [15, 10, 5, 1, 0]
  

三、 转换方法

• sort()
  join() 方法接收一个参数，即字符串分隔符，返回包含所有项的字符串

  	let catInfo = ['花姐', '橘宝'];
  	console.log(catInfo.join(",")); // 花姐,橘宝
  	console.log(catInfo.join("||")); // 花姐||橘宝
  

四、 迭代方法（遍历）

迭代方法都不改变原数组

• reduce()
  reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值

  	let values = [0, 1, 5, 10, 15];
  	let init = 0;
  	// prev 必需。累计器累计回调的返回值; 表示上一次调用回调时的返回值，或者初始值 init;
  	// cur 必需。表示当前正在处理的数组元素；
  	// index 可选。表示当前正在处理的数组元素的索引，若提供 init 值，则起始索引为0，否则起始索引为1；
  	// arr 可选。表示原数组
  	// init 可选。表示初始值。
  	let result = values.reduce((prev,cur,index,arr) => {return prev + cur}, init )
  	console.log(result); // 31
  

• map()
  对数组每一项都运行传入的函数，返回由每次函数调用的结果构成的数组

  	let catInfo = ['花姐', '橘宝'];
  	let mapResult = catInfo.map((item, index, array) => item + index);
  	console.log(mapResult); // ['花姐0', '橘宝1']
  

• filter()
  对数组每一项都运行传入的函数，函数返回 true 的项会组成数组之后返回

  	let catInfo = ['花姐', '橘宝'];
  	let filterResult = catInfo.filter((item, index, array) => index == 1);
  	console.log(filterResult); // ['橘宝']
  

• forEach()
  对数组每一项都运行传入的函数，没有返回值

  	let catInfo = ['花姐', '橘宝'];
  	let forEachResult = catInfo.forEach((item, index, array) => {
  	    console.log(item);  // 花姐  橘宝  
  	})
  

• every()
  对数组每一项都运行传入的测试函数，如果所有元素都返回 true ，则这个方法返回 true

  	let catInfo = ['花姐', '橘宝'];
  	let everyResult = catInfo.every((item, index, array) => item == '花姐')
  	console.log(everyResult); // false
  

• some()
  对数组每一项都运行传入的测试函数，如果至少有1个元素返回 true ，则这个方法返回 true

  	let catInfo = ['花姐', '橘宝'];
  	let someResult = catInfo.some((item, index, array) => item == '花姐')
  	console.log(someResult); // true