initExtend() — vue Function Reference

Architecture documentation for the initExtend() function in extend.ts from the vue codebase.

Function typescript CompilerSFC DescriptorParser calls 3 called by 1

Entity Profile

CompilerSFC→ DescriptorParser→ initExtend() — vue Function Reference

Dependency Diagram

graph TD
  14862e78_4e1b_a138_5d8b_d69973ce321b["initExtend()"]
  1aa88392_154b_6e6d_97dc_8ac29df42778["initGlobalAPI()"]
  1aa88392_154b_6e6d_97dc_8ac29df42778 -->|calls| 14862e78_4e1b_a138_5d8b_d69973ce321b
  b6fb05fd_b015_6b22_977c_6534594c61d5["getComponentName()"]
  14862e78_4e1b_a138_5d8b_d69973ce321b -->|calls| b6fb05fd_b015_6b22_977c_6534594c61d5
  ecc8a243_a0d7_dbfe_d0d7_8a89943041cf["initProps()"]
  14862e78_4e1b_a138_5d8b_d69973ce321b -->|calls| ecc8a243_a0d7_dbfe_d0d7_8a89943041cf
  13d1baef_6bea_6a9a_dcef_508dfa47a6ca["initComputed()"]
  14862e78_4e1b_a138_5d8b_d69973ce321b -->|calls| 13d1baef_6bea_6a9a_dcef_508dfa47a6ca
  style 14862e78_4e1b_a138_5d8b_d69973ce321b fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/core/global-api/extend.ts lines 8–80

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: any): typeof Component {
    extendOptions = extendOptions || {}
    const Super = this
    const SuperId = Super.cid
    const cachedCtors = extendOptions._Ctor || (extendOptions._Ctor = {})
    if (cachedCtors[SuperId]) {
      return cachedCtors[SuperId]
    }

    const name =
      getComponentName(extendOptions) || getComponentName(Super.options)
    if (__DEV__ && name) {
      validateComponentName(name)
    }

    const Sub = function VueComponent(this: any, options: any) {
      this._init(options)
    } as unknown as typeof Component
    Sub.prototype = Object.create(Super.prototype)
    Sub.prototype.constructor = Sub
    Sub.cid = cid++
    Sub.options = mergeOptions(Super.options, extendOptions)
    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.
    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
    }

    // keep a reference to the super options at extension time.
    // later at instantiation we can check if Super's options have
    // been updated.
    Sub.superOptions = Super.options
    Sub.extendOptions = extendOptions
    Sub.sealedOptions = extend({}, Sub.options)

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