数组

61 阅读5分钟

创建数组

字面量

image.png

内置构造函数

image.png

数组操作

length

length 属性的值是数组中元素的总个数

var fruits = ["Apple", "Orange", "Plum"];
alert( fruits.length ); // 3

//清空数组
fruits.length = 0
console.log(fruits)

获取

数组元素从 0 开始编号。
我们可以通过方括号中的数字获取元素:

let fruits = ["Apple", "Orange", "Plum"];
alert( fruits[0] ); // Apple
alert( fruits[1] ); // Orange
alert( fruits[2] ); // Plum

替换

fruits[2] = 'Pear'; // 现在变成了 ["Apple", "Orange", "Pear"]

增加

fruits[3] = 'Lemon'; // 现在变成 ["Apple", "Orange", "Pear", "Lemon"]

遍历

var math = [3,4,5,6,7,8]
for(var i=0;i<math.length;i++){
    comsole.log(math[i])
}

image.png

删除/添加

pop

取出并返回数组的最后一个元素

let fruits = ["Apple", "Orange", "Pear"];
alert( fruits.pop() ); // 移除 "Pear" 然后 alert 显示出来
alert( fruits ); // Apple, Orange

push

在数组末端添加元素

let fruits = ["Apple", "Orange"];
fruits.push("Pear");
alert( fruits ); // Apple, Orange, Pear

unshift

在数组的首端添加元素:

let fruits = ["Orange", "Pear"];
fruits.unshift('Apple');
alert( fruits ); // Apple, Orange, Pear

注:push 和 unshift 方法都可以一次添加多个元素

shift

取出数组的第一个元素并返回它:

let fruits = ["Apple", "Orange", "Pear"];
alert( fruits.shift() ); // 移除 Apple 然后 alert 显示出来
alert( fruits ); // Orange, Pear

splice

语法:arr.splice(start[, deleteCount, elem1, ..., elemN])
它从索引 start 开始修改 arr :删除 deleteCount 个元素并在当前位置插入 elem1,..., elemN 。最后返回已被删除元素的数组。

1.删除

从索引 1 开始删除 1 个元素

let arr = ["I", "study", "JavaScript"];
arr.splice(1, 1); // 从索引 1 开始删除 1 个元素
alert( arr ); // ["I", "JavaScript"]

2.替换

删除了 3 个元素,并用另外两个元素替换它们:

let arr = ["I", "study", "JavaScript", "right", "now"];
// remove 3 first elements and replace them with another
arr.splice(0, 3, "Let's", "dance");
alert( arr ) // now ["Let's", "dance", "right", "now"]

3.插入

将 deleteCount 设置为 0 , splice 方法就能够插入元素而不用删除任何元素:

let arr = ["I", "study", "JavaScript"];
// 从索引 2 开始
// 删除 0 个元素
// 然后插入 "complex""language"
arr.splice(2, 0, "complex", "language");
alert( arr ); // "I", "study", "complex", "language", "JavaScript"

负向索引

从数组末尾计算位置

let arr = [1, 2, 5];
// 从索引 -1(尾端前一位)
// 删除 0 个元素,
// 然后插入 3 和 4
arr.splice(-1, 0, 3, 4);
alert( arr ); // 1,2,3,4,5

slice

语法:arr.slice([start], [end]) 它会返回一个新数组,将所有从索引 start 到 end (不包括 end )的数组项复制到一个新的数组。 start 和 end 都可以是负数,在这种情况下,从末尾计算索引。

let arr = ["t", "e", "s", "t"];
alert( arr.slice(1, 3) ); // e,s(复制从位置 1 到位置 3 的元素)
alert( arr.slice(-2) ); // s,t(复制从位置 -2 到尾端的元素)

可以不带参数地调用它: arr.slice() 会创建一个 arr 的副本。其通常用于获取副 本,以进行不影响原始数组的进一步转换。

concat

arr.concat 创建一个新数组,其中包含来自于其他数组和其他项的值
语法:arr.concat(arg1, arg2...)
可以受任意数量的参数 —— 数组或值
结果是一个包含来自于 arr ,然后是 arg1 , arg2 的元素的新数组。
如果参数 argN 是一个数组,那么其中的所有元素都会被复制。否则,将复制参数本身。
例子:

let arr = [1, 2];
// create an array from: arr and [3,4]
alert( arr.concat([3, 4]) ); // 1,2,3,4
// create an array from: arr and [3,4] and [5,6]
alert( arr.concat([3, 4], [5, 6]) ); // 1,2,3,4,5,6
// create an array from: arr and [3,4], then add values 5 and 6
alert( arr.concat([3, 4], 5, 6) ); // 1,2,3,4,5,6

复制数组中的元素。其他对象,即使看起来像数组一样,但仍然会被作为一个整体添加:

let arr = [1, 2];
let arrayLike = {
0: "something",
length: 1
};
alert( arr.concat(arrayLike) ); // 1,2,[object Object]

遍历:forEach

arr.forEach 允许为数组的每个元素都运行一个函数
语法:

arr.forEach(function(item, index, array) {
// ... do something with item
});

转换

reverse

arr.reverse 方法用于颠倒 arr 中元素的顺序

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

soft

arr.sort 方法对数组进行 原位(in-place) 排序,更改元素的顺序
例子:

let arr = [ 1, 2, 15 ];
// 该方法重新排列 arr 的内容
arr.sort();
alert( arr ); // 1, 15, 2

注:这些元素默认情况下被按字符串进行排序,实际上应该是 "2" > "15"
要使用我们自己的排序顺序,我们需要提供一个函数作为 arr.sort() 的参数。
例子:

function compareNumeric(a, b) {
if (a > b) return 1;
if (a == b) return 0;
if (a < b) return -1;
}
let arr = [ 1, 2, 15 ];
arr.sort(compareNumeric);
alert(arr); // 1, 2, 15


are.sort(funtion(a,b){
    return a-b(正序)  //b-a(倒序)
})
console.log(arr)//  

map

对数组的每个元素都调用函数,并返回结果数组
语法:

let result = arr.map(function(item, index, array) {
// 返回新值而不是当前元素
})

例子:

let lengths = ["Bilbo", "Gandalf", "Nazgul"].map(item => item.length);
alert(lengths); // 5,7,6

split

过给定的分隔符 delim 将字符串分割成一个数组

let names = 'Bilbo, Gandalf, Nazgul';
let arr = names.split(', ');
for (let name of arr) {
alert( `A message to ${name}.` ); // A message to Bilbo(和其他名字)
}

限制数组的长度

let arr = 'Bilbo, Gandalf, Nazgul, Saruman'.split(', ', 2);
alert(arr); // Bilbo, Gandalf

join

创建一串由 glue 粘合的 arr 项

let arr = ['Bilbo', 'Gandalf', 'Nazgul'];
let str = arr.join(';'); // 使用分号 ; 将数组粘合成字符串
alert( str ); // Bilbo;Gandalf;Nazgul

搜素

indexOf,lastIndexO,includes

arr.indexOf(item, from) 从索引 from 开始搜索 item ,如果找到则返回索引,否则返回 -1
。 arr.lastIndexOf(item, from) —— 和上面相同,只是从右向左搜索。
arr.includes(item, from) —— 从索引 from 开始搜索 item ,如果找到则返回true (译注:如果没找到,则返回 false )。
例子:

let arr = [1, 0, false];
alert( arr.indexOf(0) ); // 1
alert( arr.indexOf(false) ); // 2
alert( arr.indexOf(null) ); // -1
alert( arr.includes(1) ); // true

find

语法:

let result = arr.find(function(item, index, array) {
// 如果返回 true,则返回 item 并停止迭代
// 对于 falsy 则返回 undefined
})

依次对数组中的每个元素调用该函数:
item 是元素
index 是它的索引
array 是数组本身
如果它返回 true ,则搜索停止,并返回 item 。如果没有搜索到,则返回 undefined 。