【core/observer】之traverse方法

/* @flow */

import { _Set as Set, isObject } from '../util/index'
import type { SimpleSet } from '../util/index'
import VNode from '../vdom/vnode'

const seenObjects = new Set()

/**
 * 递归遍历一个对象以唤起所有已转换的getter，
 * 以便将objec内部的每个嵌套属性都作为“deep”依赖项收集。
 */
export function traverse (val: any) {
  _traverse(val, seenObjects)
  seenObjects.clear()
}

function _traverse (val: any, seen: SimpleSet) {
  let i, keys
  const isA = Array.isArray(val)
  if ((!isA && !isObject(val)) || Object.isFrozen(val) || val instanceof VNode) {
    return
  }
  if (val.__ob__) {
    const depId = val.__ob__.dep.id
    if (seen.has(depId)) {
      return
    }
    seen.add(depId)
  }
  if (isA) {
    i = val.length
    while (i--) _traverse(val[i], seen)
  } else {
    keys = Object.keys(val)
    i = keys.length
    while (i--) _traverse(val[keys[i]], seen)
  }
}

traverse方法

traverse方法是一个递归操作，来完成deep之后，所有子值变化，都会被监听到。

• 先判断val的类型，如果不是Array，Object或者被冻结，就直接返回
• 然后拿到val的dep.id ，来判断id，保证不会重复收集以来
• 如果是数组，就循环数据，将数组中的每一项都递归调用_traverse()
• 如果是Object类型，就循环Object中所有的key，然后执行一次读取操作，再递归子值：while (i--) _traverse(val[keys[i]], seen)val[keys[i]]会触发getter，触发收集依赖的操作。