前言
Array 对象用于在单个的变量中存储多个值。
创建 Array 对象的语法
new Array();
new Array(size);
new Array(element0, element1, ..., elementn);
Array对象属性
属性 | 描述 |
---|---|
constructor | 返回对创建此对象的数组函数的引用。 |
length | 设置或返回数组中元素的数目。 |
prototype | 使您有能力向对象添加属性和方法。 |
Array 对象方法
concat()
连接两个或更多的数组,并返回结果。
语法
array1.concat(array2,array3,...,arrayX)
举例:
var Big=["a","b","c","d"];
var Small=["a","b","e"];
Big.concat(Small);
//将Small数组连接到Big数组
copyWithin()
从数组的指定位置拷贝元素到数组的另一个指定位置中。
语法
array.copyWithin(target, start, end)
解释
target
:复制到数组的那个地方去,必选参数start
:从哪儿开始复制。可选end
:复制到哪儿,可选,设置负数(如-1)即复制到倒数那个位置,可选
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"];
fruits.copyWithin(2, 0, 2);
entries()
返回数组的可迭代对象。
语法
array.entries()
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.entries();
//从数组 fruit 创建一个可迭代对象, 该对象包含了数组的键值对
every()
检测数值元素的每个元素是否都符合条件。
语法
array.every(function(currentValue,index,arr), thisValue)
解释
参数 | 描述 |
---|---|
function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue ,"this" 的值为 "undefined" |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var ages = [32, 33, 16, 40];
function checkAdult(age) {
return age >= 18;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.every(checkAdult);
}
//检测数组 ages 的所有元素是否都大于等于 18
fill()
使用一个固定值来填充数组。
语法
array.fill(value, start, end)
参数
参数 | 描述 |
---|---|
value | 必需。填充的值。 |
start | 可选。开始填充位置。 |
end | 可选。停止填充位置 (默认为 array.length) |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.fill("凉菜");
//使用“凉菜”填充整个数组
filter()
检测数值元素,并返回符合条件所有元素的数组。
语法
array.filter(function(currentValue,index,arr), thisValue)
参数
参数 | 描述 |
---|---|
function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue ,"this" 的值为 "undefined" |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var ages = [32, 33, 16, 40];
function checkAdult(age) {
return age >= 18;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.filter(checkAdult);
}
//返回数组中所有>=18的元素
find()
返回符合传入测试(函数)条件的数组元素。
语法
array.find(function(currentValue, index, arr),thisValue)
参数
参数 | 描述 |
---|---|
function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。 传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值 |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var ages = [4, 12, 16, 20];
function checkAdult(age) {
return age >= document.getElementById("ageToCheck").value;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.find(checkAdult);
}
//返回符合大于输入框中数字的数组索引值
findIndex()
返回符合传入测试(函数)条件的数组元素索引。
语法
array.findIndex(function(currentValue, index, arr),thisValue)
参数
参数 | 描述 |
---|---|
function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 返回符合测试条件的第一个数组元素索引,如果没有符合条件的则返回 -1。 |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var ages = [4, 12, 16, 20];
function checkAdult(age) {
return age >= document.getElementById("ageToCheck").value;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.find(checkAdult);
}
//获取数组中年龄大于等于 18 的第一个元素索引位置
forEach()
数组每个元素都执行一次回调函数
语法
array.forEach(function(currentValue, index, arr),thisValue)
参数
参数 | 描述 |
---|---|
function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。传递给函数的值一般用 "this" 值。如果这个参数为空, "undefined" 会传递给 "this" 值 |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
<button onclick="numbers.forEach(myFunction)">点我</button>
<p id="demo"></p>
demoP = document.getElementById("demo");
var numbers = [4, 9, 16, 25];
function myFunction(item, index) {
demoP.innerHTML = demoP.innerHTML + "index[" + index + "]: " + item + "<br>";
}
//列出数组的每个元素
输出
index[0]: 4
index[1]: 9
index[2]: 16
index[3]: 25
from()
通过给定的对象中创建一个数组。
语法
Array.from(object, mapFunction, thisValue)
参数
参数 | 描述 |
---|---|
object | 必需,要转换为数组的对象。 |
mapFunction | 可选,数组中每个元素要调用的函数。 |
thisValue | 可选,映射函数(mapFunction)中的 this 对象。 |
举例:
var myArr = Array.from("凉菜");
//通过字符串创建一个数组
includes()
判断一个数组是否包含一个指定的值。
语法
arr.includes(searchElement)
arr.includes(searchElement, fromIndex)
参数
参数 | 描述 |
---|---|
searchElement | 必须。需要查找的元素值。 |
fromIndex | 可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。 |
举例:
[1, 2, 3].includes(2); // true
[1, 2, 3].includes(4); // false
[1, 2, 3].includes(3, 3); // false
[1, 2, 3].includes(3, -1); // true
[1, 2, NaN].includes(NaN); // true
//includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false。
indexOf()
搜索数组中的元素,并返回它所在的位置。
语法
array.indexOf(item,start)
参数
参数 | 描述 |
---|---|
item | 必须。查找的元素。 |
start | 可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");
//查找数组中的 "Apple" 元素,本例输出2。
lastIndexOf()
搜索数组中的元素,并返回它最后出现的位置。
语法
array.lastIndexOf(item,start)
参数
参数 | 描述 |
---|---|
item | 必须。查找的元素。 |
start | 可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");
//查找数组中的 "Apple" 元素,本例输出2。
isArray()
判断对象是否为数组。
语法
Array.isArray(obj)
参数
参数 | 描述 |
---|---|
obj | 必需,要判断的对象 |
举例:
function myFunction() {
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var x = document.getElementById("demo");
x.innerHTML = Array.isArray(fruits);
}
//判断对象是否为数组。
join()
把数组的所有元素放入一个字符串。
语法
array.join(separator)
参数
参数 | 描述 |
---|---|
separator | 可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var energy = fruits.join();
//把数组中的所有元素转换为一个字符串,本例返回String类型的Banana,Orange,Apple,Mango
key()
返回数组的可迭代对象,包含原始数组的键(key)。
语法
array.keys()
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.keys();
//从数组 fruit 创建一个数组迭代对象, 该对象包含了数组的键
map()
通过指定函数处理数组的每个元素,并返回处理后的数组。
语法
array.map(function(currentValue,index,arr), thisValue)
参数
参数 | 描述 |
---|---|
function(currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue,或者传入 null、undefined,那么回调函数的 this 为全局对象。 |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var numbers = [4, 9, 16, 25];
function myFunction() {
x = document.getElementById("demo")
x.innerHTML = numbers.map(Math.sqrt);
}
//返回一个数组,数组中元素为原始数组的平方根
pop()、shift()
pop()从数组尾部删除一个元素,shift()从数组头部删除一个元素
语法
array.pop()
array.shift()
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop();
//返回结果Banana,Orange,Apple
fruits.shift();
//返回结果Orange,Apple
push()、unshift()
pop()从数组尾部添加一个或多个元素,shift()从数组头部添加一个或多个元素
语法
array.push(item1, item2, ..., itemX)
array.unshift(item1, item2, ..., itemX)
参数
参数 | 描述 |
---|---|
item1, item2, ..., itemX | 必需。要添加到数组的元素。 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi")
//fruits当前值Banana,Orange,Apple,Mango,Kiwi
fruits.unshift("Kiwi")
//fruits当前值Kiwi,Banana,Orange,Apple,Mango,Kiwi
reduce()、reduceRight()
reduce()将数组元素计算为一个值(从左到右),reduceRight()将数组元素计算为一个值(从右到左)
语法
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
array.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
参数
参数 | 描述 |
---|---|
function(total,currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。传递给函数的初始值 |
function参数
参数 | 描述 |
---|---|
total | 必需。初始值, 或者计算结束后的返回值。 |
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var numbers = [65, 44, 12, 4];
function getSum(total, num) {
return total + num;
}
function myFunction(item) {
document.getElementById("demo1").innerHTML = numbers.reduce(getSum);
document.getElementById("demo2").innerHTML = numbers.reduceRight(getSum);
}
//结果都为125
reverse()
反转数组的元素顺序
语法
array.reverse()
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();
//fruits当前值Mango,Apple,Orange,Banana
slice()
选取数组的的一部分,并返回一个新数组
语法
array.slice(start, end)
参数
参数 | 描述 |
---|---|
start | 可选。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。 |
end | 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();
//fruits当前值Mango,Apple,Orange,Banana
some()
检测数组元素中是否有元素符合指定条件。
语法
array.some(function(currentValue,index,arr),thisValue)
参数
参数 | 描述 |
---|---|
function(total,currentValue, index,arr) | 必须。函数,数组中的每个元素都会执行这个函数 |
thisValue | 可选。对象作为该执行回调时使用,传递给函数,用作 "this" 的值。如果省略了 thisValue ,"this" 的值为 "undefined" |
function参数
参数 | 描述 |
---|---|
currentValue | 必须。当前元素的值 |
index | 可选。当前元素的索引值 |
arr | 可选。当前元素属于的数组对象 |
举例:
var ages = [3, 10, 18, 20];
function checkAdult(age) {
return age >= 18;
}
function myFunction() {
document.getElementById("demo").innerHTML = ages.some(checkAdult);
}
//检测数组中是否有元素大于 18:true
sort()
对数组的元素进行排序。
语法
array.sort(sortfunction)
参数
参数 | 描述 |
---|---|
sortfunction | 可选。规定排序顺序。必须是函数 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
//fruits当前值Apple,Banana,Mango,Orange
splice()
从数组中添加或删除元素
语法
array.splice(index,howmany,item1,.....,itemX)
参数
参数 | 描述 |
---|---|
index | 必需。规定从何处添加/删除元素。该参数是开始插入和(或)删除的数组元素的下标,必须是数字。 |
howmany | 必需。规定应该删除多少元素。必须是数字,但可以是 "0"。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。 |
item1,.....,itemX | 可选。要添加到数组的新元素 |
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,0,"Lemon","Kiwi");
//fruits当前值Banana,Orange,Lemon,Kiwi,Apple,Mango
toString()
把数组转换为字符串,并返回结果。
语法
array.toString()
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.toString();
//返回字符串Banana,Orange,Apple,Mango
valueOf()
返回数组对象的原始值。
语法
array.valueOf()
举例:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var v=fruits.valueOf();
//返回数组Banana,Orange,Apple,Mango,于其本身一样