当前位置: 首页 > 工具软件 > esnext > 使用案例 >

JS+esNext数组方法

祁兴运
2023-12-01

数组方法

数组的常用方法
	方法			作用						      影响原数组
	push	在数组后添加元素,返回数组长度	 		  √ 
    pop		 删除数组的最后一项,返回被删除项		  √
    shift	 删除数组第一项,并返回被删除项		      √
    unshift  数组开头添加元素,返回新数组长度		  √
    reserve	 反转数组,返回修改后的数组				  √
    sort	 排序数组,返回修改后的数组				  √
    splice	 截取数组,返回被截取的区间				  √
    join	 将一个数组所有元素连接成字符串并返回		  × 
    concat	 arr1.concat(arr1, arr2)连接数组		  ×
    join	 arr.join()将数组元素拼接并返回		  ×
    map		 操作数组每一项并返回一个新数组		      ×
    forEach	 遍历数组,没有返回值					  ×
    filter	 对数组所有项进行判断  返回符合要求的新数组  ×
    every 	 数组每一项都符合才返回true			      ×
    some	 数组有一项符合规则返回true			      ×
    reduce	 接受上一个return和数组的下一项			  ×
    flat	 数组扁平化							  ×
    slice	 截取数组,返回截取区间				      ×



### Array.from() 以及 Array.of()

​	使用 Array.from(str)即可转化为数组类型

​	相关于Array.from()以及Array.of();

​	from用于将**类数组结构**转化为数组实例,而of用于将**一组参数**转化为数组实例

​	reverse()是仅用于数组机构,所以字符串如果想要使用该方法,必须先转化为数组类型,此时就需要使用Array.from() 或者 Array.of()


	
​	const arr = [1,2,3,4,5]
	arr.fill(7, 1, 3)// 从[1-3)将数据填充为7	log(arr) [1, 7, 7, 4, 5]

​1. forEach((item, index, arr))

​	// 略

​2. map()

​		const mapArr = arr.map((num, index, arr)=> 2 * num)	// 2, 4, 6, 8, 10

 3. filter()

    const filterArr = arr.filter((num, index, arr) => num > 3)	// 4, 5

 4. some()  // some只要有一个为真就返回真

​	  const someArr = arr.some((bol, index, arr) => bol)

5. every()	//与some相反,必须全部为真才返回真

   const everyArr = arr.every((bol, index, arr) => bol)

6. reduce()   // 计算1+2+3+4+5     2个参数,第一个pre为callback函数,pre为上次return的值;next为数组本次遍历的项;第二个参数为初始值也就是第一个pre

   箭头函数当中是4个参数,后面两个是index(索引),arr(当前数组)

   const reduceArr = arr.reduce((pre, next) => { return  pre + next },0)

   ​				// 统计元素出现个数

   const nameArr = ['yzx', 'xzy', 'yzx', 'yzx', 'shy']

   const reduceArr1 = nameArr.reduce((pre, next)=> { 

   ​	if(pre[next]){

   ​		pre[next]++

   ​	}else{

   ​		pre[next] = 1

   ​	}

   ​	return 

    }, { })

7. flat() 将多维数组转化成一维数组   参数为降为的次数  由外到内 无参数则降维1层

    const arr = [1,2,3,[4,5,6]]

    console.log(arr.flat())   // [1,2,3,4,5,6]

    const arr = [1, 2, 3, [4, 5, 6, [7, 8, 9]]]

    console.lo(arr.flat(2))   // [1,2,3,4,5,6]

    填入Infinite 则是无论多少层,都会变为一维数组

8. Array.flatMap

   let arr = ["科比 詹姆斯 安东尼", "利拉德 罗斯 麦科勒姆"]

   将上面的数组转化为:

   [ '科比', '詹姆斯', '安东尼', '利拉德', '罗斯', '麦科勒姆' ]

   console.log(arr.map(x => x.split(' ')))  

   console.log(arr.map(x => x.split(" ")).flat());
	// [ '科比', '詹姆斯', '安东尼', '利拉德', '罗斯', '麦科勒姆' ]
	// flatMap()方法一个顶两个
	
	console.log(arr.flatMap(x => x.split(" ")));
	// [ '科比', '詹姆斯', '安东尼', '利拉德', '罗斯', '麦科勒姆' ]
	
	// BigInt是ES10新增的一种数据类型,用来表示2**53 - 1的整数,2 ** 53 - 1 是ES10之前,JS能表示的最大整数

	const bigNum = BigInt(1728371927189372189739217)
	console.log(typeof bigNum) // bigint



9. Object.fromEntries()
   与Object.entries相反 
   entries是把   键值对  转为数组,而fromEntries则是将数据转为键值对
   const arr = [ 
     ['name', 'yzx'],
     ['age', 18],
     ['gender', '男']
   ]
	console.log(Object.fromEntries(arr))	// {name: 'yzx', age: 18, gender: '男'}
	
	既然是键值对,那么是不是map也能够转为对象呢?
	const map = new Map()
	map.set('name','yzx')
	map.set('age',20)
	map.set('sex','male')
	log(map) ===> Map(3) {'name' => 'yzx', 'age' => 20, 'sex' => 'male' }
	const obj = Object.fromEntries(map)
	log(obj) ===> {name: 'yzx', age: 20, sex: 'male'}
 类似资料: