前言:说到js中的数组就要提到js的数据类型了,js数据类型分为基本数据类型和复合数据类型,基本数据类型包括:字符串,数值,布尔,null,undefined,Symbol,复合数据类型包括:对象(数组(Array),对象(object),函数(function)),还有两个特殊的对象正则和日期
1、初始化(定义数组)
1、var array = [];
2、var array = new.Array();
2、数组的静态属性
1. length:获取数组长度
var arr = [1,2,3];
console.log(arr.length)//3;
3、数组的静态函数
1、Array.isArray():判断是否是数组
var arr = [1,2,3]
console.log(Array.isArray(arr));//true
2、Array.of():将一组数据转换为数组
var a = 1,b = 2;
console.log(Array.of(a,b))[1,2]
3、Array.from():将类似数组或可迭代对象转换成数组
#列如arguments:获取函数全部参数,是类似数组
function arr(){
console.log(arguments);
console.log(Array.from(arguments));//将arguments转换成数组
}
arr(1,2,3)
#该函数执行返回:
Arguments(3) [1, 2, 3, callee: ƒ, Symbol(Symbol.iterator): ƒ]
[1,2,3]
4、数组的删除和增加
1、push():在数组尾部插入一个或多个元素
var arr = [1,2,3];
arr.push(1);
console.log(arr)//[1,2,3,1];
2、pop():在数组尾部删除元素
var arr = [1,2,3];
arr.pop();
console.log(arr)//[1,2];
3、unshift():在数组头部插入一个或多个元素
var arr = [1,2,3];
arr.unshift(1);
console.log(arr)//[1,2,3,1];
4、shift():在数组头部删除元素
var arr = [1,2,3];
arr.shift();
console.log(arr)//[1,2];
5、splice():该方法既能添加元素,又能删除元素
#添加元素
#数组.splice(index,0,val,val1,val2...),index是下标,val是新增的元素,即:从index位置添加n个元素
var arr = [1,2,3];
arr.splice(1,0,'a',1,2);
console.log(arr)//[1, 'a', 1, 2, 2, 3];
#删除元素
#数组.splice(index,n),index是下标,n是删除的元素个数,即:从index位置删除n个元素
var arr1 = [1,2,3];
arr1.splice(1,1);
console.log(arr1);//[1,3]
#即删除又添加
#数组.splice(index,n,val,val1,val2...),index是下标,n是删除元素的个数,val是新增的元素,即:从index位置开始删除n个元素,在添加元素
var arr2 = [1,2,3,4,5];
arr2.splice(1,2,'a',1,2);
console.log(arr2)//[1, 'a', 1, 2, 4, 5];
5、数组转换字符串
join():数组转换字符串
var arr = [1,2,3];
var str = arr.join();
console.log(typeof str);//string
6、数组中元素位置的查找
1、indexOf()/lastindexOf() 从前/后开始查找,存在返回下标,否则返回-1
var arr = [1,2,3];
console.log(arr.indexOf(1));//0
//console.log(arr.lastindexOf(1));//0
console.log(arr.indexOf(5));//-1
//console.log(arr.lastindexOf(5));//-1
2、includes(),元素存在返回true,否则false
var arr = [1,2,3];
console.log(arr.includes(1));//true
console.log(arr.includes(5));//false
3、find:传递一个匿名函数,存在返回第一个值,否则返回-1
var arr = [1,2,3,3];
var a = arr.find(function(item){
return item > 2;
})
//箭头函数书写
//var a = arr.find((item)=>{
// return item > 2;
//})
console.log(a);//3;
var b = arr.find(function(item){
return item > 4;
})
console.log(a);//-1;
4、findindex():传递一个匿名函数,存在返回下标,否则返回-1
var arr = [1,2,3,3];
var a = arr.findindex(function(item){
return item > 2;
})
console.log(a)//2(下标)
7、截取数组
slice():截取数组有四种使用方式
#第一种slice(index):从下标index位置截取到末尾
var arr = [1,2,3,4];
var a = arr.slice(1);
console.log(a)//[2,3,4]
#第二种slice(index,end):从下标index位置截取到end,但不包括end
var arr = [1,2,3,4];
var a = arr.slice(1,3);
console.log(a)//[2,3]
#第三种slice()截取整个数组
var arr = [1,2,3,4];
var a = arr.slice();
console.log(a)//[1,2,3,4]
#slice(-1):可以传递负值
var arr = [1,2,3,4];
var a = arr.slice(-1);
console.log(a)//[4]
8、数组排序
sort():三种排序方法
#第一种sort()默认使用ASCII排序
var arr = [1,3,2,4]
var b = arr.sort()
console.log(b)//[1,2,3,4]
#第二种正序传入匿名函数,返回a - b
var arr = [1,3,2];
var b = arr.sort((a,b)=>{
return a - b});
console.log(b)//[1,2,3]
#第三种逆序排序传入匿名函数,返回b - a
var arr = [1,3,2];
var b = arr.sort((a,b)=>{
return b - a});
console.log(b)//[3,2,1]
reverse():反转
var arr = [1,3,2];
var b = arr.reverse();
console.log(b);//[2,3,1]
9、数组的循环函数(item 循环的元素,index:下标)
1、foreach():循环数组
var arr = [1,2,3];
arr.forEach((item,index)=>{
consoloe.log(item);//1 2 3
})
2、some():只要有一个元素满足条件,就返回true,否则false
var arr = [1,2,3];
var istrue = arr.some((item)=>{
return item > 3;
})
console.log(istrue)//false;
3、every():当所有元素全都满足条件,返回true,否则false
var arr = [1,2,3,4]
var istrue = arr.every((item)=>{
return item > 3;
})
console.log(istrue)//false;
4、map():返回计算操作过后的元素,组成的新数组
var arr = [1,2,3,4];
var arr1 = arr.map((item)=>{
return item+2;
});
console.log(arr1);//[3,4,5,6]
5、filter():返回满足条件的元素组成的新数组
var arr = [1,2,3,4];
var arr1 = arr.filter((item)=>{
return item > 2;
});
console.log(arr1);//[3,4]
10、数组合并以及复制
1、合并数组:concat()和 ...
#...不仅可以合并复制数组,对象同样也可以
(...是es6中的扩展运算符)
var arr = [1,2,3];
var arr1 = [4,5,6];
#使用concat()合并数组
var arr3 = arr.concat(arr1);
console.log(arr3)//[1,2,3,4,5,6];
#使用...合并数组
var arr4 = [...arr, ...arr1]
console.log(arr4)//[1,2,3,4,5,6];
2、复制数组
var arr = [1,2,3];
var arr1 = [...arr];
console.log(arr1)//[1,2,3];
11、填充和替换
通过fill()函数
注:该函数传递三个参数,第一个参数为填充内容,第二个参数开始的下标,第三个参数结束的下标
var arr = [1,2,3];
var a = arr.fill('a',1,2)//从下标 1 开始到下标 2 的内容替换为‘a’
console.log(a)//[1,'a',2]
12、flat()
将多维数组转换为一维数组括号内填多维数组的维数-1, 如果不知是几维数组,就填99
var arr = [1,2,3,[3,4]]
var a = arr.flat(1);//维数为2减-1=1
console.log(a)//[1,2,3,3,4]
concole.log(arr.flat(99))//[1,2,3,3,4]
13、reduce()
1、计算元素出现的次数,第一个是匿名函数,第二个是返回的格式,
var arr = [1,2,3,3];
var a = arr.reduce((pre,next)=>{
//next:表示下一个值,pre:返回的格式
if (next in pre){
pre[next]++;
}else{
pre[next] = 1
}
return pre
},{
})
console.log(a);//{1: 1, 2: 1, 3: 2}
2、计算元素总和
var arr = [1,2,3,3];
var a = arr.reduce((pre,next)=>{
return pre+=next
})
console.log(a);//9
14、稀疏数组
数组可以是不连贯的,访问未定的元素是返回的是undefined
let arr = [1,2,3];
arr[101] = 101;
console.log(arr[99])//undefined
总结:
该篇文章主要介绍的是js中Array数组的一些常用参数,属性,以及数组函数