数组介绍
数组是一个特殊的变量,可以存放一个或一个以上的值。
创建数组
- 使用数组文本
var a = [1, 2, 3, 4]
复制代码
- 使用
new
关键词创建
var a = new Array(1, 2, 3, 4)
复制代码
访问数组元素
通过下标访问
var b = a[0]
复制代码
改变数组元素
a[0]= 5
复制代码
length 属性
a.length // 4
// 访问最后一个元素
a[a.length - 1]
复制代码
遍历数组元素
for循环
var a = [1, 2, 3, 4]
var sum = 0
for (var i = 0; i < a.length; i++) {
sum += a[i]
}
console.log(sum) // 10
复制代码
forEach
forEach()
方法为每个数组元素调用一次函数(回调函数)。 接收三个参数:项目值、项目索引、数组本身
var a = [1, 2, 3, 4]
var sum = 0
a.forEach((item, index, self) => {
console.log(item, index, self)
console.log('this', this)
sum = item + 10
})
console.log(sum)
console.log(a)
复制代码
map
- 通过对每个数组元素执行函数来创建新数组。
- 不会对没有值的数组元素执行函数。
- 不会更改原始数组。
接收三个参数:项目值、项目索引、数组本身
var a = [1, 2, 3, 4]
var b = a.map((item, index, self) => {
console.log(item, index, self)
console.log('this', this)
return item + 10
})
console.log(b)
console.log(a)
复制代码
由此可以看出 forEach
与 map
的异同
相同处:
- 遍历数组
- 参数相同
- this
指向window\
不同处:
- map
有返回值,map()方法会得到一个新的数组并返回
- forEach
没有返回值;返回的undefined。forEach()
会修改原来的数组
filter
filter()
方法创建一个包含通过测试的数组元素的新数组。
接收三个参数:项目值、项目索引、数组本身
var a = [1, 2, 3, 4]
var b = a.filter(item => item > 3)
console.log(b)
复制代码
reduce
在每个数组元素上运行函数,以生成(减少它)单个值。
在数组中从左到右工作。
不会减少原始数组。
接收三个参数:总数(初始值/先前返回的值)、项目值、项目索引、数组本身
var a = [1, 2, 3, 4]
var b = a.reduce((total, item, index, self) => {
return total + item
})
console.log(b)
复制代码
reduce()
方法能够接受一个初始值
var a = [1, 2, 3, 4]
var b = a.reduce((total, item, index, self) => {
return total + item
}, 100)
console.log(b)
复制代码
reduceRight()
与reduce
类似,区别在于在数组中从右到左工作。
every
every()
方法检查所有数组值是否通过测试。
接收三个参数:项目值、项目索引、数组本身
some
some() 方法检查某些数组值是否通过了测试。
接收三个参数:项目值、项目索引、数组本身
find
find() 方法返回通过测试函数的第一个数组元素的值。
接收三个参数:项目值、项目索引、数组本身
var a = [{id: 1, name: 'A'}, {id: 2, name: 'B'}]
var b = a.find(item => item.id == 2)
console.log(b)
复制代码
findIndex
findIndex()
方法返回通过测试函数的第一个数组元素的索引。
var a = [{id: 1, name: 'A'}, {id: 2, name: 'B'}]
var b = a.findIndex(item => item.id == 2)
console.log(b)
复制代码
数组方法
数组转换为字符串
toString()
把数组转换为数组值(逗号分隔)的字符串join(分隔符)
方法也可将所有数组元素结合为一个字符串,可以定义分隔符。
var a = ['A', 'B', 'C', 'D']
var b = a.toString()
var c = a.join(',')
console.log(b) // A,B,C,D
console.log(c) // A,B,C,D
复制代码
push - 添加元素
push()
方法(在数组结尾处)向数组添加一个新的元素。
push()
方法返回新数组的长度
var a = ['A', 'B', 'C', 'D']
a.push('E')
console.log(a) // ["A", "B", "C", "D", "E"]
console.log(a.push()) // 5
var b = a.push('F')
console.log(b) // 6
复制代码
pop - 删除元素
pop()
方法从数组中删除最后一个元素。
var a = ['A', 'B', 'C', 'D']
a.pop()
console.log(a) // ["A", "B", "C"]
var b = a.pop()
console.log(b) // C
复制代码
位移元素
shift
shift()
方法会删除首个数组元素,并把所有其他元素“位移”到更低的索引。
var a = ['A', 'B', 'C', 'D']
var b = a.shift()
console.log(b) // A
console.log(a) //["B", "C", "D"]
复制代码
unshift
unshift() 方法**(在开头)向数组添加新元素**,并“反向位移”旧元素。
unshift() 方法返回新数组的长度。
var a = ['A', 'B', 'C', 'D']
a.unshift('A+')
console.log(a) // ["A+", "A", "B", "C", "D"]
console.log(a.unshift()) // 5
复制代码
splice - 删除、拼接
删除
两个参数:开始位置、删除几项
var a = ['A', 'B', 'C', 'D']
a.splice(2, 2)
console.log(a) // ["A", "B"]
复制代码
拼接
参数:开始位置、删除几项、添加的元素
var a = ['A', 'B', 'C', 'D']
a.splice(2, 2, 'E', 'F', 'G', 'H')
console.log(a) // ["A", "B", "E", "F", "G", "H"]
// 替换
a.splice(2, 1, 'C')
console.log(a) // ["A", "B", "C", "F", "G", "H"]
复制代码
concat - 数组合并
concat()
方法通过合并(连接)现有数组来创建一个新数组。
var a = [1, 2, 3]
var b = [4, 5, 6]
console.log(a.concat(b)) // [1, 2, 3, 4, 5, 6]
复制代码
slice - 数组裁剪
slice()
方法用数组的某个片段切出新数组。
两个参数: 开始位置、结束位置(不包括结束位置元素); 若不设置结束位置,就会从开始位置截取余下所有元素。
var a = [1, 2, 3, 4, 5]
console.log(a.slice(2, 3))
console.log(a.slice(2))
复制代码
indexOf
indexOf()
方法在数组中搜索元素值并返回其位置。
参数indexOf(item, start)
要检索的元素、开始位置(可选)。
若找到元素返回对应下标;若未找到元素返回-1
。
从数组开始向结尾检索。
lastIndexOf lastIndexOf()
与 indexOf()
类似,区别在于,从结尾向开始检索
sort - 数字排序
sort()
对数组进行排序;数字则是升序,字母以字母顺序。
var a = [6, 1, 2, 8, 4]
console.log(a.sort()) // [1, 2, 4, 6, 8]
var b = ['a', 'g', 'j', 'd', 'c']
console.log(b.sort()) // "a", "c", "d", "g", "j"]
复制代码
reverse reverse()
反转数组中的元素。
var a = [6, 1, 2, 8, 4]
console.log(a.sort().reverse()) // [8, 6, 4, 2, 1]
复制代码
比值函数
比较函数的目的是定义另一种排序顺序。
// 降序
var arr = [6, 1, 2, 8, 4]
arr.sort(function(a, b) {return b - a})
console.log(arr) // [8, 6, 4, 2, 1]
console.log(arr[0]) 最大值
console.log(arr[arr.length - 1]) // 最小值
// 以随机顺序排序数组
arr.sort(function(a, b){return 0.5 - Math.random()})
console.log(arr)
// 查找数组中最大值
var max =Math.max.apply(null, arr)
console.log(max) // 8
// 查找数组中最小值
var min = Math.min.apply(null, arr)
console.log(min) // 1
复制代码