前言

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,于其本身一样

End

Last modification:August 2nd, 2019 at 09:15 am
如果觉得我的文章对你有用,请随意赞赏