一、在JavaScript中创建数组的方法
(1)、Array构造函数创建数组
1 2 3 4 var Arr1 = new Array (); var Arr2 = new Array (6 ); Arr2[0 ] = 1 ; var Arr3 = new Array ('a' ,'b' ,'c' );
(2)、Array字面量创建
1 2 3 var Arr1 = []; var Arr2 = [6 ]; var Arr3 = ['a' ,'b' ,'c' ];
二、数组的方法介绍
方法
作用
是否改变原数组
1.push
在数组的末尾增加一个或多个元素,并返回数组的新长度
是
2.pop
删除数组的最后一个元素,并返回这个元素
是
3.unshift
在数组的开头增加一个或多个元素,并返回数组的新长度
是
4.shift
删除数组的第一个元素,并返回这个元素
是
5.sort
对数组元素进行排序,并返回当前数组
是
6.reverse
颠倒数组中元素的顺序
是
7.splice
添加或删除数组中的元素
是
8.copyWithin
从数组的指定位置拷贝元素到数组的另一个指定位置中
是
9.concat
用于连接两个或多个数组
否
10.entries
返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)
否
11.every
检测数组所有元素是否都符合指定条(通过函数提供)
否
12.fill
将一个固定值替换数组的元素
是
13.filter
创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素
否
14.find
返回通过测试(函数内判断)的数组的第一个元素的值
否
15.findIndex
返回传入一个测试条件(函数)符合条件的数组第一个元素位置
否
16.forEach
用于调用数组的每个元素,并将元素传递给回调函数
否
17.from
通过拥有 length 属性的对象或可迭代的对象来返回一个数组
否
18.includes
判断一个数组是否包含一个指定的值,如果是返回 true,否则false
否
19.indexOf
返回数组中某个指定的元素位置,没有的话返回-1
否
20.isArray
判断一个对象是否为数组,是返回true否则返回false
否
21.join
把数组中的所有元素转换一个字符串。元素是通过指定的分隔符进行分隔的
否
22.keys
从数组创建一个包含数组键的可迭代对象。如果对象是数组返回 true,否则返回 false
否
23.lastIndexOf
返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找
否
24.map
返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值
否
25.reduce
接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值
否
26.reduceRight
功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加
否
27.slice
可从已有的数组中返回选定的元素
否
28.some
用于检测数组中的元素是否满足指定条件(函数提供)
否
29.toString
把数组转换为字符串,并返回结果
否
30.valueOf
返回 Array 对象的原始值
否
三、数组方法实例
1.push()方法用于在数组的末尾增加一个或多个元素,并返回数组的新长度
语法:array.push(item1, item2, …, itemX)
1 2 3 var array = ['1' ,'2' ];array.push('3' ,'4' ); console .log(array);
2.pop()方法用于删除数组的最后一个元素并返回删除的元素
语法:array.pop()
1 2 3 var array = ['1' ,'2' ];array.pop(); console .log(array);
3.unshift()方法用于向数组的开头添加一个或更多元素,并返回新的长度
语法:array.unshift(item1, item2, …, itemX)
1 2 3 var array = ['1' ,'2' ];array.unshift('0' ,'6' ); console .log(array);
4.shift()方法用于把数组的第一个元素从其中删除,并返回第一个元素的值
语法:array.shift()
1 2 3 var array = ['1' ,'2' ];array.shift(); console .log(array);
5.sort()方法用于对数组的元素进行排序
语法:array.sort(sortfunction)
参数:sortfunction 可选。规定排序顺序。必须是函数。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 var array = ['2' ,'1' ,'4' ]; array.sort(); console .log(array); var array = ['2' ,'1' ,'4' ]; array.sort(function (a,b ) { return a - b }); console .log(array); var array = ['2' ,'1' ,'4' ]; array.sort(function (a,b ) { return b - a }); console .log(array);
6.reverse() 方法用于颠倒数组中元素的顺序
语法:array.reverse()
1 2 3 var array = ['2' ,'1' ,'4' ]; array.reverse() console .log(array);
7.splice() 方法用于添加或删除数组中的元素
语法:array.splice(index,howmany,item1,…,itemX)
参数:index 必需。规定从何处添加/删除元素。该参数是开始插入和(或)删除的数组元素的下标,必须是数字。(如果有第三个参数就是添加元素,如果没有就是删除元素)
howmany :可选。规定应该删除多少元素。必须是数字,但可以是 “0”。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX :可选。要添加到数组的新元素
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 var array = ['2' ,'1' ,'4' ,'5' ]; array.splice(2 ); console .log(array); var array = ['2' ,'1' ,'4' ,'5' ]; array.splice(0 ,3 ); console .log(array); array.splice(1 ,2 ); var array = ['1' ,'2' ,'3' ,'4' ];array.splice(1 ,0 ,'xiaoming' ); console .log(array);var array = ['1' ,'2' ,'3' ,'4' ];array.splice(1 ,1 ,'xiaoming' ); console .log(array);var array = ['1' ,'2' ,'3' ,'4' ];array.splice(1 ,2 ,'xiaoming' ); console .log(array);
8.copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中
语法:array.copyWithin(target, start, end)
参数:target 必需。复制到指定目标索引位置。
start 可选。元素复制的起始位置。
end 可选。停止复制的索引位置 (默认为 array.length)。如果为负值,表示倒数。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 var array = ['1' ,'2' ,'3' ,'4' ];array.copyWithin(2 ); console .log(array);var array = ['1' ,'2' ,'3' ,'4' ];array.copyWithin(2 ,1 ); console .log(array);var array = ['1' ,'2' ,'3' ,'4' ,'5' ];array.copyWithin(2 ,1 ,3 ); console .log(array);
9.concat() 方法用于连接两个或多个数组
语法:array1.concat(array2,array3,…,arrayX)
注意⚠️:不会改变原数组
1 2 3 4 5 var array1 = ['1' ,'2' ];var array2 = ['3' ,'4' ];var array3 = ['5' ,'6' ];var arrayBox = array1.concat(array2,array3)console .log(arrayBox)
10.entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)
语法:array.entries()
1 2 3 4 5 var array = ['xiaoming' ,'lisi' ,'zhangsan' ];var x = array.entries();console .log(x.next().value); console .log(x.next().value); console .log(x.next().value);
11.every() 方法用于检测数组所有元素是否都符合指定条件(通过函数提供)
语法:array.every(function(currentValue,index,arr), thisValue)
参数:function(currentValue,index,arr){}
currentValue :必须。当前元素的值
index :可选。当前元素的索引值
arr 可选。当前元素属于的数组对象
every() 方法使用指定函数检测数组中的所有元素:
如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
如果所有元素都满足条件,则返回 true。
1 2 3 4 5 var array = ['1' ,'2' ,'3' ,'4' ,'5' ,'6' ];var ArrBox = array.every(function (currentValue,index,arr ) { return currentValue > 5 }) console .log(ArrBox);
12.fill() 方法用于将一个固定值替换数组的元素
语法:array.fill(value, start, end)
参数:value 必需。填充的值。
start 可选。开始填充位置。
end 可选。停止填充位置 (默认为 array.length)
1 2 3 4 5 6 7 8 9 var array = ['1' ,'2' ,'3' ,'4' ];array.fill('6' ); console .log(array);var array = ['1' ,'2' ,'3' ,'4' ];array.fill('6' ,1 ,3 ); console .log(array);
13.filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素
语法:array.filter(function(currentValue,index,arr), thisValue) 同11
1 2 3 4 5 var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.filter(function (currentValue ) { return currentValue > 2 }) console .log(ArrBox);
14.find() 方法返回通过测试(函数内判断)的数组的第一个元素的
语法:array.find(function(currentValue, index, arr),thisValue) 同11
1 2 3 4 5 var array = ['6' ,'9' ,'18' ,'20' ];var ArrBox = array.find(function (currentValue ) { return currentValue >= 18 }) console .log(ArrBox);
15.findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置
语法:array.findIndex(function(currentValue, index, arr), thisValue) 同11
1 2 3 4 5 var array = ['1' ,'2' ,'3' ];var ArrBox = array.findIndex(function (currentValue ) { return currentValue > 2 }) console .log(ArrBox);
16.forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数
语法:array.forEach(function(currentValue, index, arr), thisValue) 同11
1 2 3 4 5 6 7 8 var array = ['1' ,'2' ,'3' ,'4' ];array.forEach(function (currentValue, index, arr ) { console .log(currentValue, index, arr); })
17.from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组
语法:Array.from(object, mapFunction, thisValue)
参数:object :必需,要转换为数组的对象。
mapFunction :可选,数组中每个元素要调用的函数。
thisValue 可选,映射函数(mapFunction)中的 this 对象。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 var array = Array .from('xiaoming' );console .log(array);var array = Array .from([1 ,2 ,3 ],function (x ) { return x * 10 }) console .log(array);function f ( ) { console .log(arguments ); console .log(Array .from(arguments )); } f(1 , 2 , 3 );
18.includes() 方法用来判断一个数组是否包含一个指定的值,如果是返回 true,否则false
语法:arr.includes(searchElement, fromIndex)
参数:searchElement 必须。需要查找的元素值。
fromIndex 可选。从该索引处开始查找 searchElement。如果为负值,则按升序从 array.length + fromIndex 的索引开始搜索。默认为 0。
1 2 3 4 5 6 7 8 9 var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.includes('2' );console .log(array);var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.includes('2' ,2 );console .log(array);
19.indexOf() 方法可返回数组中某个指定的元素位置,如果在数组中没找到指定元素则返回 -1
语法:array.indexOf(item,start)
参数:item 必须。查找的元素。
start 可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的首字符开始检索。
1 2 3 4 5 6 7 8 var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.indexOf('1' );console .log(ArrBox);var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.indexOf('1' ,1 );console .log(ArrBox);
20.isArray() 方法用于判断一个对象是否为数组,如果对象是数组返回 true,否则返回 false
语法:Array.isArray(obj)
参数:obj :必须。要判断的对象。
1 2 3 4 var array1 = ['1' ,'2' ,'3' ];var array2 = {name :'xiaoming' ,age :18 };console .log(Array .isArray(array1));console .log(Array .isArray(array2));
21.join() 方法用于把数组中的所有元素转换一个字符串,元素是通过指定的分隔符进行分隔的,返回值是一个字符串
语法:array.join(separator)
参数:separator 可选。指定要使用的分隔符。如果省略该参数,则使用逗号作为分隔符。
1 2 3 var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.join('--' );console .log(ArrBox);
22.keys() 方法用于从数组创建一个包含数组键的可迭代对象,如果对象是数组返回 true,否则返回 false
语法:array.keys()
iterable :一个具有可枚举属性并且可以迭代的对象。
for…of 语句创建一个循环来迭代可迭代的对象
1 2 3 4 5 6 var array = ['a' ,'b' ,'c' ,'d' ];var ArrBox = array.keys();console .log(ArrBox);for (key of ArrBox){ console .log(key); };
23.lastIndexOf() 方法可返回一个指定的元素在数组中最后出现的位置,从该字符串的后面向前查找。如果要检索的元素没有出现,则该方法返回 -1
语法:array.lastIndexOf(item,start)
参数:item 必需。规定需检索的字符串值。
start 可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数,则将从字符串的最后一个字符处开始检索。
1 2 3 4 5 6 7 8 var array = ['1' ,'2' ,'3' ,'2' ];var ArrBox = array.lastIndexOf('2' );console .log(ArrBox);var array = ['1' ,'2' ,'3' ,'2' ];var ArrBox = array.lastIndexOf('2' ,array.length - 2 );console .log(ArrBox);
24.map() 方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组元素顺序依次处理元素
语法:array.map(function(currentValue,index,arr), thisValue) 同11
1 2 3 4 5 var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.map(function (currentValue ) { return currentValue * 10 }); console .log(ArrBox);
25.reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值
语法:array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
参数:function(total,currentValue, index,arr) 必需。用于执行每个数组元素的函数。
参数 描述
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
initialValue 可选。传递给函数的初始值
1 2 3 4 5 6 7 8 9 10 var array = [1 ,2 ,3 ,4 ];var ArrBox = array.reduce(function (total,currentValue ) { console .log(total,currentValue); return total + currentValue },0 ); console .log(ArrBox);
26.reduceRight() 方法的功能和 reduce() 功能是一样的,不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加
语法:同上
1 2 3 4 5 6 7 8 9 10 var array = [1 ,2 ,3 ,4 ];var ArrBox = array.reduceRight(function (total,currentValue ) { console .log(total,currentValue); return total - currentValue }); console .log(ArrBox);
27.slice() 方法可从已有的数组中返回选定的元素
语法:array.slice(start, end)
参数:
start 可选。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。
end 可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。
1 2 3 4 5 6 var array = [1 ,2 ,3 ,4 ];console .log(array.slice(1 ));console .log(array.slice(-2 ));console .log(array.slice(1 ,2 ));console .log(array.slice(-2 ,-1 ));
28.some() 方法用于检测数组中的元素是否满足指定条件(函数提供)
如果有一个元素满足就会返回ture,剩下的不会在进行检测。没有满足的返回false
语法:array.some(function(currentValue,index,arr),thisValue) 同11
1 2 3 4 5 var array = [1 ,2 ,3 ,4 ];var ArrBox = array.some(function (currentValue ) { return currentValue > 2 }); console .log(ArrBox);
29.toString() 方法可把数组转换为字符串,并返回结果,数组的所有值用逗号隔开
语法:array.toString()
1 2 3 var array = ['1' ,'2' ,'3' ,'4' ];var ArrBox = array.toString();console .log(ArrBox);
30.valueOf() 方法返回 Array 对象的原始值
语法:array.valueOf()
Array:返回数组对象本身。
Boolean: 返回布尔值
Date:存储的时间是从 1970 年 1 月 1 日午夜开始计的毫秒数 UTC。
Function: 返回函数本身。
Number: 返回数字值。
Object:返回对象本身。这是默认情况。
String:返回字符串值。
Math 和 Error 对象没有 valueOf 方法。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 var array = ['xiaoming' ,'1' ,'2' ];console .log(array.valueOf() == array);var boolean = true console .log(boolean.valueOf() == boolean);var newBool = new Boolean (true ); newBool.valueOf() console .log(newBool.valueOf() == newBool); console .log(newBool.valueOf() === newBool); var date = new Date (2021 , 11 , 2 , 13 , 04 , 59 , 230 );console .log(date.valueOf());var function = function foo ( ) {} ;console .log(function .valueOf() == function ) ;var number = 5 ; console .log(number.valueOf() == number ); var object = {name : "张三" , age : 18 };console .log(object.valueOf() == object);var string = 'xiaoming' ;console .log(string.valueOf() == string);
三、数组去重的方法
1.利用ES6中的 Set 方法去重
1 2 3 4 5 6 7 8 9 let arr = [1 ,2 ,3 ,4 ,1 ,2 ];let set1 = new Set (arr);console .log(set1);let newArr1 = Array .from(set1); console .log(newArr1);let newArr2 = [...set1];console .log(newArr2);
2.双层for循环去重
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 var arr = [1 ,2 ,3 ,4 ,1 ,2 ]; for (var i = 0 ;i<arr.length;i++){ for (var j = i+1 ;j<arr.length;j++){ console .log(arr[i],arr[j]); if (arr[i] == arr[j]) { arr.splice(i,1 ); i--; j--; } } } console .log(arr);
3.利用数组的indexOf方法去重
1 2 3 4 5 6 7 8 let arr = [4 ,5 ,6 ,2 ,3 ,2 ,4 ,5 ]; let newArr = [] for (var i=0 ;i<arr.length;i++) { if (newArr.indexOf(arr[i]) == -1 ) { newArr.push(arr[i]); } } console .log(newArr);
4.利用数组的includes方法去重
1 2 3 4 5 6 7 8 let arr = [4 ,5 ,6 ,2 ,3 ,2 ,4 ,5 ];let newArr = []for (var i=0 ;i<arr.length;i++) { if (!newArr.includes(arr[i])){ newArr.push(arr[i]) } } console .log(newArr);
5.利用数组的filter方法去重
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 let arr = [4 ,5 ,6 ,2 ,3 ,2 ,4 ,5 ]; let newArr = arr.filter(function (item,index ) { console .log(arr.indexOf(item,0 ),index); return arr.indexOf(item,0 ) === index }) console .log(newArr);/[4 , 5 , 6 , 2 , 3 ]
如果您喜欢此博客或发现它对您有用,则欢迎对此发表评论。 也欢迎您共享此博客,以便更多人可以参与。 如果博客中使用的图像侵犯了您的版权,请与作者联系以将其删除。 谢谢 !