javascript - Backbone.js: 将 View 、集合、模型分离到不同的js文件中，它们不能相互识别

Question

我用Backbone.js创建了一个web应用，所有的 View 、集合和模型都写到一个js文件中，成功了!

现在我想将它们分离到不同的 js 文件中，就像:

<script type="text/javascript" src="js/layermanagemodel.js"></script>       
<script type="text/javascript" src="js/layermanagecollection.js"></script>  
<script type="text/javascript" src="js/layermanageview.js"></script>    
<script type="text/javascript" src="js/boot.js"></script>

并在 jquery load 中加载模型代码:

$(function(){
    //Model
        var manageModel = Backbone.Model.extend({
                default:{
                    'selectedId':'unknow'
                },
                selectLayer:function(uuid){
                     this.set({"selectedId": uuid});
                },
                delLayer:function(){

                }
        }); 
})

但是 Firebug 告诉我错误:

manageModel is not defined
[Break On This Error]   

model: manageModel

在集合文件中

为什么如果将它们分开到不同的文件中，它们不能相互识别？我该如何解决这个问题？或者什么是正确的加载顺序？谢谢

Answer 1

添加函数包装器后:

$(function() {
    // ...
})

您引入了新的作用域，并且在这些函数内声明的所有 var 仅在这些函数内可见。您可以通过将它们设为全局(即 window 的属性)来解决这个问题:

$(function(){
    window.manageModel = Backbone.Model.extend({
        //...
    });
});

或者更好的是，引入一个应用程序命名空间:

$(function(){
    window.app = window.app || { };
    window.app.manageModel = Backbone.Model.extend({
        //...
    });
});

然后通过app引用事物，比如app.manageModel:

$(function(){
    window.app = window.app || { };
    window.app.someCollection = Backbone.Collection.extend({
        model: app.manageModel,
        //...
    });
});