目录
一、简介
1、什么是数组?
2、创建数组
3、数组的数据类型
4、向数组中添加元素
5、读取数组中的元素
6、实例属性:length
二、遍历数组
方式一:for循环
方式二:for...of
三、数组方法(常用)
Array.isArray()
.push(value1,value2...)
.pop()
.unshift(value1,value2...)
.shift()
.splice(startIndex,number,value)
.reverse()
数组去重方法
.at(index)
.concat(arr1, arr2, ...)
.indexOf(value, index)
.lastIndexOf(value, index)
.join("str")
.slice(startIndex,endIndex)
一、简介
1、什么是数组?
- 数组是一种复合数据类型,在数组可以存储多个不同类型的数据。
- 数组中存储的是有序的数据,数组中的每个数据都有一个唯一的索引。
- 数组可以通过索引来操作获取数据。
- 数组中存储的数据叫做元素。
- 数组的索引(index)是一组大于0的整数。
2、创建数组
方式一:通过Array()来创建数组
const arr = new Array()
方式二:通过[]来创建数组
const arr = []
3、数组的数据类型
数组的数据类型是对象
const arr = [1, 2, 3, 4, 5] console.log(typeof arr) // object
4、向数组中添加元素
语法:数组[索引] = 元素
5、读取数组中的元素
语法:数组[索引]
PS:如果读取了一个不存在的元素,不会报错而是返回undefined
6、实例属性:length
作用:获取数组的长度。获取的实际值就是数组的最大索引 + 1
向数组最后添加元素:数组[数组.length] = 元素
const arr = [1, 2, 3, 4, 5] arr[arr.length] = 6console.log(arr) // [1, 2, 3, 4, 5, 6]
数组的length是可以修改的:
const arr = [1, 2, 3, 4, 5, 6, 7]arr.length = 5
console.log(arr) // [1, 2, 3, 4, 5]arr.length = 10
console.log(arr) // [1, 2, 3, 4, 5, 6, 7, empty*3]
二、遍历数组
简单理解,就是获取到数组中的每一个元素
方式一:for循环
arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧", "白骨精"]// 正序遍历
for(let i=0; i<arr.length; i++){console.log(arr[i])
}// 倒序遍历
for (let i = arr.length - 1; i >= 0; i--) {console.log(arr[i])
}
方式二:for...of
语法:
for(变量 of 可迭代的对象){语句...
}
执行流程: for-of的循环体会执行多次,数组中有几个元素就会执行几次,每次执行时都会将一个元素赋值给变量value。value可以替换成其他单词。
const arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧"]for(let value of arr){console.log(value)
}// 孙悟空
// 猪八戒
// 沙和尚
// 唐僧
三、数组方法(常用)
方法查询:Array - JavaScript | MDN (mozilla.org)
------------------------------------------ 静态方法----------------------------------------------
Array.isArray()
作用:用来检查一个对象是否是数组。静态方法。
console.log(Array.isArray({ name: "孙悟空" })) // falseconsole.log(Array.isArray([1, 2, 3])) // true
------------------------------------------ 实例方法(破坏性方法)----------------------------------------------
【破坏性方法,会影响原数组,在原数组上修改】
.push(value1,value2...)
作用:向数组的末尾添加一个或多个元素,并返回新的长度
参数:value=添加的元素
返回值:新的数组,新的长度
let arr = ["孙悟空", "猪八戒", "沙和尚"]
let result = arr.push("唐僧", "白骨精")
console.log(arr) // ["孙悟空", "猪八戒", "沙和尚", "唐僧", "白骨精"]
console.log(result) // 5
.pop()
作用:删除并返回数组的最后一个元素
参数:无
返回值:数组的最后一个元素
let arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧", "白骨精"]
let result = arr.pop()
console.log(arr) // ["孙悟空", "猪八戒", "沙和尚", "唐僧"]
console.log(result) // 白骨精
.unshift(value1,value2...)
作用:向数组的开头添加一个或多个元素,并返回新的长度
参数:value=添加的元素
返回值:新的数组,新的长度
let arr = ["孙悟空", "猪八戒", "沙和尚"]result = arr.unshift("牛魔王")console.log(arr) // ["牛魔王","孙悟空", "猪八戒", "沙和尚"]console.log(result) // 4
.shift()
作用:删除并返回数组的第一个元素
参数:无
返回值:数组的第一一个元素
let arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧"]result = arr.shift() console.log(arr) // ["猪八戒", "沙和尚", "唐僧"]console.log(result) // 孙悟空
.splice(startIndex,number,value)
作用:可以删除、插入、替换数组中的元素
参数:startIndex=删除的起始位置, number=删除的元素数量,value=要插入的元素(插在被删除的元素原来的地方)。当number=0时,表示在startIndex之前插入value,且若startIndex>=arr.length,value都会在数组最后插入,不会补充empty占位
返回值:返回被删除的元素
let arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧"]let result = arr.splice(1, 3)
console.log(result) // ["猪八戒", "沙和尚", "唐僧"]
console.log(arr) // ["孙悟空"]result = arr.splice(1, 1, "牛魔王", "铁扇公主", "红孩儿")
console.log(result) // 猪八戒
console.log(arr) // ["孙悟空", "牛魔王", "铁扇公主", "红孩儿", "沙和尚", "唐僧"]result = arr.splice(1, 0, "牛魔王", "铁扇公主", "红孩儿")
console.log(arr) // ["孙悟空", "猪八戒", "牛魔王", "铁扇公主", "红孩儿", "沙和尚", "唐僧"]
.reverse()
作用:反转数组
参数:无
返回值:新数组
let arr = ["a", "b", "c", "d"]arr.reverse()console.log(arr) // ["d", "c", "b", "a"]
数组去重方法
方法一:(在原数组操作)将第一个元素取出,从第二个位置开始依次向后比,不一样的元素留下,一样的元素删掉;将第二个元素取出,从第三个位置开始依次向后比,不一样的元素留下,一样的元素删掉.....重复以上操作
const arr = [1, 2, 1, 3, 2, 2, 4, 5, 5, 6, 7]// 版本一
// 分别获取数组中的元素
for (let i = 0; i < arr.length; i++) {// 获取当前值后边的所有值for (let j = i + 1; j < arr.length; j++) {// 判断两个数是否相等if (arr[i] === arr[j]) {// 出现了重复元素,删除后边的元素arr.splice(j, 1);j--; // **重要**//当arr[i] 和 arr[j]相同时,它会自动的删除j位置的元素,//然后j+1位置的元素,会变成j位置的元素,而j位置已经比较过了,//不会重复比较,所以会出现漏比较的情况.//解决办法,当删除一个元素后,需要将该位置的元素在比较一遍}}
}console.log(arr)// 版本二
// 获取数组中的元素
for(let i=0; i<arr.length; i++){const index = arr.indexOf(arr[i], i+1)if(index !== -1){// 出现重复内容arr.splice(index, 1)i--}
}
console.log(arr)
方法二:(在新数组操作)
const newArr = []for(let ele of arr){if(newArr.indexOf(ele) === -1){newArr.push(ele)}
}console.log(newArr)
------------------------------------------ 实例方法(非破坏性方法)----------------------------------------------
【非破坏性方法,不会影响原数组,而是返回一个新的数组。】
.at(index)
作用:可以根据索引获取数组中的指定元素。可以接收负索引作为参数,表示从数组尾部开始获取。
参数:需要获取的元素的索引
返回值:需要获取的元素
const arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧"]console.log(arr.at(-2)) // 沙和尚console.log(arr[arr.length - 2]) // 沙和尚
.concat(arr1, arr2, ...)
作用:用来连接两个或多个数组。
参数:需要拼接的数组
返回值:连接的新数组
const arr2 = ["白骨精", "蜘蛛精", "玉兔精"]let result = arr.concat(arr2, ["牛魔王","铁扇公主"])console.log(result) // ["白骨精", "蜘蛛精", "玉兔精", "牛魔王","铁扇公主"]
.indexOf(value, index)
作用:获取元素在数组中第一次出现的索引
参数:value=要查询的元素,index=查询的起始位置
返回值:找到了则返回元素的索引
let arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧", "沙和尚"]let result = arr.indexOf("沙和尚", 3)console.log(result) // 2
.lastIndexOf(value, index)
作用:获取元素在数组中最后一次出现的位置
参数:value=要查询的元素,index=查询的起始位置(从数组尾部向前查询)
返回值:找到了则返回元素的索引,没有找到返回-1
let arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧", "沙和尚"]let result = arr.lastIndexOf("沙和尚", 3)console.log(result) // 2
.join("str")
作用:将一个数组中的元素连接为一个字符串
参数:str=数组元素间进行连接的字符,如果不需要字符连接,str则为空串""
返回值:连接后的字符串
let arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧", "沙和尚"]result = arr.join("@-@")
console.log(result) // 孙悟空@-@猪八戒@-@沙和尚@-@唐僧@-@沙和尚@-@result = arr.join("")
console.log(result) // 孙悟空猪八戒沙和尚唐僧沙和尚
.slice(startIndex,endIndex)
作用:用来截取数组。
参数:startIndex=截取的起始位置(包括该位置),endIndex=截取的结束位置(不包括该位置)。第二个参数可以省略不写,如果省略则会一直截取到最后。索引可以是负值。如果将两个参数全都省略,则可以对数组进行浅拷贝(也称为浅复制,对象的复制见)
返回值:截取后的数组
arr = ["孙悟空", "猪八戒", "沙和尚", "唐僧"]result = arr.slice(0, 2)
console.log(result) // ["孙悟空", "猪八戒"]result = arr.slice(1, 3)
console.log(result) // ["孙悟空", "猪八戒", "沙和尚"]result = arr.slice(1, -1)
console.log(result) // ["孙悟空", "猪八戒", "沙和尚"]