【问题标题】：JavaScript Period Functionality: How do I setup a library like jQuery did [closed]JavaScript 周期功能：如何设置像 jQuery 一样的库 [关闭]
【发布时间】：2017-01-13 07:15:47
【问题描述】：

简介#（已编辑）

大家好，我正在建立一个 JavaScript 库，它是为我们设计的 AJAX 并连接到多个 PHP，然后连接到数据库。（相当肯定这就是你所说的 API）。不过，为了让我的团队更轻松，我想设置某种初始化对象，例如 jQuery 中的 $。有人可以帮我指出正确的数据类型吗？

示例

// Pull new user data from fields
var username = $.("#usernamefield").val();
var password = $.("#userpassfield").val();

// Send data to library through
API.AddUser(username, password);

// Sorry for any syntax errors, this is just example code

潜在解决方案

我确实考虑过使用班级系统，但我做了一些研究，似乎有更好的方法。有人可以帮忙解释一下 jQuery 是如何设置他们的库的吗？

澄清

有些人问我为什么不只使用 jQuery。嗯，事实上，我是。我正在使用 jQuery 并构建这个单独的库来使用 PHP 上传信息。他们两个是苹果和橙子，但我确实想要一个像 jQueries "$" 这样的初始化程序 - 有人可以解释一下他们是如何做到的吗？

【问题讨论】：

如果您想做类似 jQuery 的事情，为什么不直接使用 jQuery .... 在您的“示例”中，API 与 $ 有什么关系？ zepto 应该是一个精简的类 jQuery 库，开发源代码被大量注释，所以你可以从中“学习”
我正在使用 jQuery，但我也想构建一些我自己的函数，这些函数保存在一个对象中。
我从来没有意识到 JavaScript 是多么的动态。来自 Python 背景，这有点疯狂。我将修改我的问题以更准确

标签： javascript php jquery class api-design

【解决方案1】：

你应该这样做：

在您可以调用 API.js 的 JS 模板中，您将拥有以下内容：

 ;(function($){

    /* ========================================================
    /* Global variables */
    /* =======================================================*/
    var api = null;

   /* ========================================================
    /* Ajax calls */
    /* =======================================================*/

    var API = function(args)
    {
        // Api methods 

        this.AddUser = function (username, password)
        {

            //To do Ajax call
        }

        this.DeleteUser = function(id)
        {
            //To do Ajax call
        }

        // ... More api methods
    };

   /* ========================================================
    /* Main function */
    /* =======================================================*/

    jQuery.fn.API = function( args )
    {
        api = new API(args);
        return api;
    };


})(jQuery);

然后，当您需要进行 Ajax 调用时，您只需使用任何所需的参数初始化一个 API 对象，如下所示：

$(function() {
     //Note: you can pass global arguments.
    var API = $().API();

    //You can then make your api calls with required values

    // Pull new user data from fields
    var username = $("#usernamefield").val();
    var password = $("#userpassfield").val();

    // Send data to library through
    API.AddUser(username, password);

});

【讨论】：

我确实将我的代码更新为类似的东西。变种 API； API.AddUser = function() { /*Stuff*/ } 这会是一个有效的方法吗？
我不明白为什么不会。这都是关于你想要完成的事情。

【解决方案2】：

不太确定您的想法，但您似乎想设置一个带有状态信息的函数。一种方法是将其放入闭包中。可能是这样的：...

`
 var connect = function(username,password){

                  //perhaps do some stuff here

                  return function(a,b,c){
                            //do connection stuff using 
                            // username, password and a,b,c
                         }
               };
`

Then you can set up your connection function:

`
  fredsConnection = connect( 'fred', 'piglet');
`

这为您提供了一个内置 Fred 凭据的连接功能，因此现在任何时候他需要连接：

`
fredsConnection('widgets', 'v2','green')

` 他可以调用他的连接函数并传递必要的数据

【讨论】：