js中数组API的应用

扁平化n维数组

 //  ES10 中  flat方法  
 /*
 此功能某些浏览器尚在开发中
 由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。
*/
 [1,2,[3,4]].flat(2);  // [1,2,3,4]
 [1,2,[3,4,[5,6]]].flat(2); //[1,2,3,4,5,6];
[1,2,[3,4,[5,6,[7,8,....]]].flat(Infinity); //[1,2,3,4,5,6,7,8....];  Infinity展开所有嵌套数组

//js方式实现
function flatten(arr){
	if(!Array.isArray(arr)) return arr;
		while(arr.some(item => Array.isArray(item))){
			//arr = [].concat.apply([],arr);
			arr = [].concat(...arr);
		}
		return arr;
}
console.log(flatten([1,2,[3,4]]));//[1,2,3,4]
console.log(flatten([1,2,[3,4,[5,6]]]));[1,2,3,4,5,6]

//如果数组中都是数字，可以如下实现
 [1,2,[3,4].toString().split(",").map(item => Number(item));  //[1,2,3,4]
  [1,2,[3,4].toString().split(",").map(item => +item);   //[1,2,3,4]
  //这两种方式仅适用于全数字

数组去重

  //通过Set对象  不能重复的特性  实现数组去重
  Array.from(new Set([1,1,2,2,3,3]));  //[1,2,3]
  //Array.from  是将类数组或者可迭代的对象转为数组
 
 //方式二
 [...new Set([1,1,2,2,3,3])] ; // [1,2,3]

数组排序

// sort   js内置排序方法   默认升序
[1,2,4,3,6].sort(); //[1,2,3,4,6]
[1,2,4,3,5].sort((a,b) => b-a); [5,4,3,2,1]

//冒泡排序
Array.prototype.bubbleSort = function(){
	let arr = this,
	len = arr.length;
	for(let outer = len; outer >=2; outer--){
		for(let inner = 0; inner <=outer-1; inner++){
			if(arr[inner] > arr[inner+1]){
				[arr[inner], arr[inner+1]] = [arr[inner+1], arr[inner]];
			}
		}
	}
	return arr;
}

//选择排序
Array.prototype.selectSort = function(){
	var arr = this,
		len = arr.length;
		for(let i =0; i<len; i++){
			for(let j =i; j<len; j++){
				if(arr[i] > arr[j]){
					[arr[i], arr[j]] =[arr[j], arr[i]];
				}
			}
		}
		return arr;
}
console.log([1,2,5,2,1,3].bubbleSort());  //[1,1,2,2,3,5]
console.log([1,2,5,2,1,3].selectSort());   //[1,1,2,2,3,5]

最大值

//通过Math内置对象 
Math.max(...[1,2,3,4]); // 4

Math.max.apply(null,[1,2,3,4]); // 4

//通过reduce 实现
//方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值
/*
	语法： arr.reduce(callback[, initialValue])
	callback
		执行数组中每个值的函数，包含四个参数：
	prev
		累计器累计回调的返回值; 它是上一次调用回调时返回的累积值，或initialValue（见于下方）。
	cur
		数组中正在处理的元素。
	currentIndex可选
		数组中正在处理的当前元素的索引。 如果提供了initialValue，则起始索引号为0，否则为1。
	array可选
		调用reduce()的数组
	initialValue可选
		作为第一次调用 callback函数时的第一个参数的值。 如果没有提供初始值，则将使用数组中的第一个元素。 在没		有初始值的空数组上调用 reduce 将报错。
*/
[1,2,3,4].reduce((prev,cur,curIndex,arr) => {
		return Math.max(prev,cur) ; //每次返回最大值
},0);  //4

数组求和

//通过reduce实现求和
 [1,2,3,4].reduce((prev,cur) =>{
 	return prev + cur;
 }//  1+2+3+4   10

数组合并

[1,2,3,4].concat([5,6]); //[1,2,3,4,5,6]
[...[1,2,3,4],...[5,6]];  //[1,2,3,4,5,6]
[1,2,3,4].push.apply([1,2,3,4],[5,6]);   //[1,2,3,4,5,6]

判断是否包含某个值

[1,2,3].includes(4); //false
[1,2,3].indexOf(4); //-1   如果存在返回值所在索引，不存在返回-1
[1,2,3].find(item => item ===3);  //3  如果存在则返回对应值 ，不存在返回undefined
[1,2,3].findIndex( item => item ===3); //2  如果存在返回值所在索引 ，不存在返回-1

类数组转换

Array.prototype.slice.call(arguments);
Array.prototype.slice.apply(arguments)
Array.from(arguments);
[...arguments];

数组过滤

[1,2,3,4].every(item => {return item>2});  //false  判断是否每一项都大于2

[1,2,3,4].some(item => {return item>2});  //true   判断是否有一项大于2

[1,2,3,4].filter(item =>{ return item>2});  //[3,4]  

对象数组转换

Object.keys({name:'zhangsan',age:14});//['name','age']
Object.values({name:'zhangsan',age:14}); //['zhangsan',14];
Object.entries({name:'zhangsan',age:14}); //[ ['name','age'],['zhangsan',14]]