JS数组常用 API总结
第一部分改变原数组的方法:(push、pop、shift、unshift、splice、reverse,sort,fill,map(每一项是引用类型的时候))
1、push() 方法用于数组末尾添加一个或多个元素,且返回值是 数组的长度
```
const nums = ['1', '2'];
const res = nums.push('3', '4');
console.log(nums); // [ '1', '2', '3', '4' ]
console.log(res); // 4
2、pop() 方法删除数组最后一个元素,且 返回值 是 删去的元素
const arr = ['aa', 'bb', 'cc'];
const res = arr.pop();
console.log('res:', res); // cc
console.log('arr: ', arr) // ['aa', 'bb']
3、shift() 删去数组 第一个元素, 返回值是 删去的元素
const fruits = ['苹果', '香蕉', '橘子'];
const firstFruit = fruits.shift();
console.log(fruits); // [ '香蕉', '橘子' ]
console.log(firstFruit); // 苹果
4、unshift() 方法用于向数组的开头添加
一个或多个元素,并返回修改后的数组的新长度。
const fruits = ['苹果', '香蕉'];
const newLength = fruits.unshift('橘子', '西瓜');
console.log(fruits); // [ '橘子', '西瓜', '苹果', '香蕉' ]
console.log(newLength); //4
5、splice() 方法用于从数组中删除、替换或添加元素,并返回被删除的元素组成的数组,它会直接修改原数组。
//实现删除
let arr = [1,2,3,4,5]
console.log(arr.splice(0,2)); //[ 1, 2 ] 返回被删除的元素
console.log(arr); //[ 3, 4, 5 ] 该方法会改变原数组
//实现添加
let arr2 = [1,2,3,4,5]
console.log(arr2.splice(1,0,666,777)); //[] 返回空数组,没有删除元素
console.log(arr2); //[ 1, 666, 777, 2, 3, 4, 5 ] 原数组改变了
// 实现替换
let arr3 = [1,2,3,4,5]
console.log(arr3.splice(2,1,"aaa","bbb")); //[ 3 ] 返回被删除的一个元素
console.log(arr3); //[ 1, 2, 'aaa', 'bbb', 4, 5 ] 可以添加字符串
let arr4 = [1,2,3,4,5]
console.log(arr4.splice(1,4,666)); //[ 2, 3, 4, 5 ] 返回被删除的四个元素
console.log(arr4); //[ 1, 666 ]
6、reverse() 颠倒数组顺序
const arr = ['a', 'b', 'c', 'd'];
let a = arr.reverse();
console.log(a) // ["d", "c", "b", "a"]
console.log(arr) // ["d", "c", "b", "a"]
7、sort() 对数组排序 sort() 方法用于对数组进行原地排序,会直接修改原始数组,而不会创建新的数组。默认情况下,它将数组元素视为字符串,并按照 Unicode 码点进行排序。但是,可以传入自定义的比较函数来实现基于其他规则的排序。
比较函数
:比较函数接收两个参数,通常被称为 a 和 b,表示进行比较的两个元素。它应该返回一个负数、零或正数,表示 a 应该在 b 之前、与 b 相同位置还是在 b 之后。比较函数的返回值规则如下:
- 如果返回值小于 0,则 a 排在 b 前面。
- 如果返回值等于 0,则 a 和 b 的相对位置不变。
- 如果返回值大于 0,则 a 排在 b 后面。
let arr = ['c', 'a', 'd', 'b']
let a = arr.sort()
console.log(a) // ['a', 'b', 'c', 'd']
console.log(arr) // ['a', 'b', 'c', 'd']
const arr = [3, 1, 5, 2, 4];
arr.sort();
console.log(arr); // [1, 2, 3, 4, 5]
// 默认排序(按照 Unicode 码点排序)
const arr = ['f', 'k', 'c', 'a', 'b'];
arr.sort();
console.log(arr); //[ 'a', 'b', 'c', 'f', 'k' ]
// 使用比较函数进行自定义排序
const arr = [10, 2, 66, 26, 13, 1];
arr.sort((a, b) => a - b);
console.log(arr); //[ 1, 2, 10, 13, 26, 66 ]
const arr = [10, 2, 66, 26, 13, 1];
arr.sort((a, b) => b - a);
console.log(arr); // [ 66, 26, 13, 10, 2, 1 ]
8、fill 用一个元素填充原来的数组
let a = arr.fill('e', 2, 4);
console.log(a) // 返回它会改变调用它的 `this` 对象本身, 然后返回它['a', 'b', 'e', 'e']
console.log(arr) // ['a', 'b', 'e', 'e']
9、map: 只有当arr的每一项基本数据类型时,map方法才不会改变原始数组,arr每一项是引用类型时,还是会改变原数组的
const citys = [{ name: 'shanghai' }, { name: 'nanjing' }];
const newCitys = citys.map((item) => {
item.country = 'china';
return item;
});
console.log('citys', citys); //[{ name: 'shanghai', country: 'china' },{ name: 'nanjing', country: 'china' }]
console.log('newCitys', newCitys); //[{ name: 'shanghai', country: 'china' },{ name: 'nanjing', country: 'china' }]