js数组总结

102 阅读5分钟

概述

  • 可以储存任意类型数据
  • 动态大小,可随数据添加自动增长

创建数组

  • 构造函数 const colors = new Array(20) // length为20的数组 传一个值而且为数值则创建指定长度数组 可省略new操作符
  • 字面量创建数组
  • Array.from() 转换类数组(有索引和长度属性结构/可迭代结构) 转换字符串,map,set,对现有数组浅复制(浅复制只拷贝基本数据类型) 能接收第二个可选的映射函数参数。还可以接收第三个可选参数,指定映射函数的this值。
  • Array.of() 将一组参数转换为数组实例

Array.of(7); // [7] Array.of(1, 2, 3); // [1, 2, 3]

Array(7); // [ , , , , , , ] Array(1, 2, 3); // [1, 2, 3]

数组空位

const a = [,,,,] es6会将空位视为undefined 确实要使用数组空位,显示的用undefined值代替

数组索引

设置超过最大索引,会自动扩展 length可读可写。末尾删除或者添加元素。 设置length值大于数组元素,undefined会填充。 数组最大为4 294 967 295个元素

检测数组

涉及多个全局上下文时,把数组传到另一个全局上下文,这个数组构造函数有别于第二个框架内本地的数组。 提供了Array.isArray()检测。

迭代器方法

原型方法:keys(),values(),entries(). 分别返回索引,值,索引/值的迭代器。用Array.from,解构可转换为数组。

复制和填充方法

函数签名概念? 函数签名类似,指定范围包含开始不包含结束索引。不会改变数组大小

  • fill() 插入全部或者部分相同的值,负值从末尾计算。结束索引不提供则填充到末尾。
const a = [1,2,3,4,5]
a.fill(4,2)
console.log(a) // [1,2,4,4,4]
a.fill(0)
console.log(a) // [0,0,0,0,0]
a.fill(7,1,3)
console.log(a) // [0,7,7,0,0]

会忽略超出边界,零长度,方向相反的索引范围

  • copyWithin() 按照指定范围浅复制数组部分内容
const a = [0,1,2,3,4,5,6,7,8,9]
// 从索引0开始复制内容,加到索引5开始的位置,到达边界停止
a.copyWithin(5)
console.log(a)

const a = [0,1,2,3,4,5,6,7,8,9]
// 从索引4开始复制索引1-4的内容,加到索引4开始的位置
a.copyWithin(4,1,4)
console.log(a) // [ 0, 1, 2, 3, 1, 2, 3, 7, 8, 9]

会忽略超出边界,零长度,方向相反的索引范围

转换方法

所有对象都有toLocalString(),toString(),valueOf()方法

valueOf()返回数组本身

toString()返回数组中每个值等效字符串拼接逗号分隔字符串。也就是数组每个值都会调用toString().

toLocalString()每个数组值会调用toLocalString().

join()方法可以用不同分隔符,默认,分割。

数组某项为null或者undefined则为空字符串

栈方法

栈是一种后进先出的结构。数据项的插入(推入和弹出)只在栈顶发生 push()末尾添加。返回数组长度 pop()末尾删除。返回被删除项

队列方法

队列是先进先出的结构。末尾添加数据,开头获取数据。

push()

shift() 删除第一项并返回。

反方向模拟队列

unshift()

pop()

排序方法

reverse() 反向排列,不灵活

sort() 默认升序排列。转换成字符排列。

接收比较函数:函数接收两个参数,如果第一个参数应该排在前面返回负值,相等返回0,排后面返回正值。

const a = [0,3,56,3,6,8,10,2,5,9]

function com(a,b) {
 if (a < b) {
   return -1
 } else if (a>b) {
   return 1
 } else {
   return 0
 }
}

a.sort(com)
console.log(a)

const a = [0,3,56,3,6,8,10,2,5,9]

a.sort((a,b) => a < b ? 1 : a > b ? -1 : 0)
console.log(a)

如果数组元素是数组或者valueOf()方法返回数值的对象,可写为:

function com(val1,val2) {
   return val1-val2
}

操作方法

concat(): 把参数添加到数组末尾,返回新数组,不改变原数组。 参数数组指定Symbol.isConcatSpreadable符号属性可控制是否打平数组。true打平(默认),false不打平。

silce(): 创建一个包含原因数组中一个或者多个元素的新数组。不影响原始数组。负值参数为数组长度加上负值计算。结束位置小于开始位置返回空数组。

splice(): 数组中间插入元素: 删除:arr.splice(0,2)删除前面两个 插入:arr.splice(2,0,'foo'),2的位子开始插入foo 替换:arr.splice(2,1,'bar'),2的位置删除一个元素,插入bar 返回:始终返回从数组中删除的元素,没有返回空数组。

搜索和位置方法

按照严格相等搜索和按断言函数搜索

  • 严格相等 接收两个参数:要查找元素和可选的起始位置

indexOf(),lastIndexOf()没找到返回-1,找到返回相应的位置

includes():返回布尔值

  • 断言函数

断言概念?

find()和findIndex() 断言函数接收三个参数:元素,索引,数组本身。前者返回匹配的元素,后者返回匹配的索引。第二个参数this指定断言函数内部this值。找到匹配项后不再继续搜索。

迭代方法

5个迭代方法:都接收两个参数:函数和函数的this值。函数接收三个参数:数组元素,索引,数组本身。

every():对每项运行函数,返回true,则返回true。

filter():返回true的项会组成数组返回

forEach():对每项运行函数,无返回值

map():对每项运行函数,返回由每次函数调用的结果构成的数组

some():对每项运行函数,有一项返回true则返回true。

都不改变调用数组

归并方法

reduce():第一项遍历至最后一项

reduceRight():最后一项遍历至第一项

迭代所有项,并在此基础上构建一个最终返回值。

参数:两个,对每一项都运行的归并函数和可选的初始值。 函数的4个参数:上一个归并值,当前项,当前项的索引,数组本身。

这个函数返回的任何值都会作为下一次调用同一个函数的第一个参数。 无起点值时,第一次迭代从数组第二项开始。

const arr = [1,2,3,4]

const sum = arr.reduce((prev,cur,index,arr) => {
  console.log(prev,cur,index,arr)
  return prev + cur
}, 0)

console.log(sum)

// 0 1 0 [ 1, 2, 3, 4 ]
// 1 2 1 [ 1, 2, 3, 4 ]
// 3 3 2 [ 1, 2, 3, 4 ]
// 6 4 3 [ 1, 2, 3, 4 ]
// 10

定型数组

待更新