集合引用类型

《JavaScript高级程序设计》读书笔记

Object

创建方法：

• 使用new 操作符和Object 构造函数
• 对象字面量表示法

Array

创建数组

创建数组的静态方法：

• Array.from()：用于将类数组结构转换为数组实例。第一个参数是一个类数组对象，即任何可迭代的机构，或者一个有length 属性和可索引元素的结构。第二个可选的映射函数参数，直接增强新数组的值，不需Array.from().map() 那样创建一个中间数组。第三个可选参数，用于指定映射函数中this 的值
• Array.of()：可以把一组参数转化为数组

new Array(10) // [empty × 10]
new Array('red','blue') // ['red', 'blue']
Array(3) // [empty × 3] 可以省略new
let colors = ['red', 'blue']
console.log(Array.from('Matt')) // ['M', 'a', 't', 't']
const m = new Map().set(1, 2).set(3, 4);
console.log(Array.from(m)) // [Array(2), Array(2)]
console.log(Array.of(1, 2, 3)) // [1, 2, 3]

数组空位

可以使用一串逗号来创建空位，js 会将逗号之间相应索引位置的值当场空位

数组索引

如果吧一值设置给超过数组最大索引的索引，则数组长度会自动扩展到该索引值加1.

数组length 属性，不是只读，也可以修改数组。通过length属性，可以从数组末尾删除或添加元素。如果将length 设置大于数组元素数的值，则新添加的元素都将以undefined 填充

检测数组

• instanceof：假定只有一个全局执行上下文
• Array.isArray()：如果网页里有多个框架，则可能涉及两个不同的全局执行上下文，如果要把数组从一个框架传给另一个框架，则这个数组的构造函数将有别于在第二个框架内本地创建的数组，可以采用该方法

迭代器方法

Array 的原型上暴露了 3 个用于检索数组内容的方法：

• keys() 返回数组索引的迭代器
• values() 返回数组元素的迭代器
• entries() 返回数组元素的迭代器

复制和填充方法

• arr.fill(value[, start[, end]])：用一个固定值填充一个数组中从起始索引到终止索引内的全部元素。不包括终止索引。
• arr.copyWithin(target[, start[, end]])：方法浅复制数组的一部分到同一数组中的另一个位置，并返回它，不会改变原数组的长度。

转换方法

• Array.prototype.toLocaleString()
• Array.prototype.toString()
• Array.prototype.valueOf()
• Array.prototype.join()

栈方法

栈是一种后进先出（ LIFO， Last-In-First-Out）的结构，也就
是最近添加的项先被删除

• pop()
• push()

队列方法

队列以先进先出（ FIFO， First-In-First-Out）形式限制访问。

• shift()
• push()

排序方法

• sort() 排序
• reverse() 翻转

操作方法

• concat() 合并数组
• slice()

搜索和位置方法

• indexOf()
• lastIndexOf()
• includes()
• find()
• findIndex()

迭代方法

• every()： 对数组每一项都运行传入的函数，如果对每一项函数都返回 true， 则这个方法返回 true。
• filter()：对数组每一项都运行传入的函数，函数返回 true 的项会组成数组之后返回。
• forEach()：对数组每一项都运行传入的函数，没有返回值。
• map()：对数组每一项都运行传入的函数，返回由每次函数调用的结果构成的数组。
• some()：对数组每一项都运行传入的函数，如果有一项函数返回 true，则这个方法返回 true。
• 这些方法都不改变调用它们的数组。

归并方法

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

• reduce()方法从数组第一项开始遍历到最后一项
• reduceRight()从最后一项开始遍历至第一项。
   

定型数组

提升向原生库传输数据的效率。

ArrayBuffer

一个普通的 JavaScript 构造函数，可用于在内存中分配特定数量的字节空间，一经创建就不能再调整大小。可以使用 slice()复制其全部或部分到一个新实例。

DataView

第一种允许你读写 ArrayBuffer 的视图。必须在对已有的 ArrayBuffer 读取或写入时才能创建DataView 实例。

Map

一种新的集合类型，真正的键/值存储机制。

基本API

初始化实例时可以给 Map 构造函数传入一个可迭代对象，需要包含键/值对数组。任何数据类型都可作为键。Map 实例会维护键值对的插入顺序，因此存在先后顺序。

• get() 获取
• has() 是否存在
• set() 设置
• size 数量
• delete() 删除
• clear() 清空

Object 与 Map 对比

1. 内存占用
        Object 和 Map 的工程级实现在不同浏览器间存在明显差异，但存储单个键/值对所占用的内存数量都会随键的数量线性增加。批量添加或删除键/值对则取决于各浏览器对该类型内存分配的工程实现。不同浏览器的情况不同，但给定固定大小的内存， Map 大约可以比 Object 多存储50%的键/值对。
2. 插入性能
        向 Object 和 Map 中插入新键/值对的消耗大致相当，不过插入 Map 在所有浏览器中一般会稍微快一点儿。对这两个类型来说，插入速度并不会随着键/值对数量而线性增加。如果代码涉及大量插入操作，那么显然 Map 的性能更佳。
3. 查找速度
        与插入不同，从大型 Object 和 Map 中查找键/值对的性能差异极小，但如果只包含少量键/值对，则 Object 有时候速度更快。在把 Object 当成数组使用的情况下（比如使用连续整数作为属性），浏览器引擎可以进行优化，在内存中使用更高效的布局。这对 Map 来说是不可能的。对这两个类型而言，查找速度不会随着键/值对数量增加而线性增加。如果代码涉及大量查找操作，那么某些情况下可能选择 Object 更好一些。
4. 删除性能
        使用 delete 删除 Object 属性的性能一直以来饱受诟病，目前在很多浏览器中仍然如此。为此，出现了一些伪删除对象属性的操作，包括把属性值设置为 undefined 或 null。但很多时候，这都是一种讨厌的或不适宜的折中。而对大多数浏览器引擎来说， Map 的 delete()操作都比插入和查找更快。如果代码涉及大量删除操作，那么毫无疑问应该选择 Map。

WeakMap

弱映射。键只能是object 或继承自Object 的类型，使用非对象会抛出TypeError。这些键不属于正式的引用，不会阻止垃圾回收。不可迭代。

基本API

• set()
• get()
• has()
• delete()

使用弱映射

const m = new WeakMap()
const loginButton = document.querySelector('#login');
wm.set(loginButton, {disabled: true});

Set

与map类似，不过是键具有唯一性

基本API

• add()
• has()
• size
• delete()
• clear()

WeakSet

与WeakMap 类似

迭代与扩展操作

4种原生集合类型定义了默认迭代器：

• Array
• 所有定型数组
• Map
• Set

意味着都可以传入for-of 循环、兼容扩展操作符、支持多种构建方法(Array.of、Array.from等）