封装原生的JS，vue中封装全局使用的函数

function fun () {
alert (this) //指向的是函数事件调用者
}
fun () 这里的this，指向的是window
new fn() new 的函数指向的不是window而是指向了该函数新的对象，目的是改变指针，创建对象实例
function fun1 () {
this.x= 10
}
var aa = new fun1()
aa.x

原型 让某一个大类都有某个方法
var arr = []
arr.run = function () {
alert(‘123’)
}
arr.run()
var arr1 = []
arr1.run() // 报错没有这个方法
那如何让只要是数组，就拥有run 这个方法呢？
换句话我们定义的函数无论谁使用都有这个方法
这个时候可以使用prototype 原型来实现
Array.prototype.run = function {
// 只要是数组都会调用这个方法
alert(‘415’)
}
var aa = []
aa.run()
var bb = []
bb.run()
都会弹出415

JS封装原型函数

在vue项目中，我们组要一些全局的JS函数，随处使用，如何做呢？
首先我们在项目中创建一个JS文件，然后用export default 导出去

export default {
  install (Vue, options) {
 }
}

在main.js 中注册使用：

import processData from '@/js/processData.js'
Vue.use(processData)

就可以在全局中使用了

在公用JS文件中定义vue原型函数

export default {
  install (Vue, options) {
    // 处理饼图数据
    Vue.prototype.processPieData = function (title, series) {
      this.title = title
      this.seriesData = series
      let legendData = []
      let piedata = {}
      for (let v of this.seriesData) {
        legendData.push(v.name)
      }
      piedata.title = this.title
      piedata.seriesData = this.seriesData
      piedata.legendData = legendData

      return piedata
    }
    }
    }

如何使用定义的processPieData 函数？
let aa = this.processPieData(title, seriesData) 使用this来调用
我们可以将公共的JS都放在这个文件中，使用prototype定义的vue全局韩式可以实现全局使用。