什么是数组?
数组就是值的有序集合
数组中的每一个值都可以称为一个数组的组成元素
同时每一个元素在数组中都有自己的位置,以数字表示,叫做索引,索引从0开始依次增加.
数组中的元素可以是任何数据类型.
数组中有一个特有的属性length,表示数组的长度.
创建数组的方式
var arr = [1,2,3,4,5,6]
//使用字面量方式创建
var Arr = new Array(1,2,3,4,5,6)
//通过构造函数方式创造Array类的实例
//两种方式创造出的数组是一样的
数组的取值
let arr = [1,2,3,4,5,6]
console.log(arr[0])
//使用 数组[元素索引] 拿到数组的值 这里拿到的值是1
console.log(arr.length)
//这样可以获得数组的长度
arr[length] = 7
//在数组后面增加一项 数组的长度会比数组索引+1 因为数组索引是从0开始 而长度是从1开始计算 所以这样想当于在数组末尾添加一个新属性
多维数组
let ary = [
[1,2,3,4,5,6],
[7,8,9,10,11],
[12,13,14,15],
[16,17,18,19],
];
//多维数组的取值
cosole.log(ary[1][5])//此处打印数字 6
数组的迭代、遍历
let ary = [1,2,3,4,5,6];
/*for循环 常用的数组迭代方法*/
for(var i= 0; i < ary.length; i++){
console.log(ary[i])//循环打印数组中的每一项javascript数组介绍以及数组常用方法
}
/*for in 也可以用来循环对象*/
for(var i in ary){
console.log(ary[i])
}
数组的常用方法
1.push()
/*
作用:向数组末尾追加数据
参数:要添加的项,可以是一个,也可以是多个
返回值:新数组的长度
是否改变原数组:会改变原数组*/
let ary = [1,2,3];
ary.push(4)
console.log(ary)//打印出[1,2,3,4]
2.pop()
/*
作用:删除数组最后一项
参数:无
返回值:被删除的项
是否改变原数组:改变
*/
let ary = [red,pink,blue];
ary.pop()
console.log(ary)//打印出[red,pink]
3.shift()
/*
作用:删除数组第一项
参数:无
返回值:被删除的项
是否改变原数组:改变
*/
let ary = [red,pink,blue];
ary.shift()
console.log(ary)//打印出[pink,blue]
4.unshift()
/*
作用:在数组开头添加数据
参数:要添加的项,可以是多项
返回值:新数组的长度
是否改变原数组:改变
*/
let ary = [red,pink,blue];
ary.unshift('green','purple')
console.log(ary)//打印出[green,purple,red,pink,blue]
5.reverse()
/*
作用:将数组倒序排列
参数:无
返回值:排序后的新数组
是否改变原数组:改变
*/
let ary = [1,2,3];
ary.reverse()
console.log(ary)//打印出[3,2,1]
6.sort()
/*
作用:对数组进行排序
参数:无或是一个函数
返回值:排序后的数组
是否改变原数组:改变
*/
let ary = [5,6,8,7,2,9,1,4,3];
//不传参的情况下只能对十以内的数组进行排序
ary.sort()
console.log(ary)//打印出[1,2,3,4,5,6,7,8,9]
//超过10的排序需要传参
let arr = [22,66,88,99,100];
arr.sort((a,b)=>{
return a-b //升序
return b-a //降序
//b代表数组中的第一项,依次向后移动,a始终代表b后面一项,两两比对
})
7.splice()
/*
作用:增删改一体化
参数:splice(n,m,...x)
返回值:删除的项
是否改变原数组:改变
*/
//@1 删除
let ary = [1,2,3,4,5,6];
ary.splice(1,1)//删除需要两个参数,第一个为从数组索引,表示从何处开始删除,第二个参数表示删除几个
console.log(ary)//此处打印[1,3,4,5,6]
//@2 增加
let ary = [1,2,3,4,5,6];
ary.splice(0,0,7,8,9)
//增加需要三个参数,第一个为从数组索引,表示从何处开始增加(在该索引的前面增加),第二个参数表示删除几个
//第三个参数为要增加的项,可以是多项.
console.log(ary);//此处打印[7, 8, 9, 1, 2, 3, 4, 5, 6]
//@3 修改
let ary = [1,2,3,4,5,6];
ary.splice(0,3,7,8,9)
//增加需要三个参数,第一个为从数组索引,表示从何处开始修改(在该索引的前面修改),第二个参数表示删除几个
//第三个参数为要修改的项,可以是多项,可以与删除的个数不一样
console.log(ary);//此处打印[7, 8, 9, 4, 5, 6]
8.slice()
/*
作用:截取数组内容
参数:可以是一个或两个
返回值:截取的内容
是否改变原数组:不改变
*/
let ary = [1,2,3,4,5,6,7,8,9]
//@1 一个参数 会从该参数开始截取到数组末尾
ary.slice(2)
console.log(ary)//此处打印 [3,4,5,6,7,8,9]
//@2 两个参数 splice(n,m) 会从n开始截取到m 包含n不包含m
ary.slice(2,5)//从索引2开始到索引5结束 不包含索引5的值
console.log(ary)//此处打印 [3,4,5]
//@3 如果参数中有负值 则会用数组长度加上这个值在进行截取
ary.slice(-5,-1)//相当于slice(4,8)
console.log(ary)//此处打印 [5,6,7,8]
//@4 如果结束位置的值小于开始的值 则会返回空数组
ary.slice(1,-1)
console.log(ary)//此处打印 []
//
9.concat()
/*
作用:数组拼接
参数:要进行拼接的数组或者值
返回值:拼接后的新数组
是否改变原数组:不改变
*/
let ary = [1,2,3,4];
let ary1 = [5,6,7,8];
let res = ary.concat(ary1,'pink','blue');
console.log(res)//此处打印[1,2,3,4,5,6,7,8,'pink','blue']
10.toString()
/*
作用:将数组转为字符串
参数:无
返回值:转为字符串后的数组
是否改变原数组:不改变
*/
let ary = [88,{a:1},null,undefined,[],66]
let res = ary.toString()
console.log(res)//此处打印88,[object,object],,,,66 //null undefined []会被转为空字符串
11.join()
/*
作用:将数组内容用指定连接符连接起来
参数:连接符
返回值:拼接后的字符串
是否改变原数组:不改变
*/
let ary = [1,2,3,4,5,6];
let res = ary.join("-_-");
console.log(res)//此处打印 1 -_- 2 -_- 3 -_- 4 -_- 5 -_- 6
12.indexOf/lastindexOf
/*
作用:获取某项在数组中首次出现/最后出现的索引(也可以用来检查是否包含某项值)
参数:(n,m) n:检测的项 m:如果是indexOf 的话,就是从索引m开始检索。如果是lastIndexOf 的话,就是从索引m停止检索
返回值:-1或具体的索引值 -1表示没有这一项
是否改变原数组:不改变
*/
let ary = [1,2,3,4,5,6,7,8,1];
let res= ary.indexOf(1)
console.log(res)//此处打印0
let res= ary.indexOf(1,2)
console.log(res)//此处打印6 //从索引2开始 索引会从0开始递增
// 检测1这个项目在数组中最后一次出现的索引
let res = ary.lastIndexOf(1);
console.log(res)//此处打印8
// 检测1这个项目在数组中最后出现的索引,在索引5的位置停止检测
let res= ary.lastIndexOf(1,5)
console.log(res)//此处打印-1 因为只检测到索引5的位置 没有找到就会返回-1
13.includes()
/*
作用:检测数组中是否包含某一项
参数:要检测项
返回值:布尔值
是否改变原数组:不改变
*/
let arr = [1,2,3,4,5,6,7,8,9];
let res = arr.includes(2);
console.log(res)//此处打印true
let res = arr.includes(10);
console.log(res)//此处打印false
14.flat()
/*
作用:将多维数组进行降维
参数:需要将的位数或者Infinity
返回值:降维后的数组
是否改变原数组:否
*/
let arr = [
[1, 2, 3, 4],
[5, 6, 7, 8, 9],
[10, 11, 12, [13, 14, 15, 16]]
]
console.log(arr.flat(1));//将数组降低一维
console.log(arr);
15.filter()
/*
作用:数组过滤
参数:回调函数
返回值:过滤后的数组
*/
let arr1 = [1, 1, 1, 2, 2, 2, 3, 3, 3, 4, 4, 4, 4],
res15 = arr1.filter(item => item != 1);
console.log(res15);//打印出[2, 2, 2, 3, 3, 3, 4, 4, 4, 4]
数组的迭代
forEach循环
/*
作用:循环数组每一项
参数:函数
返回值:undefined
是否改变原数组:否
*/
let ary =['pink','blue','red'];
ary.forEach((item,index)=>{//此处item index 可以自定义
console.log(item)//会打印数组每一项
console.log(index)//会打印每一项的索引
})
map
/*
作用:映射出一个新数组
参数:函数
返回值:映射后的新数组
是否改变原数组:否
*/
let ary = [14,15,16,17,18,19];
let ary1 = ary.map((item,index,arr)=>{
return item+1 //将数组每一项加一
})
console.log(ary1)//此处打印[15,16,17,18,19,20]
数组去重
/*
利用Set函数去重,set是ES6新增的一种数据结构,类似于数组。但是他的成员值是唯一的,可以利用这一点进行数组去重。
*/
let arr1 = [1, 1, 1, 2, 2, 2, 3, 3, 3, 4, 4, 4, 4],
res15 = new Set(arr1)
console.log(...res15); //打印出1 2 3 4