vue源码为什么vue是一个方法而不是一个calss类

最新推荐文章于 2022-09-19 07:37:11 发布

qq_27449993

最新推荐文章于 2022-09-19 07:37:11 发布

阅读量321

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/qq_27449993/article/details/118417519

版权

Vue源码中采用函数而非Class，是因为它通过xxxMixin函数将功能扩展到prototype上，便于模块化管理和代码维护。这种方式使得在不同模块中分散实现功能成为可能，对于Class来说难以实现。

摘要由CSDN通过智能技术生成

// 引入模块
import { initMixin } from './init'
import { stateMixin } from './state'
import { renderMixin } from './render'
import { eventsMixin } from './events'
import { lifecycleMixin } from './lifecycle'
import { warn } from '../util/index'
// 什么时候需要把代码放到util包呢，个人感觉如果代码能够复用而且脱离项目能够应用到另一个项目可以考虑放到util
/*
    构造函数 大家在这里可能会觉得，既然选择打包工具，那为啥不选择class呢，应该是和后边需要定义Vue静态方法和属性有关，
    es6语法暂不支持对静态属性的定义
*/
function Vue (options) {
  // this instanceof Vue 可以判断函数是不是 new关键字调用
  if (process.env.NODE_ENV !== 'production' &amp;&amp;
    !(this instanceof Vue)
  ) {
    // 封装好的警告方法 console.warn();
    warn('Vue is a constructor and should be called with the `new` keyword')
  }
  // 调用初始化方法
  this._init(options)
}

/* 
  Mixin 混入的意思在这里大家可以理解成扩展
  以下方法在vue prototype 中扩展方法
  这里通过不同的函数来给vue prototye添加不同的功能,
  这种代码拆分思想很值得借鉴，尤其是在写复杂逻辑，
  将复杂逻辑拆分成不同的功能，这样代码清晰方便维