Javscript数组中最常用的方法（建议收藏）(1)

js中数组的方法不管是写原生还是用框架，我们都会经常运用到，以及也有一些面试官会问到甚至让我们手写一个数组的排序函数；

所以我就通过查找一些好的文章做了一篇对数组方法的归纳包括：数组的基本操作方法、排序方法、转换方法以及es6中的迭代方法；

操作方法

===================================================================

数组的一些操作方法，也无非就是增、删、改、查：

增

push()

push()方法接收任意数量的参数，并将它们添加到数组末尾，返回数组的最新长度，对原数组有影响；

let people = []; // 创建一个数组

let count = people.push(“张三”, “李四”); // 推入两项

console.log(count) // 2

unshift()

unshift()在数组开头添加任意多个值，然后返回新的数组长度，对原数组有影响；

let people = new Array(); // 创建一个数组

let count = colors.unshift(“张三”, “李四”); // 从数组开头推入两项

alert(count); // 2

splice()

传入三个参数，分别是开始位置、0（要删除的元素数量）、插入的元素，返回空数组，对原数组有影响；

let people = [“张三”, “李四”, “王二”];

let removed = colors.splice(1, 0, “麻子”)

console.log(colors) // 张三,麻子,李四,王二

console.log(removed) // []

concat()

首先会创建一个当前数组的副本，然后再把它的参数添加到副本末尾，最后返回这个新构建的数组，不会影响原始数组；

let people = [“张三”, “李四”, “王二”];

let people2 = people .concat(“麻子”, [“王朝”, “马汉”]);

console.log(people ); //[“张三”, “李四”, “王二”];

console.log(people2); // [“张三”, “李四”, “王二”, “麻子”, “王朝”, “马汉”]

删

pop()

pop() 方法用于删除数组的最后一项，同时减少数组的length 值，返回被删除的项，对原数组有影响；

let people = [“张三”, “李四”];

let item = people.pop(); // 取得最后一项

console.log(item) // 李四

console.log(people.length) // 1

shift()

shift()方法用于删除数组的第一项，同时减少数组的length 值，返回被删除的项，对原数组有影响；

let people = [“张三”, “李四”];

let item = people.shift(); // 取得第一项

console.log(item) // 张三

console.log(people.length) // 1

splice()

传入两个参数，分别是开始位置，删除元素的数量，返回包含删除元素的数组，对原数组有影响；

let people = [“张三”, “李四”, “王二”];

let removed = people.splice(0,1); // 删除第一项

console.log(people ); // [“李四”, “王二”]

console.log(removed); // [“张三”]，只有一个元素的数组

slice()

slice() 方法以新的数组对象，返回数组中被选中的元素，选择从给定的 start 参数开始的元素，并在给定的 end 参数处结束，但不包括。不会影响原始数组；

let people = [“张三”, “李四”, “王二”, “麻子”, “王朝”];

let people2 = people.slice(1);

let people3 = people.slice(1, 4);

console.log(people) // [“张三”, “李四”, “王二”, “麻子”, “王朝”]

concole.log(people2); // [“李四”, “王二”, “麻子”, “王朝”]

concole.log(people3); // [“李四”, “王二”, “麻子”]

改

修改原来数组的内容，常用splice()

splice()

splice()传入三个参数，分别是开始位置，要删除元素的数量，要插入的任意多个元素，返回删除元素的数组，对原数组产生影响

let people = [“张三”, “李四”, “王二”];

let removed = people.splice(1, 1, “麻子”, “王朝”); // 插入两个值，删除一个元素

console.log(people ); // [“张三”, “麻子”, “王朝”, “王二”];

console.log(removed); //[“李四”]，只有一个元素的数组

查

即查找元素，返回元素坐标或者元素值

• indexOf()

• includes()

• find()

indexOf()

返回要查找的元素在数组中的位置，如果没找到则返回-1

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];

numbers.indexOf(4) // 3

includes()

返回要查找的元素在数组中的位置，找到返回true，否则false

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];

numbers.includes(4) // true

find()

返回第一个匹配的元素

const people = [

{

name: “Matt”,

age: 27

},

{

name: “Nicholas”,

age: 29

}

];

people.find((element, index, array) => element.age < 28) // // {name: “Matt”, age: 27}

---

排序方法

===================================================================

数组本身有两个方法可以用来对元素重新排序：

• reverse()

• sort()

定义排序函数：

• 冒泡排序

• 插入排序

• 递并排序

• 计数排序

reverse()

顾名思义，将数组元素方向排列

let values = [1, 2, 3, 4, 5];

values.reverse();

alert(values); // 5,4,3,2,1

sort()

sort()方法接受一个比较函数，用于判断哪个值应该排在前面

如果调用该方法时没有使用参数，将按字母顺序对数组中的元素进行排序，说得更精确点，是按照字符编码的顺序进行排序。要实现这一点，首先应把数组的元素都转换成字符串（如有必要），以便进行比较。

如果想按照其他标准进行排序，就需要提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：

1.若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。

2.若 a 等于 b，则返回 0。

3.若 a 大于 b，则返回一个大于 0 的值。

function compare(value1, value2) {

if (value1 < value2) {

return -1;

} else if (value1 > value2) {

return 1;

} else {

return 0;

}

}

let values = [0, 1, 10, 5, 15];

values.sort(compare);

alert(values); // 0,1,5,10,15

冒泡排序

排序规则：比较相邻元素，符合比较条件，交换位置较大的往后排，反复比较交换，直到所有数据都符合排序条件，得出排序效果，结束排序。

排序动态示意：

var arr = [3,4,1,2,21,5,15,6,63];

function BubbleSort(ary){

for(var i = 0; i < ary.length - 1; i++){

for(var j = i + 1; j < ary.length; j++){

var current = ary[i];

if(current > ary[j]){

var tmp = ary[j];

ary[j] = current;

ary[i] = tmp;

}

}

}

return ary;

}

1

BubbleSort(arr); // [1, 2, 3, 4, 5, 6, 15, 21, 63]

插入排序

排序规则：插入排序得比喻成斗地主，手里摸牌之后都是按照从小到大的顺序。每摸到一张牌就把他们插入到合适的位置，使得他们比后面小，比前面大或者相等。

排序动态示意：

var arr = [3,4,1,2,21,5,15,6,63];

function InsertSort(ary){

var temp;

for (var i = 1; i < ary.length; i++) {

for (var j = i-1; j >=0; j–) {

if (ary[j+1] < ary[j]) {

temp = ary[j+1];

ary[j+1] = ary[j];

ary[j] = temp;

} else if (ary[j+1] >= ary[j]) {

break;

}

}

}

return ary;

}

InsertSort(arr); // [1, 2, 3, 4, 5, 6, 15, 21, 63]

递并排序

排序规则：将长的数组分解为短的数组，一直分到最后，单个单个数组比较，我们就认为，只有一个元素的数组是有序的。然后再逐个的合并。

排序动态示意：

var arr = [3,4,1,2,21,5,15,6,63];

function MergeSort(ary) { //采用自上而下的递归方法

var len = ary.length;

if(len < 2) {

return ary;

}

var middle = Math.floor(len / 2),

left = ary.slice(0, middle),

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！
厂，18年进入阿里一直到现在。**

深知大多数初中级Android工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年Web前端开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

[外链图片转存中…(img-lMBI5j6t-1715534161854)]

[外链图片转存中…(img-EPaWANOJ-1715534161854)]

[外链图片转存中…(img-7qiK5pF2-1715534161855)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上Android开发知识点！不论你是刚入门Android开发的新手，还是希望在技术上不断提升的资深开发者，这些资料都将为你打开新的学习之门！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且会持续更新！