数组方法的增删等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 * 10return 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);

数组方法的增删等19种操作：unshift 、shift，push、pop、splice等等...！相关推荐

通过实现25个数组方法来理解及高效使用数组方法(长文,建议收藏)
作者:Maciej Cieslar 译者:前端小智来源: dev 你知道的越多,你不知道的越多点赞再看,养成习惯本文 GitHub:https://github.com/qq449245884/ ...
python读取二维数组的行列数_Python获取二维数组的行列数的2种方法
Python获取二维数组的行列数的2种方法这篇文章主要介绍了Python获取二维数组的行列数的2种方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考 ...
2019 年，19 种方法让自己成为更好的 Node.js 工程师
原文作者:Yoni Goldberg 译者:UC 国际研发 Jothy 写在最前:欢迎你来到"UC国际技术"公众号,我们将为大家提供与客户端.服务端.算法.测试.数据.前端等相关的 ...
js map 排序_数组方法写给女友的一系列 JS 数组操作（建议收藏 | 内附思维导图）...
前言最近和女友,咳咳...(说出来可能会被打s)学习JS数组方法,用几个字形容的话就是听说过,实际使用.遇到的时候就分不清具体方法会得到怎样的结果. 今天我将通过这篇文章好好整理一下关于JS数组的方 ...
js中对数组的增删方法：push(),pop(),unshift(),shift(),splice()的用法小结
1.push().pop()和unshift().shift() 这两组同为对数组的操作,并且会改变数组的本身的长度及内容. 不同的是 push().pop() 是从数组的尾部进行增减,unshift ...
php 从数组里删除元素,PHP从数组中删除元素的四种方法实例
PHP从数组中删除元素的四种方法实例一.总结一句话总结:unset(),array_splice(),array_diff(),array_diff_key() 二.PHP从数组中删除元素的四种方 ...
JS数组移除元素的八种方法
JS数组移除元素的八种方法一.修改arr的length方法 let arr = [1,2,3,4,5,6,7,8,9]; arr.length = 3; console.log('length',a ...
「数组方法」写给女友的一系列 JS 数组操作（建议收藏 | 内附思维导图）
前言最近和女友,咳咳-(说出来可能会被打s)学习JS数组方法,用几个字形容的话就是听说过,实际使用.遇到的时候就分不清具体方法会得到怎样的结果. 今天我将通过这篇文章好好整理一下关于JS数组的方法, ...
php数组如何写入txt文件中_php将数组写入到文件的三种方法
php的数组十分强大,有些数据不存入数据库直接写到文件上,用的时候直接从文件中读取,本文章向大家介绍php将数组写入到文件的三种方法. 第一:serialize方法使用 serialize 将数组序 ...
PHP获取数组最后一个值的2种方法
这篇文章主要介绍了PHP获取数组最后一个值的2种方法,本文直接给出实现代码,代码中包含注释,需要的朋友可以参考下代码如下: $array=array(1,2,3,4,5); echo $ar ...

数组方法的增删等19种操作：unshift 、shift，push、pop、splice等等...！

数组方法的增删等19种操作：unshift 、shift，push、pop、splice等等...！相关推荐

最新文章

热门文章