js 数组的常用方法

目录

数组关注是否改变原数组

操作

会影响原数组

push()

unshift()

splice()

不会影响

concat()

会影响原数组

pop()

shift()

splice()

不会影响

slice()

splice()

indexOf()

includes()

find()

排序

reserve()

sort()

转换

join()

迭代方法

some()

every()

forEach()

filter()

map()


数组关注是否改变原数组

操作

会影响原数组

push()

  • 接收任意数量的参数,将他们添加到数组末尾,放回数组最新长度

unshift()

  • 在数组头部添加任意多个值,返回新的数组长度
复制代码
```javascript
let arr = ['a', 'b', 'c']
let len = arr.unshift(1, 0)
console.log(arr) // ['1', '0', 'a', 'b', 'c']
console.log(len) // 5
```

splice()

  • 传入三个参数,分别是开始位置,0(要删除的元素数量)、插入的元素,返回空数组
复制代码
```javascript
let arr = ['a', 'b', 'c']
let add = arr.splice(1, 0, 'a', 'b')
console.log(arr) // ['a', 'a', 'b', 'b', 'c']
console.log(add) // []
```

不会影响

concat()

  • 创建一个当前数组的副本,再把它的参数添加到副本末尾,返回这个新构建的数组,不会影响原始数组
复制代码
```javascript
let arr = ['a', 'b', 'c']
let add = arr.concat('e', ['f', 'g'])
console.log(add) // ['a', 'b', 'c', 'e', 'f', 'g']
console.log(arr) // ['a', 'b', 'c']
```

会影响原数组

pop()
  • 删除数组的最后一项,减少数组的length值,返回被删除的项
shift()
  • 用于删除数组的第一项,减少数组的length值,返回被删除项
splice()
  • 传入两个参数,开始位置及删除数量,返回包含删除元素
复制代码
```javascript
let letters = ['a', 'b', 'c', 'd', 'e']
let letters1 = letters.splice(1,2) 
console.log(letters) // ['a', 'd', 'e']
console.log(letters1) //['b', 'c']
```

不会影响

slice()
  • 用于创建一个包含原有数组一个或者多个元素的新数组,不会改变原始数组
复制代码
```javascript
let letters = ['a', 'b', 'c', 'd', 'e']
let letters1 = nums.slice(1) //['b', 'c', 'd', 'e']
let letters2 = nms.slice(1,3) //['b', 'c']
```

splice()

  • 会修改原数组的内容
  • 传入三个参数,分别是开始位置,要删除的数量,要插入的任意多个元素,返回被删除元素的数组,对原数组产生影响
javascript 复制代码
let arr = ['a', 'b', 'c']
let remove = arr.splice(1,1, 'd', 'f')
console.log(arr) // ['a', 'd', 'f', 'c']
console.log(remove) // 'b'

查找元素返回元素坐标或者元素值

indexOf()

  • 查找元素在数组中的位置,没找到返回-1
复制代码
```javascript
let arr = [1,2,3]
arr.indexOf(2) == 1
```

includes()

  • 查找的元素在数组中的位置,找到true,没找到false
复制代码
```javascript
let arr = ['xx', 'banana', 'hah']
arr.includes('mm') //false
```

find()

  • 返回第一个匹配的元素
复制代码
```javascript
let stus =[
    {
        name: 'xx',
        age: '20'
    },{
        name: 'xx1',
        age: '18'
    },{
        name: 'xx2',
        age: '15'
    }
]
stus.find((currentValue, index, arr) => {
    return currentValue.age > 18
}) //{name: 'xx', age: '20'}
```

排序

reserve()

  • 改变原数组
  • 将数组反转
javascript 复制代码
let arr = [1, 2, 3]
let result = arr.reserve()
console.log(result) // [3, 2, 1]

sort()

  • 改变原数组
  • 接受一个比较函数,用于判断哪个值排在前面
javascript 复制代码
function compare(a, b) {
	return b - a
}
let arr = [1, 2, 3]
arr.sort(compare)

转换

join()

  • 接收一个参数(字符串分隔符),返回包含所有项的字符串
javascript 复制代码
let arr = [1, 2, 3]
let result = arr.join('.')
console.log(result) //1.2.3

迭代方法

some()

  • 对数组的每一项都运行传入的函数,至少有一个元素返回true,这个方法就返回true
javascript 复制代码
let arr = [1, 2, 3]
let result = arr.reserve()
console.log(result) // [3, 2, 1]

every()

  • 对数组的每一项都运行传入的函数,所有元素返回true,这个方法就返回true
javascript 复制代码
let arr = [1, 2, 3]
let result = arr.every((item, index, array) => {
    return item > 2
})
console.log(result) //false

forEach()

  • 对数组中的每一项都运行传入的函数,没有返回值

filter()

  • 对数组中的每一项都运行函数,返回为true会组成数组
javascript 复制代码
let arr = [1, 2, 3]
let result = arr.filter((item, index, array) => {
    return item > 1
})
console.log(result) // [2, 3]

map()

  • 对数组中每一项都运行函数,返回由每次函数调用的结果组成新数组
javascript 复制代码
let arr = [1, 2, 3]
let result = arr.map((item, index, array) => {
    return item*2
})
console.log(result) // [2, 4, 6]
相关推荐
小辉懂编程7 分钟前
C语言:51单片机实现数码管依次循环显示【1~F】课堂练习
c语言·开发语言·51单片机
BillKu1 小时前
Vue3 Element Plus 对话框加载实现
javascript·vue.js·elementui
醍醐三叶1 小时前
C++类与对象--2 对象的初始化和清理
开发语言·c++
初遇你时动了情2 小时前
html js 原生实现web组件、web公共组件、template模版插槽
前端·javascript·html
Magnum Lehar2 小时前
3d游戏引擎EngineTest的系统实现3
java·开发语言·游戏引擎
Mcworld8572 小时前
java集合
java·开发语言·windows
成功人chen某2 小时前
配置VScodePython环境Python was not found;
开发语言·python
前端小崔3 小时前
从零开始学习three.js(18):一文详解three.js中的着色器Shader
前端·javascript·学习·3d·webgl·数据可视化·着色器
运维@小兵3 小时前
vue配置子路由,实现点击左侧菜单,内容区域显示不同的内容
前端·javascript·vue.js
海绵宝宝贾克斯儿3 小时前
C++中如何实现一个单例模式?
开发语言·c++·单例模式