js有变量提升，怎样才能使用当前定义的变量？

Question

在普通的H5里面写以下js代码是可以获取到commonStatus状态的，但是我在Vue里面，单独写了一个公共方法js文件，在这个公共文件也是写的以下代码，获取到的commonStatus是undefined。

虽然可以用window全局变量设置，除了这种方法有没有其他方法可以获取到了？

望各位大神指教。

var commonStatus = false;
var commonObj ={
    curobj1:function(){
        console.log(commonStatus);
    }
}

还有我直接设置对象值比如commonObj.curobj2 = true;
在commonObj的某个方法里面调用commonObj.curobj2获取到的也是undefined。

Answer 1

在vue里，你要import引入你这个公共文件，而且还需要在这个公共文件中export暴露出一些变量。
比如

// common.js
var commonStatus = false;
export var commonObj ={
    curobj1:function(){
        console.log(commonStatus);
    }
}

// xxx.vue
import {commonObj} from './common.js';
commonObj.curobj1(); // false 这里会正常输出false

Answer 2

正确的写法：

let commonStatus = false
export default {
    curobj2: true,
    getCommonObj() {
        return commonStatus
    },
    setCommonObj(value) {
        commonStatus = value
        console.log(commonStatus)
    }
}

使用的时候：

import common from './common.js'
common.setCommonObj(true)
console.log(common.getCommonObj()) // true
console.log(common.curobj2) // true

在公共 js 文件中使用 vue.prototype：

import Vue from 'vue'
let vm = new Vue()
console.log(vm.isApp)