数组操作方法
isArray()
检查对象是否为数组
语法:Array.isArray(obj)
参数值:obj必需。需测试的对象。
返回值:布尔值。如果对象是数组则返回 true,否则返回 false。
var arr = [1, 2, 3];
console.log(Array.isArray(arr)); //true
console.log(arr instanceof Array); //true
console.log(arr.constructor === Array); //true
toString()
将数组转换为字符串
定义:返回包含所有数组值的字符串,以逗号分隔。
语法:array.toString()
注释:不会改变原始数组
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var energy = fruits.toString();
//energy 结果:Banana,Orange,Apple,Mango
join()
将数组元素转换为字符串
定义:将数组的所有元素连接成一个字符串。元素将由指定的分隔符分隔。默认分隔符是逗号 (,)。
语法:array.join(separator)
参数值:separator可选。要使用的分隔符。如果省略,元素用逗号分隔。
注释:不会改变原始数组
var fruits = ["Banana", "Orange","Apple", "Mango"];
var energy = fruits.join(" * ");
//energy结果:Banana * Orange * Apple * Mango
pop()
/shift()
删除元素
定义:删除数组的最后一个元素,并返回该删除的元素。
语法:array.pop()
注释:会改变原始数组
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.pop(); // 从fruits删除最后一个元素("Mango")
var x = fruits.pop(); //x的值是"Mango"
定义:删除数组的第一个元素,并把所有其他元素“位移”到更低的索引,并返回第一个被删除元素的值
语法:array.shift()
注释:会改变原始数组
//从数组中移除首个元素
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var res = fruits.shift()
//fruits值为Orange,Apple,Mango
//res为Banana
push()
/unshift()
添加元素
定义:向数组末尾添加新元素,并返回新的长度。
语法:array.push(item1, item2, ..., itemX)
参数值:item1, item2, …, itemX必需。要添加到数组中的项目。
注释:会改变原始数组
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi"); //向fruits结尾处添加一个新元素
var res = fruits.push("Kiwi"); //res值是5
定义:将新项添加到数组的开头,并返回新的长度。
语法:array.unshift(item1, item2, ..., itemX)
参数值:item1,item2, …, itemX必需。要添加到数组开头的项。
注释:会改变原始数组
//将新项添加到数组起始位置
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var res = fruits.unshift("Lemon","Pineapple");
//fruits值为Lemon,Pineapple,Banana,Orange,Apple,Mango
//res为6
length
属性设置或返回数组中元素的数量
语法:array.length
返回数组的长度;array.length = number
设置数组的长度
//向数组追加元素
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits[fruits.length] = "Kiwi"; // 向 fruits 追加 "Kiwi"
console.log(fruits )//["Banana", "Orange", "Apple", "Mango", "Kiwi"]
//设置数组的长度为1个
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.length = 1;
console.log(fruits)//["Banana"]
splice()
拼接数组
定义:向/从数组添加/删除项目,并返回删除的项目。
语法:array.splice(index, howmany, item1, ....., itemX)
(从什么位置开始,删几个?删了后插入新元素)
参数值:index必需。整数,指定在什么位置添加/删除项目,使用负值指定从数组末尾开始的位置。howmany可选。要删除的项目数量。如果设置为0,则不会删除任何项目。如果未设置此参数,则删除从index开始到原数组结尾的所有元素。 item1, …, itemX可选。要添加到数组中的新项目。
返回值:新数组,包含删除的项目(如果有)。
注释:会改变原始数组
//从下标值为2的第三个位置开始删除(包含自身)一个元素,并在删除第三个位置添加新元素
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var res = fruits.splice(2, 1, "Lemon", "Kiwi");
//fruits值为Banana,Orange,Lemon,Kiwi,Mango
//res值为被删除的Apple
//从下标值为1的第二个位置开始删除(包含自身)两个元素:
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var res = fruits.splice(1,2);
//fruits值为Banana,Mango
//res值为被删除的Orange,Apple
//从倒数第三个位置开始删除两个元素,并在删除倒数三个的位置添加新元素
var arr = [1, 2, 3, 4, 5, 6, 7];
var res = arr.splice(-3, 2, "a", "b", "c");
console.log(arr); // [1, 2, 3, 4, "a", "b", "c", 7]
console.log(res); // [5, 6]
slice()
裁剪数组
定义:选择数组的一部分,并返回新数组。
语法:array.slice(start, end)
参数值:从start(包括该元素)到end(不包括该元素)arrayObject中的元素。start可选。规定从何处开始选取。如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。end可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。
注释:不会改变原始数组
//只有1个start参数时,从数组元素下标值为2的("Lemon")开始截取出一段新数组:
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(2); //citrus值为Lemon,Apple,Mango
//2个参数,从数组元素下标值为1的("Orange")开始截取,截到数组元素下标值为2的("Lemon")为止(不包含end下标3的元素)
var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(1, 3);//citrus值为Orange,Lemon
concat()
连接两个或多个数组
定义:不会更改现有数组,而是返回一个新数组,其中包含已连接数组的值。
语法:array1.concat(array2, array3, ..., arrayX)
参数:array2, array3, …, arrayX必需。该参数可以是具体的值,也可以是数组对象。可以是任意多个。
//合并两个数组
var myGirls = ["Cecilie", "Lone"];
var myBoys = ["Emil", "Tobias", "Linus"];
var myChildren = myGirls.concat(myBoys); //连接 myGirls 和 myBoys,myChildren值为Cecilie,Lone,Emil,Tobias,Linus
//合并三个数组
var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3); // 将arr1、arr2 与 arr3 连接在一起
//将数组与值合并
var arr1 = ["Cecilie", "Lone"];
var myChildren = arr1.concat(["Emil", "Tobias", "Linus"]);
数组排序方法
sort()
对数组的元素进行排序
定义:对数组的元素进行排序。排序顺序可以是按字母或数字,也可以是升序(向上)或降序(向下)。默认排序顺序为按字母升序。在对数字进行排序时会产生不正确的结果,可以通过提供“比较函数”来解决此问题。
语法:array.sort(compareFunction)
参数值:compareFunction可选。定义替代排序顺序的函数。该函数应返回负值、零值或正值,具体取决于参数。
注释:会改变原始数组
//默认按字母升序
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort(); //Apple,Banana,Mango,Orange
//数字排序(数字和升序):
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b}); //1,5,10,25,40,100
//数字排序(数字和降序):
var points = [40,100,1,5,25,10];
points.sort(function(a,b){return b-a}); //100,40,25,10,5,1
reverse()
反转数组中元素的顺序
语法:array.reverse()
注释:会改变原始数组
//颠倒数组中元素的顺序
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse(); //Mango,Apple,Orange,Banana
数组迭代/遍历方法
for of
(ES6)
//for of得到的是value,数组元素值
var fruits = ["Banana", "Orange", "Apple", "Mango"];
for (let item of fruits) {
console.log(item); //Banana, Orange, Apple, Mango
}
for in
(适合遍历对象)
定义:循环遍历对象的属性
//for in遍历对象
let obj = {
name: '王大锤',
age: '18',
weight: '70kg'
}
for(let key in obj) {
console.log(key); // name age weight
console.log(obj[key]); // 王大锤 18 40kg
}
//for in遍历数组
for(var key in arr) {
console.log(key); // 0 1 2 3 4 返回数组索引
console.log(arr[key]) // 1a 2b 3c 4d 5e
}
forEach()
定义:为每个数组元素调用函数
语法:array.forEach(function(currentValue, index, arr), thisValue)
参数:接受一个回调函数为参数。function(currentValue, index, arr)必需。为数组中的每个元素运行的函数。 回调函数中有三个参数:currentValue数组元素(必选),index数组元素索引值(可选),arr数组本身(可选);
注释:会改变原始数组,返回值为undefined
//将值更新为原始值的10倍
let arr = [65, 44, 12, 4];
arr.forEach(function (item, index, arr) {
console.log(item); // 65 44 12 4
console.log(index); // 0 1 2 3
console.log(arr); // [65, 44, 12, 4] 会打印5遍
arr[index] = item * 10;
})
console.log(arr) // [650, 440, 120, 40]
map()
定义:为每个数组元素调用函数的结果创建新数组
语法:array.map(function(currentValue, index, arr), thisValue)
参数:接受一个回调函数为参数。function(currentValue, index, arr)必需。为数组中的每个元素运行的函数。 回调函数中有三个参数:currentValue数组元素(必选),index数组元素索引值(可选),arr数组本身(可选);
注释:不会改变原始数组,返回一个新数组
//将值更新为原始值的10倍
let arr = [65, 44, 12, 4];
let newArr = arr.map(function (item) {
return item * 10
})
console.log(newArr); // [650, 440, 120, 40]
reduce()
定义:将数组缩减为单个值(从左到右)、为数组的每个值(从左到右)执行提供的函数。函数的返回值存储在累加器中(结果/总计)。
语法:array.reduce(function(total, currentValue, index, arr), initialValue)
参数:接受一个回调函数为参数,function(total, currentValue, index, arr) 必需。回调函数中有四个参数:total总计(必选),currentValue数组元素(必需),index数组元素索引值(可选);arr数组本身(可选)
注释:不会改变原始数组
//从头开始减去剩余数组中的数字
var numbers = [165, 44, 12, 4];
var newArr = numbers.reduce(myFunction)
function myFunction(total, item) {
return total - item
}
console.log(newArr) //105
filter()
定义:用于筛选出满足要求的数组元素,并返回新的数组。新数组中的元素是通过检查指定数组中符合条件的所有元素。
语法:array.filter(function(currentValue,index,arr), thisValue)
var ages = [32, 33, 12, 9, 40];
var newAges = ages.filter(checkAge)
function checkAge(item) {
return item > 18
}
console.log(newAges) //32 33 40
includes()
定义:检查数组是否包含指定的元素。如果数组包含元素,则此方法返回 true,否则返回 false。
语法:array.includes(element, start)
参数值:element必需。要搜索的元素。start可选。默认0。在数组中的哪个位置开始搜索。
const names = ["xixi", "haha", "hoho"];
console.log(names.includes("haha"));//true
some()
定义:检测数组中是否有元素符合指定的条件。对数组中每一项都运行指定函数,当任意一项返回true时,则返回true,否则返回false。
语法:array.some(function(currentValue, index, arr), thisValue)
//检查ages数组中是否有18或以上的值
var ages = [32, 33, 12, 9, 40];
var newAges = ages.some(checkAge)
function checkAge(item) {
return item > 18
}
console.log(newAges) //true
every()
定义:检测数值元素的每个元素是否都符合条件。对数组中每一项都运行指定函数,当每一项都满足条件时,则返回true,否则返回false)
语法:array.every(function(currentValue, index, arr), thisValue)
//检查ages数组中是否有18或以上的值
var ages = [32, 33, 12, 9, 40];
var newAges = ages.every(checkAge)
function checkAge(item) {
return item > 18
}
console.log(newAges) //false
indexOf()
定义:在数组中搜索元素并返回其位置。搜索将从指定位置开始,如果未指定开始位置,则从头开始,并在数组末尾结束搜索。如果未找到该项目,则 indexOf() 返回 -1。如果该项目出现多次,则 indexOf() 方法返回第一次出现的位置。
语法:array.indexOf(item, start)
参数值:item 必需。要搜索的项目。start可选。从哪里开始搜索。负值给定的位置将从结尾计数,然后搜索到最后。
var fruits = ["Banana", "Orange", "Apple", "Mango"];
var res = fruits.indexOf("Apple");
console.log(res) //2
var fruits = ["Banana", "Orange", "Apple", "Mango", "Banana", "Orange", "Apple"];
var res = fruits.indexOf("Apple", 4);
console.log(res) //6
find()
(ES6)
定义:返回数组中第一个通过测试的元素的值。对数组中存在的每个元素执行一次函数:如果找到函数返回 true 值的数组元素,则 find() 返回该数组元素的值(并且不检查剩余值), 否则返回 undefined。
语法:array.find(function(currentValue, index, arr), thisValue)
注释:不会改变原始数组
var ages = [32, 33, 12, 9, 40];
var newAges = ages.find(checkAge)
function checkAge(item) {
return item > 18
}
console.log(newAges) //32
数组去重方法
new Set()
let arr = [20, 21, 23, 25, 21, 20 ];
let item = [ ...new Set(arr)];
console.log(item); //[20, 21, 23, 25]