如何组织的jQuery在我的应用程序

所以我得到的地方，我需要利用揭示模块模式或对象文本模式，或者是他们相同的模式呢？我不知道。我了解揭示模块模式使用闭包，但我的知识还不深。揭示模块模式我已经研究过，并且有点熟悉它。如何组织的jQuery在我的应用程序

我现在的情况是我使用jqGrid，我想将常见设置和事件函数合并到一个core.js或global.js文件中，然后重用所有这些设置和回调函数（如onSortCol func）每次我创建一个新的jqGrid。我希望能够添加或编辑jqGrid的默认设置/选项，这使我不知道如何使用对象字面模式或揭示模块模式将其设置为global.js文件中的默认设置。

我看这篇文章了：

http://rmurphey.com/blog/2009/10/15/using-objects-to-organize-your-code/

而且很快我想更好地了解一下这个代码是这样做的：

var myFeature = { 
    config : { 
     wrapper : '#myFeature', 
     container : 'div', 
     urlBase : 'foo.php?item=' 
    }, 

    init : function(config) { 
     $.extend(myFeature.config, config); 
     $(myFeature.config.wrapper).find('li'). 
      each(function() { 
       myFeature.getContent($(this)); 
      }). 
      click(function() { 
       myFeature.showContent($(this)); 
      }); 
    }, 

    buildUrl : function($li) { 
     return myFeature.config.urlBase + $li.attr('id'); 
    }, 

    getContent : function($li) { 
     $li.append(myFeature.config.container); 
     var url = myFeature.buildUrl($li); 
     $li.find(myFeature.config.container).load(url); 
    }, 

    showContent : function($li) { 
     $li.find('div').show(); 
     myFeature.hideContent($li.siblings()); 
    }, 

    hideContent : function($elements) { 
     $elements.find('div').hide(); 
    } 
}; 

$(document).ready(function() { myFeature.init(); });

就让我们先从初始化函数。首先，配置“成员”是myFeature对象中的一个对象，是否正确的措辞？其次，init“成员”也是myFeature对象字面值中的一个对象，或者因为它是一个函数，它的概念化方式与myFeature的配置“成员”不同？第三，配置的范围可以传递给init函数，就像它在myFeature对象中那样？展望这个代码在我希望有做这在我的doc.ready：

$(document).ready(function() { 
    var myF = new myF(); //new keyword not needed but can declared to emulate familiar 
    object oriented programming concepts is what I think 
    myF.init(myF.config); //I know I don't have to do this and this doesn't even make exact 
    sense but just trying to express how my brain is working on this right now 
});

我会从那里开始，看看我得到了什么样的答案，并相应地调整我的问题。

UPDATE 所以配置和init是可以传递一个可选的配置对象，以免被覆盖并追加传递配置到目标myFeature.Config我的功能和init（）的性质。

下一个问题，在init执行有$ .extend（myFeature.config，配置）。为什么不是$ .extend（this.config，config）行？这是我认为我想要使用揭示模块模式的地方，因为我可以定义一个名为“self”的变量，并在整个包含myFeature的成员中引用这个。我不明白在对象字面模式中，init属性如何在函数内访问myFeature。看来我的功能是全局范围和它的所有属性和本身可以由任何人在任何时候访问，我知道这是JavaScript的性质，但...

提前感谢！

来源

2014-01-22 Brian Ogden

你到底在问什么？ –

如果我针对每个问题在SO上创建单个问题，会不会更好？总体问题是关于javascript/jQuery中的模式的一个主题，所以我发现它将自身构建成一个简洁的问题，许多开发人员希望快速理解未来流行的JavaScript模式可以参考的答案。 –

首先，这些“成员”是属性。

“一个对象是属性的集合，并且有一个原型对象，原型可能是空值。 ^{ECMA 4.3.3 object}

接着，init仅仅是一个函数，被分配给myFeature对象属性init。函数的核心也是对象brief demo。

函数是一个“对象类型的构件，其是标准的内置功能构造的一个实例，并且可以被调用作为子程序。除了它的命名属性，功能包含可执行代码和状态，确定它在调用时的行为。“

第三，如果您希望包含任何其他属性，则传入的config的范围是。 jQuery的扩展（$.extend(obj1,obj2)）从obj2（一个对象）获取属性，然后将它们放在obj1上（也是一个对象，并且总是预先配置myFeature.config）simple demo。

来源

2014-01-22 01:13:12

我看到so config是一个可选的参数，可以传递给init！完美的感觉！ –

如果您不介意退房，我基于您的有用答案添加了对我的问题的更新。 –

要回答你的问题：

下一个问题，在init执行有$ .extend（myFeature.config，配置）。为什么不是$ .extend（this.config，config）行？这是我认为我想要使用揭示模块模式的地方，因为我可以定义一个名为“self”的var，并在整个包含myFeature的成员中引用此变量。我不明白在对象字面模式中，init属性如何在函数内访问myFeature。看来我的功能是全局范围和它的所有属性和本身可以由任何人在任何时候访问，我知道这是JavaScript的性质，但...

JavaScript并变量提升，这意味着解释器会做2通过你的脚本块。第一遍将把任何函数和变量声明提升到脚本块的顶部。第二遍将执行在脚本块中声明的任何初始化。下面的自执行脚本块很容易演示如何起吊。

// Original function block 
var foo = 'string1'; 
(function() { 
    alert(foo); // alerts undefined 
    var foo = 'string2'; 
})(); 


// First pass, hoisting variables 
var foo = 'string1'; 
(function() { 
    // The var `foo` is hoisted to 
    // the top of the script block 
    var foo; 
    alert(foo); 
    foo = 'string2'; 
})();

一旦吊装完成，代码将被执行。当地var foo已被悬挂并在alert函数之上声明，因此当alert试图访问foo时，它是undefined，因为它是已声明的但未初始化的。变量myFeature get被挂起，不管它是全局还是包含在它自己的闭包中。这使它可以与对象字面值中包含的其他属性一起使用。

另外要注意的是，使用new运算符不需要对象字面模式实例化。你也不会得到私人方法或属性。 $.extend(myFeature.config, config);myFeature可以存在，myFeature.config可能不存在。在运行时向对象字面值myFeature添加或覆盖当前属性或方法也很容易。你可以在这里阅读更多关于不同的JS模式：http://addyosmani.com/resources/essentialjsdesignpatterns/book/

来源

2014-01-22 08:27:34 psyrendust

如何组织的jQuery在我的应用程序

回答

相关问题