// ./global-api/index.js
import { set, del } from '../observer/index'
// ...
Vue.set = set
// ...

// './observer/index.js'

/**
 * Set a property on an object. Adds the new property and
 * triggers change notification if the property doesn't
 * already exist.
 */
export function set(target, key, val) {
  // 如果target是一个数组，而且key是一个数组的索引值，直接用数组方法splice()可以直接触发响应的监听，返回
  if (Array.isArray(target) && isValidArrayIndex(key)) {
    target.length = Math.max(target.length, key)
    target.splice(key, 1, val)
    return val
  }
  // 如果key在target里，而且key不是在Object本身就有的属性，直接更新返回
  if (key in target && !(key in Object.prototype)) {
    target[key] = val
    return val
  }
  // 缓存观察者
  const ob = (target).__ob__
  // 判断target是否是Vue实例或者根数据对象，如果是，则报错,所以
  if (target._isVue || (ob && ob.vmCount)) {
    process.env.NODE_ENV !== 'production' && warn('Avoid adding reactive properties to a Vue instance or its root $data ' + 'at runtime - declare it upfront in the data option.')
    return val
  }
  // 如果target不是响应式的，就直接返回修改后的值
  if (!ob) {
    target[key] = val
    return val
  }
  // 传入defineReactive方法，让target的key属性可响应式，然后触发观察者的依赖的notify()方法
  defineReactive(ob.value, key, val)
  ob.dep.notify()
  return val
}

const callbacks = []
let pending = false

// Here we have async deferring wrappers using both micro and macro tasks.
// In < 2.4 we used micro tasks everywhere, but there are some scenarios where
// micro tasks have too high a priority and fires in between supposedly
// sequential events (e.g. #4521, #6690) or even between bubbling of the same
// event (#6566). However, using macro tasks everywhere also has subtle problems
// when state is changed right before repaint (e.g. #6813, out-in transitions).
// Here we use micro task by default, but expose a way to force macro task when
// needed (e.g. in event handlers attached by v-on).
let microTimerFunc
let macroTimerFunc
let useMacroTask = false

function flushCallbacks () {
  pending = false
  const copies = callbacks.slice(0)
  callbacks.length = 0
  for (let i = 0; i < copies.length; i++) {
    copies[i]()
  }
}

export function nextTick (cb?: Function, ctx?: Object) {
  let _resolve
  callbacks.push(() => {
    if (cb) {
      try {
        cb.call(ctx)
      } catch (e) {
        handleError(e, ctx, 'nextTick')
      }
    } else if (_resolve) {
      _resolve(ctx)
    }
  })
  if (!pending) {
    pending = true
    if (useMacroTask) {
      /**
       * macroTimerFunc = () => {
       *   setImmediate(flushCallbacks)
       * }
      */
      macroTimerFunc()
    } else {
      /**
       * const p = Promise.resolve()
       * microTimerFunc = () => {
       *  p.then(flushCallbacks)
       * }
      */
      microTimerFunc()
    }
  }
  if (!cb && typeof Promise !== 'undefined') {
    return new Promise(resolve => {
      _resolve = resolve
    })
  }
}

export function initUse (Vue: GlobalAPI) {
  Vue.use = function (plugin: Function | Object) {
    // 缓存或初始化 installedPlugins
    const installedPlugins = (this._installedPlugins || (this._installedPlugins = []))
    // 若已经存在该plugin(引用相同)，返回
    if (installedPlugins.indexOf(plugin) > -1) {
      return this
    }

    // additional parameters
    const args = toArray(arguments, 1) // Convert an Array-like object to a real Array
    args.unshift(this)
    if (typeof plugin.install === 'function') {
      plugin.install.apply(plugin, args)
    } else if (typeof plugin === 'function') {
      plugin.apply(null, args)
    }
    installedPlugins.push(plugin) // this._installedPlugins同时会改变
    return this
  }
}

export function initMixin (Vue: GlobalAPI) {
  Vue.mixin = function (mixin: Object) {
    this.options = mergeOptions(this.options, mixin)
    return this
  }
}

export function initExtend (Vue: GlobalAPI) {
  /**
   * Each instance constructor, including Vue, has a unique
   * cid. This enables us to create wrapped "child
   * constructors" for prototypal inheritance and cache them.
   */
  Vue.cid = 0
  let cid = 1
  /**
   * Class inheritance
   */
  Vue.extend = function (extendOptions: Object): Function {
    extendOptions = extendOptions || {}
    const Super = this
    const SuperId = Super.cid
    const cachedCtors = extendOptions._Ctor || (extendOptions._Ctor = {})
    if (cachedCtors[SuperId]) { // 如果有通过该构造器和options对象构造的示例缓存，直接返回
      return cachedCtors[SuperId]
    }

    const name = extendOptions.name || Super.options.name // 读取name或Super的name
    if (process.env.NODE_ENV !== 'production' && name) {
      // 校验name属性值
      validateComponentName(name)
    }

    const Sub = function VueComponent (options) { // Sub类，调用Vue的构造函数_init
      this._init(options)
    }
    // 组合继承
    Sub.prototype = Object.create(Super.prototype)
    Sub.prototype.constructor = Sub

    Sub.cid = cid++
    // 合并options
    Sub.options = mergeOptions(
      Super.options,
      extendOptions
    )
    // 在./instance/init.js resolveConstructorOptions等方法中会用到这个字段
    Sub['super'] = Super

    // For props and computed properties, we define the proxy getters on
    // the Vue instances at extension time, on the extended prototype. This
    // avoids Object.defineProperty calls for each instance created.
    // 把props和computed放在原型链上，这样可以避免每次实例创建都要去调用Object.defineProperty
    if (Sub.options.props) {
      initProps(Sub)
    }
    if (Sub.options.computed) {
      initComputed(Sub)
    }

    // allow further extension/mixin/plugin usage
    Sub.extend = Super.extend
    Sub.mixin = Super.mixin
    Sub.use = Super.use

    // create asset registers, so extended classes
    // can have their private assets too.
    ASSET_TYPES.forEach(function (type) {
      Sub[type] = Super[type]
    })
    // enable recursive self-lookup
    if (name) {
      Sub.options.components[name] = Sub
    }

    // 保存一个Super.options的引用，在之后实例化的时候我们可以判断是否父类的options发生了更新
    Sub.superOptions = Super.options
    Sub.extendOptions = extendOptions
    Sub.sealedOptions = extend({}, Sub.options)

    // cache constructor 缓存
    cachedCtors[SuperId] = Sub
    return Sub
  }

  function initProps (Comp) {
    const props = Comp.options.props
    for (const key in props) {
      proxy(Comp.prototype, `_props`, key)
    }
  }
}

// 注册组件，传入一个扩展过的构造器
Vue.component('my-component', Vue.extend({ /* ... */ }))

// 注册组件，传入一个选项对象 (自动调用 Vue.extend)
Vue.component('my-component', { /* ... */ })

// 获取注册的组件 (始终返回构造器)
var MyComponent = Vue.component('my-component')

// directive
// 注册
// 钩子函数
Vue.directive('my-directive', {
  bind: function () {}, // 只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。
  inserted: function () {}, // 被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。
  update: function () {}, // 所在组件的 VNode 更新时调用
  componentUpdated: function () {}, // 指令所在组件的 VNode 及其子 VNode 全部更新后调用。
  unbind: function () {} // 只调用一次，指令与元素解绑时调用。
})

// 注册 (指令函数)
Vue.directive('my-directive', function () {
  // 这里将会被 `bind` 和 `update` 调用
})

// getter，返回已注册的指令
var myDirective = Vue.directive('my-directive')

// export const ASSET_TYPES = [
//   'component',
//   'directive',
//   'filter'
// ]
export function initAssetRegisters (Vue: GlobalAPI) {
  /**
   * Create asset registration methods.
   */
  ASSET_TYPES.forEach(type => {
    Vue[type] = function (
      id: string,
      definition: Function | Object
    ): Function | Object | void {
      // 如果没有传入definition, 则通过id去返回之前注册过的
      if (!definition) {
        return this.options[type + 's'][id]
      } else {
        /* istanbul ignore if */
        if (process.env.NODE_ENV !== 'production' && type === 'component') {
          // 校验components的名字
          validateComponentName(id)
        }
        if (type === 'component' && isPlainObject(definition)) {
          // 如果是component, 且传入的是个对象，则用component被初始化前的状态去调用extend
          definition.name = definition.name || id
          definition = this.options._base.extend(definition)
        }
        if (type === 'directive' && typeof definition === 'function') {
          // 如果是directive，且传入的是个函数，则给bind和update赋值
          definition = { bind: definition, update: definition }
        }
        // 注册
        this.options[type + 's'][id] = definition
        return definition
      }
    }
  })
}