使用jQuery.getScript()分配后,全局变量未定义

时间:2014-10-09 02:35:52

标签: javascript jquery global-variables getscript

我有几个全局变量; var1, var2等等......

我不会立即实例化这些变量,但我稍后会使用jQuery从我拥有的单独javascript文件中的构造函数中实例化它们。

然而;在我使用getScript()进行实例化之后;我尝试访问新实例化对象的属性;

我收到以下错误:

未捕获的TypeError:无法读取属性' x'未定义的

有没有理由;或者你不能用这种方式实例化全局变量吗?

getScript()的代码;

var functionLoadObjects = function(){
    $.getScript('objects.js',function(){
        //objects
        gameScreen= new GameObject(0,0,750,1500,'Art_Assets/game_screen/Colabrative Layout copy.png',0);

        menu= new GameObject(0,0,750,750,'Art_Assets/main_menu/bkg_start2.png',0);
        startBtn= new GameObject(50,50,65,160,'Art_Assets/main_menu/btn_play.png','Art_Assets/main_menu/btn_playh.png');
        creditBtn= new GameObject(50,150,65,160,'Art_Assets/main_menu/btn_help.png','Art_Assets/main_menu/btn_helph.png');
        credits= new GameObject(0,0,750,750,'Art_Assets/credits.png',0);
        //stations
        sawStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"sawView");
        drillStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"drillView");
        bendStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"bendView");
        weldStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"weldView");
        grindStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"grindView");
        paintStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"paintView");
        assemblyStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"assemblyView");
        fabricStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"fabricView");
        sewingStation= new WorkStation('Art_Assets/game_screen/workstation.png',0,"sewingView");
        console.log(startBtn.x,"startBtn X inside of loader function");
        console.log("stuff is happening")
        loadImg(menu);
        loadImg(startBtn);
        loadImg(creditBtn);
        loadImg(credits);
        loadImg(sawStation);
        loadImg(drillStation);
        loadImg(gameScreen);
        loadImg(bendStation);
        loadImg(weldStation);
        loadImg(grindStation);
        loadImg(paintStation);
        loadImg(assemblyStation);
        loadImg(fabricStation);
        loadImg(sewingStation);


        station = [ sawStation,drillStation,bendStation,
            weldStation,grindStation,paintStation,
            assemblyStation,fabricStation,sewingStation];



        for(var i=0; i<9; i++){
            station[i].position=i;
        }
        desk= new GameObject(250,550,128,256,'Art_Assets/game_screen/desk.png',0);
        loadImg(desk);
        office=new GameObject(750,0,750,750,'Art_Assets/game_screen/office.png',0);
        loadImg(office);

    })
};

主要方法:

var main = function () {
var now = Date.now();
var delta = now - then;
functionLoadObjects();
window.addEventListener('mousemove', tracker, false);
console.log(startBtn.x, "Outside of function call startBtn.x");
update(delta / 1000);
render();
then = now;
requestAnimationFrame(main);

};

console方法的main行中发现错误;由于x未定义,因此无法访问属性startBtn;但是所有的按钮和其他变量都是在js文件的头部定义的。

1 个答案:

答案 0 :(得分:3)

$.getScript是一个异步函数 - 它的success处理程序在脚本文件的内容从服务器到达之后执行 - 在main完成之后,而console.log(startBtn.x, ...被执行立即。

var functionLoadObjects = function(callback){
  $.getScript('objects.js',function(){
    ... your code ...
    callback();
  });
}

var main = function () {
  var now = Date.now();
  var delta = now - then;
  functionLoadObjects(function() {
    // put here all code that needs things from dynamically loaded script, such as:
    console.log(startBtn.x, "Outside of function call startBtn.x");
  });
};