2020前端面试题

1.vue相关知识

  <1>  vue.extend

   作用：使用基础 Vue 构造器，创建一个“子类” . Vue.extend返回的是一个扩展实例构造器，也就是预设了部分选项的Vue实例构造器。其主要用来服务于Vue.component，用来生成组件。可以简单的理解为当在模板中遇到该组件名称作为标签的自定义元素时，会自动调用扩展实例构造器来生产组件实例，并挂载到自定义元素上。https://www.w3cplus.com/vue/vue-extend.html © w3cplus.com

在Vue中创建一个Vue实例，大致经会经历四个过程：

  当Vue实例创建之后，可以看到Vue实例预设了很多参数：

 

 那么创建一个Vue.extend其实也有点类似，首先通过Vue.extend()来创建一个扩展实例构造器
vue.extend(options)   options是一个包含组件选项的对象

<div id="mount-point"></div>
var Profile = Vue.extend({
  template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
  data: function () {
    return {
      firstName: 'Walter',
      lastName: 'White',
      alias: 'Heisenberg'
    }
  }
})

// 创建 Profile 实例，并挂载到一个元素上。
new Profile().$mount('#mount-point')

可以看到，这个有new Vue()有点类似，除了我们预设的一些东西之外，Vue还给其预设了很多其他的东西

Vue的实例最终是要挂载到一个元素上，那么Vue.extend也是一样的，也需要挂载到一个元素上: