js红宝石 第六章-集合引用类型

6.1 Object

大多数引用值的实例使用的是Object类型.虽然Object实例没有多少功能,但是很适合存储和在应用程序之间交换数据

有两种创建Object对象的方法

    // 1.new和Object构造函数
    let person = new Object();
    person.name = 'zs'
    person.age = 20

    //2.对象字面量
    let person = {
      name: 'zs',
      age: 20
    }

更推荐使用第二章字面量对象的方法创建Object实例

获取对象属性

1. person.name

2. person["name"]

6.2 Array

ECMAScript的数组可以存储任意类型的数据

数组大小是动态的

6.2.1 创建数组

    let colors = new Array(3) // 包含3个元素
    let colors = new Array("red","blue","green") // 直接传入要保存的元素

    // 可以省略new
    let colors = Array(3) 
    let colors = Array("red","blue","green") 

    // 可以直接使用数组字面量,但是不会调用Array构造函数
    let colors = ["red","blue","green"]

from/of

from 将一个可迭代对象转化成数组

of 可以把一组参数转化成数组

6.2.2 数组空位

在使用字面量初始化数组时,可以用 (,) 来创建空位

const options = [,,,,,] // 有五个元素的数组

ES6新增方法会把空位解析成undefined

但是map()和join()等ES6之前的方法会解析成空字符串

所以应该尽量避免使用空字符串,如有需要,也应该显式地用undefined表示

6.2.3 数组索引

数组的长度不是只读的

可以通过给超出数组长度的索引赋值来王数组中添加元素

也可以通过缩小数组长度来删除数组中的元素

6.2.4 检测数组

使用instanceof就足够应付大多数情况了

6.2.5 迭代器方法

keys() 返回数组索引

values() 返回数组的值

entries() 返回数组索引:值对

6.2.6 复制和填充方法

fill(num,begin,end) 用num值填充[start,end]部分的区域

copyWithin(insertIndex,copyBegin,copyEnd) 复制copyBegin到copyEnd位置的值,插入到insertIndex位置

6.2.7 转换方法

join(),toLoacleString(),toString(),valueOf()

如果数组中某一项是null或者undefined,在上面的方法中会以空字符串显示

6.2.8 栈方法

push()

pop()

数组可以像栈一样push和pop 后进先出

6.2.9 队列方法

shift()

push()

和队列一样 先进先出

6.2.10 排序方法

reverse() 倒转

sort() 升序排序

sort方法 可以接收一个比较函数,比较函数可以使用箭头函数

      let values = [1, 3, 5, 2, 4]
      values.sort((a, b) => a < b ? 1 : a > b ? -1 : 0)
      // 如果是数值,可以简化
      values.sort((a, b) => b - a)

6.2.11 操作方法

contact()  先创建一个原数组的副本,然后把contact中的参数拼接到原数组的后面

slice(begin,end) 数组切片 生成一个[begin,end]的数组,如果参数为负数,则加上length

splice()

删除 传入要删除的第一个元素位置,要删除的个数

插入 传入首位值,0(删除0个),...后跟要插入的元素

替换 把0换成要替换的值得个数就行了

6.2.12 搜索和位置方法

搜索方法都是严格相等的

indexOf() 从前向后找

lastIndexOf() 从后向前找

indluces() 从前向后找

断言函数

断言函数接受三个参数 当前的元素,当前的索引,当前的数组

当找到匹配项之后,不会在继续搜索

find 和 findIndex 都使用了断言函数 

      let values = [1, 3, 5, 2, 4]
      values.find((ele,index,array) => {
        console.log(ele);
        console.log(index);
        console.log(array);
        return ele === 4
      })

6.2.13 迭代方法

every() 如果每一项都返回true,则方法返回true

filter() 值为true的对象会形成数组并返回

forEach() 对每一项都执行传入的函数

map() 运行后的结果组成数组

some() 结果有一项为true就返回true

      let values = [1, 3, 5, 2, 4]
      
      let everyResult = values.every((ele,index,array) => ele > 2)
      let mapResult = values.map((ele,index,array) => ele > 2)
      let fliterResult = values.filter((ele,index,array) => ele > 2)

      console.log(everyResult,mapResult,fliterResult);
      
      values.forEach((ele,index,array) => {
        console.log(ele);
      })

6.2.14 归并方法

reduce() 从前往后

reduceRight() 从后往前

都接受四个参数 上一个归并值,当前项,当前项索引,整个数组

6.3 定型数组

定型数组是ECMSScript新增的解构,目的是提升向原生库传输数据的效率

Float32Array是一种视图,可以允许js运行时访问一块名为ArrayBuffer的预分配内存

DateView 是第一种允许读写ArrayBuffer的视图

定型数组是另一种形式的ArrayBuffer视图,他特定于一种ElementType且遵循系统原生的字节序

6.4 Map

Map是一种新的集合类型,带来了真正的键/值存储机制

6.4.1 基本API

嵌套数组初始化map

初始化之后用set()添加键值对

get()和has()进行查询

size() 获取键值对数目

delete()和clear()删除

      let mp = new Map([
        [k1,v1],
        [ke,v2],
        [k3,v2]
      ])
      mp.set(k4,v4).set(k5,v5)

 map可以使用任意类型作为键

6.4.2 顺序与迭代

keys()  values()  entries()

for-of迭代时,key不能修改

6.4.3 Object和Map对比

1.内存占用:对于给定内存,Map可以多存50%键值对

2.插入性能:插入Map在浏览器中会快一点

3.查找速度:Object在某些场合更快

4.删除性能:Map更快

6.5 WeakMap

WeakMap是Map的兄弟,其API是Map的子集

weak描述的是垃圾回收中对待"弱映射"中键的方式

6.5.1 基本API

WeakMap中的键只能是基本的Object类型,不然会报错

初始化任然是嵌套数组的形式,但是只要有一个键无效就会报错

6.5.2 弱键

weak表示弱映射的键是"弱弱的拿着",只要键没有作用,就会被回收,如果值没有被引用,也会被回收

6.5.3 不可迭代键

weakmap不可迭代,因为随时都可能被回收

6.5.4 弱映射的使用

1.私有变量

私有变量会存储在弱映射中,以对象实例为键,私有成员的字典为值

2.DOM节点元数据

因为WeakMap不会阻碍垃圾回收,所以非常适合保存关联元数据,以便及时释放内存

6.6 Set()

6.6.1基本API

数组初始化集合

add()添加

has()查询

size()取得元素数量

delete()和clear()删除数据

6.6.2 顺序和迭代

values() 和 keys() 等价

entries() 会返回按照插入顺序,每个元素出现两次的数组

6.7 WeakSet

和WeakMap基本类似

WekSet()的实例用处没有那么大,但是可以给对象打标签

6.8 迭代和拓展

基本上所有集合引用类型都支持for-of的迭代和兼容拓展操作符

例如解构函数  [...]

Array.of()  Array.from()