我的JavaScript架构(YUI3)有什么问题?

Whats wrong with my JavaScript architecture (YUI3)?

本文关键字:什么 问题 YUI3 JavaScript 架构 我的      更新时间:2023-09-26

我正在编写一个使用YUI3满足所有JS需求的web应用程序。我需要的功能,如工具提示,工具提示的内容是由AJAX查询,切换按钮等确定。

我不确定谁来构建一个体系结构来实现这一切。我采取了以下方法

var Myapp = function(){
    this.toggleButton(node,config)
    {
        YUI().use(....,function(Y){
            //code to convert NODE into a toggle button;
        });
    }
    return this;
};

在我的应用程序中,我通过调用

将所有按钮转换为切换按钮
var app = Myapp(); 
app.toggleButton(Y.all('.toggle-buttons'),{'text1':'TOGGLE_ME','text2':'TOGGLED_ME'});

所有这些都有效。但我想从更有经验的开发者那里了解这种方法是否存在根本性的错误。

这是使用JavaScript的好方法吗?

return this;

这是不必要的,因为函数构造函数默认返回this

var app = Myapp();

您忘记在没有new关键字的情况下调用new Myapp(), this将是窗口对象,您将有效地写入全局作用域。

你的代码中有一个基本的问题:

var MyApp = function(){
    this.toggleButton(node,config)
    {
     ...

您没有为MyApp定义函数。相反,每次实例化toggleButton时都尝试调用toggleButton。它应该失败,因为函数未定义


在您的示例中,不需要类定义和实例化,因为MyApp被用作实用程序。

您可以将MyApp定义为静态对象:

var MyApp = {
    toggleButton: function toggleButton() {
        // your code
    }
};

你可以在任何地方使用

MyApp.toggleButton();