一、 数组对象的增删方法
1.unshift方法 - 修改原数组 - 给数组开头添加1个或多个元素
元素:数组.unshift(元素, 元素, ...) - 返回新数组的长度
如果需要添加多个元素直接在括号内添加用逗号隔开即可
var arr = ['a', 'b', 'c'];
var l = arr.unshift('d') // arr.unshift('d')表示添加元素
console.log(arr); // ['a', 'b', 'c', 'd']
console.log(l); //检查数组长度: 4
2.shift方法 - 修改原数组 - 将数组开头的元素删掉,无参数
语法:数组.shift() - 返回被删掉的元素
var arr = ['a', 'b', 'c'];
var ele = arr.shift()
console.log(arr); // ['b', 'c']
console.log(ele); // a
3.push方法 - 修改原数组 - 给数组末尾添加一个或多个元素
语法:数组.push(元素, 元素, ...) - 返回新数组长度
var arr = ['a', 'b', 'c'];
// arr.push('d') 末尾添加一个元素
var l = arr.push('d', 'e') // 末尾添加多个元素 赋值给变量l用来检测数组长度
console.log(arr); // ['a', 'b', 'c', 'd', 'e']
console.log(l); // 5
4.pop方法 - 修改原数组 - 将数组的最后一个元素删除,无参数
语法:数组.pop() - 返回被删掉的元素
var arr = ['a', 'b', 'c'];
var ele = arr.pop()
console.log(arr); // ['a', 'b']
console.log(ele); // a
5.splice方法 - 修改原数组 - 给数组的任意一个位置添加、修改、删除 1个或多个元素
语法:数组.splice(开始下标, 删除个数, 新元素, 新元素, ...) - 返回所有被删掉的元素组成的新数组①添加1个元素
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 0, 'e');
console.log(arr) // ['a', 'e', 'b', 'c', 'd']
console.log(brr) // []
②添加多个元素
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 0, 'e', 'f')
console.log(arr); //['a', 'e', 'f', 'b', 'c', 'd']
console.log(brr); // 此处返回值为删除元素个数,因未删除任何元素,所以返回值是[]
③修改一个元素
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 1, 'e')
console.log(arr) // ['a', 'e', 'c', 'd']
console.log(brr) // ['b']
④修改多个
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 2, 'e', 'f')
console.log(arr); // ['a', 'e', 'f', 'd']
console.log(brr); //['b', 'c']
⑤删除1个元素
语法:数组.splice(开始下标, 删除个数) - 返回所有被删掉的元素组成的新数组
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 1)
console.log(arr); // ['a', 'c', 'd']
console.log(brr); // ['b']
⑥删除多个
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 2)
console.log(arr); // ['a', 'd']
console.log(brr); // ['b', 'c']
二、 数组对象的其他方法
1.sort方法 - 修改原数组 - 对数组中元素进行排序
语法:数组.sort()让数组中元素按照数字大小进行排序的语法 - 返回这个数组本身
var arr = [11,5,9,7,3,4,6]
var brr = arr.sort(function(a, b) {
//return a - b 升序
return b-a //倒序
})
console.log(arr); // 输出结果从大到小排列[11, 9, 7, 6, 5, 4, 3]
console.log(brr); // [11, 9, 7, 6, 5, 4, 3]
console.log(arr === brr); // true
2.reverse方法 - 修改原数组 - 翻转数组
语法:数组.reverse() - 返回当前数组
var arr = ['a', 'b', 'c']
var brr = arr.reverse()
console.log(arr); // ['c', 'b', 'a']
console.log(brr);
console.log(arr === brr); // true
3. join方法 - 不修改原数组 -将数组中所有元素通过指定的连接符,连接成一个字符串
语法:数组.join(连接符) - 返回连接后的字符串
var arr = ['a', 'b', 'c']
var str = arr.join('-')
var str = arr.join('') // 将所有元素直接拼接在一起
var str = arr.join() // 如果省略连接符,默认使用逗号连接
console.log(str); // a,b,c
console.log(arr); //['a', 'b', 'c']
4.concat方法 - 不修改原数组 - 将1个或多个元素或数组 跟 当前数组组合成一个更大的数组
语法:数组.concat(1个或多个元素或数组) - 返回组合后的更大的数组
var arr = ['a', 'b']
var brr = arr.concat('c', 'd')
var brr = arr.concat(['c', 'd'])
console.log(brr); // ['a', 'b', 'c', 'd', 'e', 'f']
console.log(arr) // ['a', 'b']
5.slice方法 - 不修改原数组 - 截取数组
语法:数组.slice(开始下标, 结束下标) - 返回被截取出来的一段组成的数组,结果不包含结束下标对应的字符,如果省略结束下标,就截取到数组的末尾,/在省略结束下标的基础上,还可以省略开始下标 - 从开头截取到末尾
var arr = ['a', 'b', 'c', 'd', 'e', 'f']
var brr = arr.slice(2, 5)
console.log(brr); // ['c', 'd', 'e']
console.log(arr); //['a', 'b', 'c', 'd', 'e', 'f']
6. indexOf方法 - 查找某个元素在数组中第一次出现的下标
①语法:数组.indexOf(元素) - 找到元素就返回对应的下标,找不到元素就返回-1
var arr = [1,5,9,1,3,6,8,7] // 找 10 在arr中第一次出现的下标
var index = arr.indexOf(10)
console.log(index) // -1
②语法:数组.indexOf(元素, 开始查找的下标) - 找到元素就返回对应的下标,找不到元素就返回-1
var arr = [1,5,9,1,3,6,8,7] // 找 10 在arr中第一次出现的下标
var index = arr.indexOf(1, 2)
console.log(index); //3
7.lastIndexOf - 查找某个元素在数组中最后一次出现的下标 - 语法和返回值跟indexOf是一样的
8.map方法 - 修改原数组 - 遍历数组,并将数组中每个元素都处理成新的元素,将所有新元素组成新的数组
语法:
var brr = 数组.map(function(value, index) {
value表示遍历出来的每个元素
index是每个value对应的下标 - 可选项
return 新元素
})
var arr = [
{
name: '张三',
age: 12
},
{
name: '李四',
age: 15
},
]
var brr = arr.map(function(v) {
v.age = v.age + 1
return v
})
console.log(brr);
console.log(arr)
9.filter方法 - 不修改原数组 - 将数组中满足条件的所有元素组成新的数组返回
语法:
var brr = 数组.filter(function(value, index) {
value表示遍历出来的每个元素
index是每个value对应的下标 - 可选项
return 条件
})
var arr = [50,65,88,76,35,24]
var brr = arr.filter(function(v) {
return v < 60
})
console.log(brr); //[50, 35, 24]
console.log(arr) //[50, 65, 88, 76, 35, 24]
10.forEach方法 - 专业用来遍历数组的
语法:
数组.forEach(function(value, index) {
value表示每个值
index表示每个下标
})
var arr = ['a', 'b', 'c']
arr.forEach(function(v, i) {
// if(i === 1) {
// break // forEach方法中不能使用break和continue关键字
// }
console.log(v, i);
})
11.some - 判断数组中是否有一个元素是满足条件的 —— 返回布尔值
语法 布尔值 = 数组.some( function (value, index ) ){ return }
var arr = [10, 20, 30, 50, 40, 80, 99, 100]
var bool = arr.some(function(v){
return v > 90
})
console.log(bool) // true
12.every - 判断数组中是否所有元素都满足指定条件 - 返回布尔值
语法:布尔值 = 数组.every(function(vaindex)){ return 条件 }
var arr = [10, 20, 30, 50, 40, 80, 99, 100]
var bool = arr.every(function(v) {
return v > 60 //判断条件
})
console.log(bool); //false
13.find - 查找数组中第一个满足指定条件的元素,找到了就会返回元素,找不到就返回undefined
语法:元素 = 数组.find(function(value, index) { return 条件 })
var arr = [10, 20, 30, 50, 40, 80, 99, 100]
var ele = arr.find(function(v) {
return v > 60
// return v > 100 // undefined
})
console.log(ele); //80
14.findIndex - 查找数组中满足指定条件的第一个元素对应的下标,找到了就会返回下标,找不到就返回-1
语法:下标 = 数组.findIndex ( function (value, index) { return 条件 })
var arr = [10, 20, 30, 50, 40, 80, 99, 100]
var index = arr.findIndex(function(v) {
return v > 60
// return v > 100
})
console.log(index); //5
15.reduce - 归并数组 - 数组求和
语法:
数组.reduce(function(a, b) {
reduce遍历数组,会少遍历一次
a第一次遍历,代表第一个元素,第二次开始,就代表上次遍历return的结果
b第一次遍历,代表第二个元素,第二次遍历,代表第三个元素,第三次遍历,代表第4个元素...
})
var arr = [10, 20, 30, 50, 40, 80]
var sum = arr.reduce(function(a, b) {
return a + b
})
console.log(sum) //230