【8. 数组】

定义

1. 字面量创建
const arr = []
2. 内置构造函数创建
const arr = new Array()

const arr = new Array(length)  // 定义一长度为length的empty数组，此数组不会进入forEach，map等方法

arr.length = 0  // 清空数组，[]

Properties of the Array Constructor

1. Array.from(iterable: Iterable<any> | ArrayLike<any>): any[]
	将类数组及其他可迭代的集合转化为数组
2. Array.of(...items: any[]): any[]
	Returns a new array from a set of elements
3. Array.isArray(arg: any): arg is any[]
	返回arg是一个数组 的Boolean值

Properties of the Array Prototype Object

普通方法

(method) Array<any>.fn()

1. push(...items: any[]): number
	向数组 末尾 追加数据
    改变原数组
    返回值：添加数据后数组的长度
2. unshift(...items: any[]): number
	向数组 开头 追加数据
    改变原数组
    返回值：添加数据后数组的长度
3. pop(): any
	删除数组最后一个元素
    改变原始数组
    返回值：被删除的数据
4. shift(): any
	删除数组第一个元素
    改变原始数组
    返回值：被删除的数据
5. splice(start: number, deleteCount: number, ...items: any[]): any[]
	删除元素，并用items来替换删除的元素
    start：从此索引位置开始删除数据，只有一个参数时从此参数开始删除到末尾，-1代表最后一个元素
    deleteCount：删除的个数
    items：用来替换的值
    改变原始数组
    返回值：一个新数组 ，存储的数据为删除的元素
6. slice(start?: number, end?: number): any[]
	截取[start, end)范围内的数据
	无参数截取全部，当只有start一个参数时是从此参数截取到结尾，可以是负数
	不改变原始数组
    返回值：截取的数据
7. reverse(): any[]
	反转数组
    改变原始数组
    返回值：反转之后的数组
8. concat(...items: ConcatArray<any>[]): any[] 
	合并两个及以上数组
    不改变原始数组
    返回值：合并好的数组
9. sort(compareFn?: (a: any b: any ) => number): any[]
  数据排序，按照字符的ASCII码来排序（详见JavaScript专栏 => 2. 数据类型）  
  比较纯数字和纯数字字符串数字大小需要给sort添加一个回调函数
  arr.sort((a, b) => a - b)  // 升序排序
  arr.sort((a, b) => b.age - a.age) // 元素的age值降序
  改变原始数组
  返回值：排序好的数组
10. join(separator?: string): string
	把数组转化为用separator || ','拼接的字符串
	不改变原始数组
    返回值：转换后的字符

11. indexOf(searchElement: any, fromIndex?: number): number
	查找数组中某个元素第一次出现的位置
	可选参数fromIndex可指定查找开始位置，可以是负数，[fromIndex, arr.length)
    不改变原始数组
    返回值：如果数据存在返回这个数据的索引，如果不存在就返回-1
12. lastIndexOf(searchElement: any, toIndex?: number): number
	判断数组中某个元素最后一次出现的位置
	可选参数fromIndex可指定查找结束位置，可以是负数，[0, toIndex]
    不改变原始数组
    返回值：如果数据存在返回这个数据的索引，如果不存在就返回-1
13. includes(searchElement: any, fromIndex?: number): boolean
	判断数组中是否存在某个元素
	可选参数fromIndex可指定查找开始位置，可以是负数
    返回值：boolean
14. flat(depth?: 1): any[]
	按照一个可指定的深度depth递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组 
	去除空项empty  
    depth 不填或者为1时  展开一层
    不改变原始数组
    返回值：合并后的数组
15. fill(value: any, start?: number, end?: number): any[]
	在[start, end)的区间内将元素替换成value
	不填参数则全部替换成undefined，
	start和end可以是负数，只有start时从start开始替换到结尾
	改变原数组
	返回新数组

回调方法

都不改变原数组
thisArg可选参数规定回调中的this
value为数组的每一项，index为对应的索引，array是原数组

1. forEach(callbackfn: (value: any, index: number, array: any[]) => void, thisArg?: any): void
    循环数组，回调函数不用return，写了也无效
    返回值：undefined，
2. map(callbackfn: (value: any, index: number, array: any[]) => any, thisArg?: any): any[]
	循环数组，回调函数中每次return的值组成新数组，没有return值为undefined
    返回值：新数组
3. some(predicate: (value: any, index: number, array: any[]) => any, thisArg?: any): boolean
	循环数组，当回调函数中有 return的值的Boolean为true时终止循环，返回true，否则返回false
	返回值 Boolean
4. every(predicate: (value: any, index: number, array: any[]) => any, thisArg?: any): boolean
	循环数组，当回调函数中所有 return的值的Boolean为true时返回true，否则终止循环返回false
	返回值 Boolean
5. filter(predicate: (value: any, index: number, array: any[]) => any, thisArg?: any): any[]
	循环数组，筛选回调函数中 return的值的Boolean为true的value组成数组，没有则为空数组
	返回值 新数组
6. reduce(callbackfn: (prev: any, cur: any, index: number, array: any[]) => any, init?: any): any
   循环数组，回调函数中每次return的值作为prev的值，最后一次的return值最为返回值
   prev：每次return的值会赋给prev，若没有init参数则初始为数组的第一个元素
   可选参数init：设置prev的初始值，此时当前的index为0，循环次数与数组长度一致，否则index为1，循环次数比之-1
   返回值 最后一次的return值
7. find(predicate: (value: any, index: number, obj: any[]) => any, thisArg?: any): any
	循环数组，当回调函数中有 return的值的Boolean为true时终止循环，返回当前value的值
	返回值 首个满足条件的value值，没有则为undefined
8. findIndex(predicate: (value: any, index: number, obj: any[]) => any, thisArg?: any): number
	循环数组，当回调函数中有 return的值的Boolean为true时终止循环，返回当前index的值
	返回值 首个满足条件的index值，没有则为-1

常用数组案例

// 累加器
arr.reduce((prev, cur) => prev + cur, 0) 

// reduce 去重
arr.reduce((prev, cur) => (prev.includes(cur) ? prev : prev.concat(cur)), [])

// set 去重
[...new Set(arr)]

// 快速生成指定长度数组元素为{}的数组
const arr = new Array(length).fill(null).map(item => ({}))   

下一篇 9. 字符串
上一篇 7. Numbers and Dates