JSArray排序详解

一、JS数组排序方法

在JS中，数组排序是一个常见且重要的操作。JS提供了多种排序方法，以帮助我们完成各种排序需求。

1、sort()


let arr = [3,1,5,2,4];
arr.sort();
console.log(arr); // [1, 2, 3, 4, 5]

sort()方法会按照数组元素的字符串值进行升序排序，适用于对数字和字母进行排序。

2、reverse()


let arr = [3,1,5,2,4];
console.log(arr.reverse()); // [4, 2, 5, 1, 3]

reverse()方法会将数组元素进行反转。

3、concat()


let arr1 = [1,2,3];
let arr2 = [4,5,6];
console.log(arr1.concat(arr2)); // [1, 2, 3, 4, 5, 6]

concat()方法返回一个新数组，包含原数组和传入数组的所有元素。

4、slice()


let arr = [1,2,3,4,5];
console.log(arr.slice(1,3)); // [2, 3]

slice()方法返回一个新数组，包含原数组指定范围内的元素。

5、splice()


let arr = [1,2,3,4,5];
arr.splice(2,1);
console.log(arr); // [1, 2, 4, 5]

splice()方法从指定位置删除指定数量的元素，并可以插入新的元素。

二、JSArray常用方法

JSArray提供了许多常用的方法，可用于对数组进行修改、筛选、转换等操作。

1、push()


let arr = [1,2];
arr.push(3);
console.log(arr); // [1, 2, 3]

push()方法可以在数组末尾添加一个或多个元素，并返回数组的新长度。

2、pop()


let arr = [1,2,3];
arr.pop();
console.log(arr); // [1, 2]

pop()方法删除数组的最后一个元素，并返回该元素。

3、filter()


let arr = [1,2,3,4,5];
let newArr = arr.filter(function(item) {
  return item % 2 === 0;
});
console.log(newArr); // [2, 4]

filter()方法创建一个新数组，其包含所有通过函数测试的元素。

4、map()


let arr = [1,2,3,4,5];
let newArr = arr.map(function(item) {
  return item * 2;
});
console.log(newArr); // [2, 4, 6, 8, 10]

map()方法创建一个新数组，其包含源数组中的每个元素经过函数处理后的结果。

5、reduce()


let arr = [1,2,3,4,5];
let result = arr.reduce(function(sum, item) {
  return sum + item;
}, 0);
console.log(result); // 15

reduce()方法对数组中的每个元素执行指定的函数，并返回一个单一的值。

三、ArrayList排序方法

除了自带的JSArray排序方法，许多JS框架如React、Vue等也提供了ArrayList用于数据管理。ArrayList提供了多种排序方法可用于排序操作。

1、sort()


let list = [3,1,5,2,4];
list.sort();
console.log(list); // [1, 2, 3, 4, 5]

与JSArray相同，sort()方法会按照ArrayList元素的字符串值进行升序排序，适用于对数字和字母进行排序。

2、reverse()


let list = [3,1,5,2,4];
console.log(list.reverse()); // [4, 2, 5, 1, 3]

reverse()方法会将ArrayList元素进行反转。

3、sort(function)


let list = [
  {name: 'A', age: 20},
  {name: 'B', age: 18},
  {name: 'C', age: 22}
];
list.sort(function(a,b) {
  return a.age - b.age;
});
console.log(list);
// [{name: 'B', age: 18}, {name: 'A', age: 20}, {name: 'C', age: 22}]

sort(function)方法可用于自定义规则进行柔性排序，第二个参数为一个函数，可自定义排序规则。

4、Collections.sort(list)


let list = [3,1,5,2,4];
let Collections = require('java.util');
Collections.sort(list);
console.log(list); // [1, 2, 3, 4, 5]

Collections.sort(list)方法与JSArray的sort()方法相似，可对ArrayList进行排序。

四、示例代码

JSArray排序


let arr = [3,1,5,2,4];
arr.sort();
console.log(arr); // [1, 2, 3, 4, 5]

ArrayList排序


let list = [
  {name: 'A', age: 20},
  {name: 'B', age: 18},
  {name: 'C', age: 22}
];
list.sort(function(a,b) {
  return a.age - b.age;
});
console.log(list);
// [{name: 'B', age: 18}, {name: 'A', age: 20}, {name: 'C', age: 22}]

五、总结

数组排序是JS编程中的常见操作，JSArray提供了多种排序方法可供选择。除JSArray之外，框架如React、Vue等也提供了ArrayList用于数据管理，拓宽了我们的选择。对于需要自定义规则进行排序的情况，我们可以使用sort(function)方法，为自己喜好打造排序方式。

原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/151316.html