Question

我正在设计一个HTML5在线视频游戏的结构，我想使用一些名称空间来组织我的所有功能和类，所以这个想法刚好在几分钟前发现给我，但我不知道如果它是最好的：

(
    function () 
    {
        var xhr = new XMLHttpRequest();

        function load (file) 
        {
            xhr.open('GET', file, false);
            xhr.send();

            return xhr.responseText;
        }

        eval // Imported files
        (
            load('func.js') + 
            load('class.js')
        );

        function main () 
        {
            func();
            var instance = new Class();
            alert(instance.getMessage());
        }

        window.addEventListener('load', main, false);
    }
)();

func.js：

function func () 
{
    alert('This is an imported function.');
}

Class.js

function Class () 
{
    this.getMessage = function () 
    {
        return "This is an imported class.";
    }
}

我喜欢这个，因为它看起来像PHP中的文件导入模型，当我需要调用每个函数时，我会避免这么多冗长的事情，但我不确定，你怎么看待它？

Answer 1

我建议使用已经实现的模型，例如RequireJS。这会处理JS文件的加载和代码模块化到类结构中。它还具有许多实用程序的附加好处，可以让您合并文件以进行生产，这很好，因为您通常希望通过HTTP加载较少数量的文件以提高速度。

通过上面的示例，您仍然存在污染全局命名空间的问题。不这样做的好方法如下：

(function(){

  // private
  var thoughts = 'meow';
  var say = function(sound) {
    console.log(thoughts);
  };

  // public
  var feet = ['left', 'right'];
  var talk = function(){
    say(thoughts);
  };

  // expose
  window.cat = {
    talk: talk,
    feet: feet
  };

}()); // self running function

console.log('My cat has ' + cat.feet.length + ' feet');
console.log(cat.talk);

这是防止JavaScript中命名空间污染的好方法吗？

1 个答案: