数组方法的增删等19种操作:unshift 、shift,push、pop、splice等等...!

1.unshift方法 - 给数组开头添加1个或多个元素

元素:数组.unshift(元素, 元素, ...) - 返回新数组的长度

var arr = ['a', 'b', 'c'];
var l = arr.unshift('d')    arr.unshift('d')表示添加元素
console.log(arr);
console.log(l);             检查数组长度             
如果需要添加多个元素直接在括号内添加用逗号隔开即可

2.shift方法 - 将数组开头的元素删掉

语法:数组.shift() - 返回被删掉的元素

var arr = ['a', 'b', 'c'];
var ele = arr.shift()

console.log(arr);
console.log(ele);

3.push方法 - 给数组末尾添加一个或多个元素

语法:数组.push(元素, 元素, ...) - 返回新数组长度

var arr = ['a', 'b', 'c'];
 // arr.push('d')  末尾添加一个元素
 var l = arr.push('d', 'e') 末尾添加多个元素  赋值给变量l用来检测数组长度
 console.log(arr);
 console.log(l);

4.pop方法 - 将数组的最后一个元素删除

语法:数组.pop() - 返回被删掉的元素

 var arr = ['a', 'b', 'c'];
 var ele = arr.pop()
 console.log(arr);
 console.log(ele);

5.splice方法 - 给数组的任意一个位置添加、修改、删除 1个或多个元素6

添加1个元素

语法:数组.splice(开始下标, 删除个数, 新元素, 新元素, ...) - 返回所有被删掉的元素组成的新数组
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 0, 'e')

添加多个元素
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);  此处返回值为删除元素个数,因未删除任何元素,所以返回值是0



修改一个元素

语法:数组.splice(开始下标, 删除个数, 新元素, 新元素, ...) - 返回所有被删掉的元素组成的新数组
var arr = ['a', 'b', 'c', 'd'];
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 1, 'e')

 修改多个
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 2, 'e', 'f')
console.log(arr); 
console.log(brr);  此处返回值为删除元素个数,所以返回值是2



删除1个元素
语法:数组.splice(开始下标, 删除个数) - 返回所有被删掉的元素组成的新数组
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 1)
console.log(arr);
console.log(brr);

删除多个
var arr = ['a', 'b', 'c', 'd'];
var brr = arr.splice(1, 2)
console.log(arr);
console.log(brr);  此处返回值为删除元素个数,所以返回值是2

// 语法:数组.splice(开始下标, 删除个数, 在删除位置放入的1个或多个元素) - 返回所有被删除元素组成的新数组

sort方法 - 对数组中元素进行排序按照字符串大小进行排序。。。。。了解

语法:数组.sort() - 不是按照数字大小排序的,按照字符串大小进行排序的 - 返回这个数组本身

var arr = [11,5,9,7,3,4,6]

arr.sort()

console.log(arr);

6.sort方法 - 对数组中元素进行排序

语法:数组.sort()让数组中元素按照数字大小进行排序的语法 - 返回这个数组本身

var arr = [11,5,9,7,3,4,6]
// arr.sort(function(a, b) {
// return a - b  升序
// return b - a  降序
})

var brr = arr.sort(function(a, b) {
//return a - b  升序
return b-a      倒序
})

console.log(arr);  输出结果从大到小排列
console.log(brr);
console.log(arr === brr); // true

7.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

 join方法 - 将数组中所有元素通过指定的连接符,连接成一个字符串

语法:数组.join(连接符) - 返回连接后的字符串

var arr = ['a', 'b', 'c']
var str = arr.join('-')
var str = arr.join('') // 将所有元素直接拼接在一起
var str = arr.join() // 如果省略连接符,默认使用逗号连接
console.log(str);


 

8.concat方法 - 将1个或多个元素或数组 跟 当前数组组合成一个更大的数组

 语法:数组.concat(1个或多个元素或数组) - 返回组合后的更大的数组

var arr = ['a', 'b']
var brr = arr.concat('c')
var brr = arr.concat('c', 'd')
var brr = arr.concat(['c', 'd'])
var brr = arr.concat(['c', 'd'], ['e' ,'f'])
console.log(brr);


 

9.slice方法 - 截取数组

语法:数组.slice(开始下标, 结束下标) - 返回被截取出来的一段组成的数组,结果不包含结束下标对应的字符

var arr = ['a', 'b', 'c', 'd', 'e', 'f']
var brr = arr.slice(2, 5)
var brr = arr.slice(2) // 如果省略结束下标,就截取到数组的末尾
var brr = arr.slice() // 在省略结束下标的基础上,还可以省略开始下标 - 从开头截取到末尾
console.log(brr);
console.log(arr);
console.log(arr === brr); // false

10. indexOf方法 - 查找某个元素在数组中第一次出现的下标

语法:数组.indexOf(元素) - 找到元素就返回对应的下标,找不到元素就返回-1

var arr = [1,5,6,7,3,2,5,9,1,3,6,8,7]
找 1 在arr中第一次出现的下标
var index = arr.indexOf(10)
语法:数组.indexOf(元素, 开始查找的下标) - 找到元素就返回对应的下标,找不到元素就返回-1
var index = arr.indexOf(1, 2)
console.log(index);


 

11.lastIndexOf - 查找某个元素在数组中最后一次出现的下标 - 语法和返回值跟indexOf是一样的

var arr = [1,5,6,7,3,2,5,9,1,3,6,8,7]
var index = arr.lastIndexOf(1)
var index = arr.lastIndexOf(1, 5) // 将下标几当做是最后一个元素来找
console.log(index);


 

12.map方法 - 遍历数组,并将数组中每个元素都处理成新的元素,将所有新元素组成新的数组

语法:var brr = 数组.map(function(value, index) {

    value表示遍历出来的每个元素

    index是每个value对应的下标 - 可选项

    return 新元素

})

有数组[1,3,4] - 将每个元素都扩大10倍,形成新的数组

案例

var arr = [1, 3, 4]

var brr = arr.map(function(v) {

var newValue = v * 10

return newValue

})

 console.log(brr);
var arr = [
{
 name: '张三',
  age: 12
},
 {
name: '李四',
age: 15
 },
{
name: '王五',
age: 20
}
]
var brr = arr.map(function(v) {
v.age = v.age + 1
console.log(v);
return v
})
console.log(brr);

13.filter方法 - 将数组中满足条件的所有元素组成新的数组返回

语法:

var brr = 数组.map(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);

案例

var arr = [
{
category: '水果',
 name: '苹果'
},
{
category: '衣服',
name: 'T恤'
},
{
category: '肉',
name: '鸡腿'
},
 {
category: '水果',
name: '芒果'
}]
var brr = arr.filter(function(v) {
return v.category === '水果'
})
console.log(brr);

14.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);

})

15.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)

16.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);   //赋值给bool进行输出

17.find - 查找数组中第一个满足指定条件的元素

语法:元素 = 数组.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
})
console.log(ele);

找到了就会返回元素,找不到就返回undefined

18.findIndex - 查找数组中满足指定条件的第一个元素对应的下标

语法:下标 = 数组. find ( 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
找到了就会返回下标,找不到就返回-1

19.reduce - 归并数组 - 数组求和

语法:

数组.reduce(function(a, b) {

reduce遍历数组,会少遍历一次

a第一次遍历,代表第一个元素,第二次开始,就代表上次遍历return的结果

b第一次遍历,代表第二个元素,第二次遍历,代表第三个元素,第三次遍历,代表第4个元素...

})

var arr = [10, 20, 30, 50, 40, 80, 99, 100]
var sum = arr.reduce(function(a, b) {
// console.log(a);
// console.log(b);
// return 111
return a + b
})
console.log(sum);

  • 2
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值