前端值得一探究竟特辑 --- 数组的常见API

来自ES5的Array API

1. str.split()

拆分字符串变成数组(对字符串操作)

"we are here".split(" ");  //  ["we", "are", "here"]

2. arr.join()

操作数组变成字符串(对数组操作),不修改原数组

["we", "are", "here"].join("-"); //  "we-are-here"

3. arr.concat()

连接两数组,返回新数组,不改变原来两个数组,可用于浅拷贝

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

4. arr.splice(begin,deleteCount,insert)

删除/拼接。在原数组是删除[begin, begin+deleteCount-1),并返回被删除元素组成的新数组,在原数组begin的位置插入后续参数。

	let a = [1, 2, 3, 4];
	let b = a.splice(1,2,"a", "b");
	a // [1, "a", "b", 4]
	b // [2, 3]

5. arr.slice(begin,end)

截取[begin,end),不修改原数组,返回新数组。

	[0, 1, 2, 3, 4].slice(1,3); // [1, 2]

6. arr.sort([compareFunc])

排序,根据字符串UniCode码(UTF-16 code)。稳定排序修改原数组
可以接收一个compare函数作为参数。

let a = [12, 1, 23, 2];
a.sort() // [1, 12, 2, 23]
a.sort((a, b) => a - b) // [1, 2, 12, 23]

compare函数接收两个参数a和b。
初始时刻:a为第二个待排序元素,b为第一个待排序元素,返回正数则降序,负数为升序。这点与MDN上的说法有出入Array.prototype.sort()

compareFunction
Specifies a function that defines the sort order. If omitted, the array elements are converted to strings, then sorted according to each character’s Unicode code point value.
firstEl
The first element for comparison. ???
secondEl
The second element for comparison. ???

实验可知:

const k = [4, 3, 2, 1]
k.sort((a, b) => {
	let r = a - b;
	console.log('a:', a, 'b:', b, 'r:', r);
	return r;
})
// a: 3 b: 4 r: -1
// a: 2 b: 3 r: -1
// a: 1 b: 2 r: -1
// [1, 2, 3, 4]

当数组长度小于等于10的时候,采用插入排序,大于10的时候,采用快排

const k = [14, 3, 22, 1]
k.sort((a, b) => {
	let r = a - b;
	console.log('a:', a, 'b:', b, 'r:', r);
	return r;
})
// a: 3 b: 14 r: -11
// a: 22 b: 3 r: 19
// a: 22 b: 14 r: 8
// a: 1 b: 14 r: -13
// a: 1 b: 3 r: -2
// [1, 3, 14, 22]

7. arr.reverse

逆转数组,修改原数组

8. arr.pop

从数组尾部添加元素,修改原数组

9. arr.push

从数组尾部添加元素,修改原数组

10. arr.unshift

从数组头部添加元素,修改原数组

11. arr.shift

从数组头部弹出元素,修改原数组

来自ES6的Array API

12. arr.map

映射,一对一,缺少return,默认返回undefined,不改变原数组,但如果数组元素是对象,可以操作元素属性

13. arr.reduce

汇总,A.reduce((tempResult, item, index) => {...}), tempResult是上一轮循环返回的结果,tempResult可以接收初始值,没有传递初始值时,默认为A[0],index为item的下标1,item为A[1]。不改变原数组,但如果数组元素是对象,可以操作元素属性,返回最后一轮的return结果。

	let a = [1,2,3,4];
	a.reduce((tempR, item, index) => {
		console.log("tempR", tempR, "item", item, "index", index);
		return item;
	})
	// tempR 1 item 2 index 1
	// tempR 2 item 3 index 2
	// tempR 3 item 4 index 3

14. arr.filter

筛选,返回符合条件(return值为真)的所有元素。不改变原数组,但如果数组元素是对象,可以操作元素属性。返回满足条件的元素组成的新数组,如果没有符合条件的元素则返回空数组。

15. arr.forEach

调用数组的每个元素,并将元素传递给回调函数,返回undefined,不改变原数组,但如果数组元素是对象,可以操作元素属性

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值