什么是数组?
是一组数据的集合,用于在单个变量中存储多个值
一.检测是否为数组
1. Array.isArray
用来检测传递的值是否为数组(H5中提供的方法)
示例:
二.把数组转换为字符串
1.toString():
把数组转换为数组值(逗号分隔)的字符串
实例:
var arr =[1,2,3,4,2]
arr.toString() //'1,2,3,4,2'
2.join():
可将所有数组元素结合为一个字符串。 它的行为类似 toString(),但是还可以规定分隔符:
var arr =[1,2,3,4,2]
arr.join("*") //'1*2*3*4*2'
三.添加删除数组元素
1.push()
向数组的末尾添加一个或更多元素,并返回新数组的长度。
代码示例:
var arr =[1,2,3,4,2]
var arr1 = arr.push('pink') // arr1的值是6
2.pop()
从后面删除元素,只能是一个,返回值是删除的元素
let arr = [1,2,3,4,5]
console.log(arr.pop()) // 5
console.log(arr) //[1,2,3,4]
3.shift()
从前面删除元素,只能删除一个 返回值是删除的元素
let arr = [1,2,3,4,5]
console.log(arr.shift()) // 1
console.log(arr) // [2,3,4,5]
4.unshift()
从前面添加元素, 返回值是添加完后的数组的长度
let arr = [1,2,3,4,5]
console.log(arr.unshift(2)) // 6
console.log(arr) //[2,1,2,3,4,5]
5.splice()----添加/删除
从数组中添加/删除元素,返回值是被删除的元素(会改变原始数组)
语法:
var arr = [1,2,3,4]
arr.splice(value,num,item...)
参数:
value: 必选参数,添加/删除元素的位置,负数从数组结尾往左开始
num : 必选参数,删除元素的数量,不删除写 0
item : 可选 ,要添加的元素
代码如下:
四.ES5新增数组方法
1.forEach()
用于迭代(遍历)数组,相当于数组遍历的 for循环 没有返回值
语法
array.forEach(function(value,index,array))
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组
示例
var arr = [1, 2, 3, 4, 5]
var sum = 0
arr.forEach(function (value, index, array) {
console.log('每个数组元素' + value)
console.log('每个数组元素的索引号' + index)
console.log('数组本身' + array)
sum += value
})
console.log(sum); // 15
2.filter()
用于检测数组元素筛选,并返回符合条件所有元素的新数组。
注意:
- filter()不会对空数组进行检测
- 不会改变原始数组
- 符合条件的元素返回一个新数组
语法:
array.filter(function(value,index,array))
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组
示例:
var arr = [12, 66, 4, 88, 3, 7];
var newArr = arr.filter(function(value, index,array) {
//参数一是:数组元素
//参数二是:数组元素的索引
//参数三是:当前的数组
return value >= 20;
});
console.log(newArr);//[66,88] //返回值是一个新数组
3.some()
用于检测数组中的元素是否满足指定条件
注意:
- 有一个元素满足条件,终止循环,返回布尔值
- some() 不会对空数组进行检测。
- some() 不会改变原始数组。
语法:
array.some(function(value,index,array))
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组
var arr = [10, 30, 4];
var flag = arr.some(function(value,index,array) {
//参数一是:数组元素
//参数二是:数组元素的索引
//参数三是:当前的数组
return value < 3;
});
console.log(flag);//返回值是布尔值,只要查找到满足条件的一个元素就立马终止循环
4.every()
检测数组所有元素是否都符合指定条件,一个元素不满足,则终止循环,剩余不在检测,返回布尔值
注意:
1.every() 不会对空数组进行检测。
2.every() 不会改变原始数组
语法:
array.every(function(value,index,array))
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组
示例:
var arr = [2,4,6,8,10]
var a = arr.every(function(item){
return item % 2 === 0
})
console.log(a); // true
5.map()
通过指定函数对数组进行处理,返回值是新数组
注意:
- 不会改变原数组,只是将处理后的结果以新数组的形式返回
- map() 不会对空数组进行检测。
语法:
map的使用语法,回调函数可以接受三个参数,map的第二个参数指定回调函数的this
array.map(function(Value,index,array), thisValue)
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组
示例:
var arr = [2, 4, 6, 8, 10]
var a = arr.map(function (value, index) {
console.log(value);
console.log(index);
return value + index
})
console.log(a); // [2, 5, 8, 11, 14]
五.ES6新增的数组方法
1.find()
用于找出第一个符合条件的数组元素,之后的值不再进行检测如果没有找到返回undefined 语法:
array.find(function(value,index,array))
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组 示例:
var arr = [{
name: 'jerry',
sex: 'man'
},
{
name: 'jack',
sex: 'woman'
},
{
name: 'jack',
sex: 'man'
}
]
var jack = arr.find(function (obj) {
return obj.name == 'jack';
})
console.log(jack); // 返回符合条件的第一个对象{name: "jack", sex: "woman"}
var bill = arr.find(function (obj) {
return obj.name == 'bill';
})
console.log(bill); // undefined
2.findIndex()
给定条件,返回数组中第一个满足该条件的值的下标,之后的值不再进行检测,当没有找到满足该条件的值时,返回 -1 语法:
array.findIndex(function(value,index,array))
- value: 每个数组元素
- index:每个数组元素的索引号
- array:当前的数组 示例:
var arr = [{
name: 'jerry',
sex: 'man'
},
{
name: 'jack',
sex: 'woman'
},
{
name: 'jack',
sex: 'man'
}
]
var jack = arr.findIndex(function (obj) {
return obj.name == 'jack';
})
console.log(jack); // 1
var bill = arr.findIndex(function (obj) {
return obj.name == 'bill';
})
console.log(bill); // -1
3.includes()
3.reduce()----累加器
该方法用于对数组中的每个元素累加,将结果汇总返回(可以理解为累加器)
语法:
array.reduce(callback(total, currentValue, currentIndex, arr), initialValue)
参数:
callback : 必选,执行函数
total : 必选,初始值,或者计算结束后的返回值
currentValue :必选,当前元素
currentIndex : 可选,当前元素的索引
arr : 可选,当前元素所属的数组对象
initialValue : 可选,传递给函数的初始值
代码示例:
用的箭头函数,也可以使用普通函数来实现,返回值用一个变量来接收,如果写在函数里面直接 return 出去就行
注意: reduce() 对于空数组是不会执行回调函数的。
find() 方法,它返回数组中找到的元素的值,而不是其索引。
9.reverse()----翻转数组
用于颠倒数组中元素的顺序
代码示例
10.sort()----冒泡排序
用于对数组的元素进行排序
语法:
array.sort(sortfunction)
参数:
sortfunction :可选。规定排序顺序-升-降。必须是函数
代码示例:
升序
降序
some和every的区别:
every():
只要有一个元素不符合条件,就返回 false;
some():
只要有一个元素符合条件,就返回 true
14.Set 对象作用----数组去重
代码示例:
15.slice()
用于提取字符串的某个部分,并以新的字符串返回被提取的部分
注意: slice() 方法不会改变原始数组。
语法:
array.slice(start, end)
参数: start : 可选,从何处选取,为负数从尾部选取,包含最后一个
end :可选,选几个
代码示例: