大致分为四类
增删改查
增:push ,unshift ,splice
删:pop , shift ,reduce , reduceRight
改:map , fill
查:every , filter ,find ,findIndex ,includes ,indexOf ,lastIndexof ,some
2.排序
reverse ,sort
3.类型
判断:isArray
修改:join , toString
4.功能性
forEach, keys , valueOf ,entries ,from
以下为详细介绍
1.增加
push()向数组的末尾添加一个或更多元素,并返回新的长度。
//数组中添加新元素:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi")//fruits 结果输出:Banana,Orange,Apple,Mango,Kiwi
unshift()向数组的开头添加一个或更多元素,并返回新的长度。
//将新项添加到数组起始位置:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple");//fruits 将输出:Lemon,Pineapple,Banana,Orange,Apple,Mango
splice()从数组中添加或删除元素。
//数组中添加新元素:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi");
//fruits 输出结果:
Banana,Orange,Lemon,Kiwi,Apple,Mango
2.删除
pop()删除数组的最后一个元素并返回删除的元素。
//移除最后一个数组元素varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();//fruits 结果输出:Banana,Orange,Apple
shift()删除并返回数组的第一个元素。
//从数组中移除元素:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift()//fruits结果输出:Orange,Apple,Mango
reduce()将数组元素计算为一个值(从左到右)
//计算数组元素相加后的总和:var numbers = [65, 44, 12, 4]; functiongetSum(total, num) { return total +num;}functionmyFunction(item) { document.getElementById("demo").innerHTML = numbers.reduce(getSum);
}
//输出结果:
125
reduceRight()将数组元素计算为一个值(从右到左)。
//计算数组元素相加后的总和:varnumbers = [65, 44, 12, 4];
function getSum(total, num) {
returntotal + num;
}function myFunction(item) {
document.getElementById("demo").innerHTML = numbers.reduceRight(getSum);
}//输出结果:125
3.改
map()通过指定函数处理数组的每个元素,并返回处理后的数组。
//返回一个数组,数组中元素为原始数组的平方根:varnumbers = [4, 9, 16, 25];function myFunction() {
x = document.getElementById("demo")
x.innerHTML = numbers.map(Math.sqrt);
}//输出结果为:2,3,4,5
fill()使用一个固定值来填充数组
//使用固定值填充数组:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("Runoob");//fruits 输出结果:Runoob,Runoob,Runoob,Runoob
4.查
every()检测数值元素的每个元素是否都符合条件。
//检测数组 ages 的所有元素是否都大于等于 18 :varages = [32, 33, 16, 40];function checkAdult(age) {
returnage >= 18;
}function myFunction() {
document.getElementById("demo").innerHTML = ages.every(checkAdult);
}//输出结果为:false
filter()检测数值元素,并返回符合条件所有元素的数组。
//返回数组 ages 中所有元素都大于 18 的元素:varages = [32, 33, 16, 40];function checkAdult(age) {
returnage >= 18;
}function myFunction() {
document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}//输出结果为:32,33,40
find()返回符合传入测试(函数)条件的数组元素。
//获取数组中年龄大于 18 的第一个元素varages = [3, 10, 18, 20];
function checkAdult(age) {
returnage >= 18;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.find(checkAdult);
}//fruits 输出结果:18
findIndex()返回符合传入测试(函数)条件的数组元素索引。
//获取数组中年龄大于等于 18 的第一个元素索引位置varages = [3, 10, 18, 20];
function checkAdult(age) {
returnage >= 18;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.findIndex(checkAdult);
}//fruits 输出结果:2
includes()判断一个数组是否包含一个指定的值。
//检测数组 site 是否包含 runoob :let site = ['runoob', 'google', 'taobao'];
site.includes('runoob'); // true
site.includes('baidu'); // false
indexOf()搜索数组中的元素,并返回它所在的位置。
//查找数组中的 "Apple" 元素:varfruits = ["Banana", "Orange", "Apple", "Mango"];vara = fruits.indexOf("Apple");//a 结果输出:2
lastIndexOf()搜索数组中的元素,并返回它最后出现的位置。
//查找数组元素 "Apple"出现的位置:varfruits = ["Banana", "Orange", "Apple", "Mango"];vara = fruits.lastIndexOf("Apple");//a 输出结果:2//以上实例输出结果意味着 "Apple" 位于数组中的第 2 个位置.
some()检测数组元素中是否有元素符合指定条件。
//检测数组中是否有元素大于 18:varages = [3, 10, 18, 20];function checkAdult(age) {
returnage >= 18;
}function myFunction() {
document.getElementById("demo").innerHTML = ages.some(checkAdult);
}//输出结果为:true
5.排序
reverse()反转数组的元素顺序。
//颠倒数组中元素的顺序:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();//fruits 结果输出:Mango,Apple,Orange,Banana
sort()对数组的元素进行排序。
//数组排序:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();//fruits 输出结果:Apple,Banana,Mango,Orange
6.类型判断
isArray()判断对象是否为数组。
//判断对象是否为数组:function myFunction() {
varfruits = ["Banana", "Orange", "Apple", "Mango"];
varx = document.getElementById("demo");
x.innerHTML = Array.isArray(fruits);
}//如果对象是数组返回 true,否则返回 false。
7.类型修改
join()把数组的所有元素放入一个字符串。
//把数组中的所有元素转换为一个字符串:varfruits = ["Banana", "Orange", "Apple", "Mango"];varenergy = fruits.join();//energy输出结果:Banana,Orange,Apple,Mango
toString()把数组转换为字符串,并返回结果。
//将数组转换为字符串:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.toString();//fruits将输出:Banana,Orange,Apple,Mango
8.功能性
forEach()数组每个元素都执行一次回调函数。
//列出数组的每个元素:点我 demoP = document.getElementById("demo");varnumbers = [4, 9, 16, 25];
function myFunction(item, index) {
demoP.innerHTML = demoP.innerHTML + "index[" + index + "]: " + item + "
";
}//输出结果:index[0]: 4index[1]: 9index[2]: 16index[3]: 25
keys()返回数组的可迭代对象,包含原始数组的键(key)。
//从数组 fruit 创建一个数组迭代对象, 该对象包含了数组的键:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.keys();//如果对象是数组返回 true,否则返回 false。
valueOf()返回数组对象的原始值。
//valueOf() 是数组对象的默认方法。varfruits = ["Banana", "Orange", "Apple", "Mango"];varv=fruits.valueOf();
fruits.valueOf()与 fruits返回值一样。//v输出结果为:Banana,Orange,Apple,Mango
entries()返回数组的可迭代对象。
从数组 fruit 创建一个可迭代对象, 该对象包含了数组的键值对:varfruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.entries();//结果[0, "Banana"]
[1, "Orange"]
[2, "Apple"]
[3, "Mango"]
from()通过给定的对象中创建一个数组。
//通过字符串创建一个数组:varmyArr = Array.from("RUNOOB");//结果R