API的设计和jQuery [英] API design and jQuery

问题描述

我经常听到的jQuery取得了一些可怜的API的决定。虽然jQuery是不是我喜爱的图书馆是我最常使用图书馆，我觉得很难在API的设计指出了具体的错误或它如何能得到改善。

I have often heard that jQuery has made some poor API decisions. Although jQuery is not my favourite library it's the library I've used most often and I find it hard to point out specific mistakes in the API design or how it could have been improved.

什么jQuery的API的一部分可能已经做得比较好，如何可能它已经实施的不同和为什么将不同的实现会更好？

What parts of jQuery's API could have been done better, how could it have been implemented different and why would that different implementation be better?

问题延伸到两个低水平个别细节的API和高层次细节的API 。我们只谈论API中的缺陷而不是在图书馆的高层设计/目的的缺陷，jQuery的仍然是围绕一个选择器引擎为中心的DOM操作库。

The question extends to both low level individual details of the API and high level details of the API. We are only talking about flaws in the API rather then flaws in the high level design / purpose of the library, jQuery is still a DOM manipulation library centred around a selector engine.

由于API中流行的库冻结的必要性，jQuery的是停留在它的当前状态和开发商都做的非常出色。如通过最近看到 .attr VS .prop 改变开发人员不必灵活地更改任何他们的设计决策（这是一种耻辱！）。

Because of the necessity of API freezing in popular libraries, jQuery is stuck in it's current state and the developers are doing a great job. As can be seen by the recent .attr vs .prop change the developers do not have the flexibility to change any of their design decisions (which is a shame!).

一个具体的例子我能想到的会是

One specific example I can think of would be

$。每个（函数（KEY，VAL）{}）

VS

$。gr​​ep的（功能（VAL，键）{}）

这是令人困惑，以至于我不得不仔细检查一下参数是频繁。

which is confusing enough that I have to double check what the parameters are frequently.

请不要比较了jQuery的库的到羽翼丰满的框架的像Dojo和YUI和抱怨缺乏特色。

Please do not compare the jQuery library to full fledged frameworks like dojo and YUI and complain about lack of features.

推荐答案

• .load（）有过多的依赖于传递的参数完全不同的行为

• .load() is overloaded with entirely different behavior depending on the arguments passed

  .toggle（）有过多的依赖于传递的参数完全不同的行为

  .toggle() is overloaded with entirely different behavior depending on the arguments passed

  的的jQuery（）功能太多超载也许吧。

  too much overloading of the jQuery() function perhaps.

  的 .attr（）你提到。从性能的区别应该是立即IMO。

  the .attr() you mentioned. The distinction from properties should have been immediate IMO.

  .MAP（KEY，VAL），但 $。图（VAL，键），和在这个值是不同的。

  .map( key,val ) but $.map( val,key ), and the this values are different.

  非标选择应该被国际海事组织拒之门外滋滋声。基于JavaScript引擎的选择应以数年后已经过时，人们迷上了专有的选择将有更艰难的转型

  non-standard selectors ought to have been kept out of Sizzle IMO. Javascript based selector engines should become obsolete in a number of years, and people hooked on the proprietary selectors will have a more difficult transition

  像的方法，贫穷方法命名.closest（）或 .live（）。正是他们做什么呢？

  poor method naming of methods like .closest() or .live(). What exactly do they do?

  最近我发现，你不能设置标准宽度和高度通过属性<创建一个新的元素时，code>道具参数。 jQuery的运行其自己的宽度和高度方法来代替。 IMO，该规范的属性应该被优先考虑，特别是因为宽度和高度可以通过<$ C $来设置C> CSS 。

  I recently discovered that you can't set the standard width and height attributes via the props argument when creating a new element. jQuery runs its own width and height methods instead. IMO, the spec attributes should have been given priority, especially since width and height can be set via css.

  $('<img/>', { 
      css:{width:100, height:100},
      width:100, // <-- calls method, why?
      height:100, // <-- calls method, why?
  });
  

  
  

  • $。获得（）和获得（）是完全不同的。

    获得（）和 .toArray（）传递没有参数的时候是一样的。

    .get() and .toArray() are identical when passing no arguments

    的toArray（）和 $。makeArray（）有效地做同样的事情。他们为什么不给他们像。每（）的同名和 $。每个（）？

    toArray() and $.makeArray() do effectively the same thing. Why didn't they give them the same name like .each() and $.each()?

    两个不同的事件委派的方法。 .delegate（）的明智的，而 .live（）神奇的哇，它只是工作！的之一。

    two different event delegation methods. .delegate() the sensible one, and .live() the magical "wow, it just works!" one.

    的.index（）有过多的3行为，但他们之间的分歧可能会造成混淆

    .index() is overloaded with 3 behaviors, but their differences can be confusing

     // v---get index   v---from collection (siblings is implied)
    $('selector').index();
     // v---from collection   v---get index
    $('selector').index(element);
     // v---get index      v---from collection
    $('selector').index('selector');
    

    如果你还记得，这只是工作的第一个元素上的第一个是可以理解的。

    The first one is understandable if you remember that it only operates on the first element

    第二个是很有道理的，因为jQuery方法一般的对整个收集工作。

    The second one makes the most sense since jQuery methods usually operate on an entire collection.

    第三个是完全混乱。该方法不会给出指示，其中选择器是收集和选择重新presents从集合中要其索引的元素。

    The third one is entirely confusing. The method gives no indication of which selector is the collection and which selector represents the element whose index you want from the collection.

    为什么不只是消除了第三个，并有人们使用的第二个这样的：

    Why not just eliminate the third one, and have people use the second one like this:

     // v---from collection      v---get index
    $('selector').index( $('selector') );
    

    此方式，它使用jQuery的其余部分，其中的.index（）对整个收集工作更紧密地配合。

    This way it fits more closely with the rest of jQuery where .index() operates on the entire collection.

    或者至少扭转选择的意义，以适应更好的：

    Or at least reverse the meaning of the selectors to fit in better:

     // v---from collection   v---get index
    $('selector').index('selector');
    

    ---

    下面是另一个想想反正。

    ---

    Here's another to think about anyway.

    我有jQuery的事件处理/数据存储系统的担忧。这是称赞，因为它不能够紧密围绕其他元素[事件] 属性添加功能，在IE浏览器创建内存泄漏。相反，它把一个轻量级的expando属性，它映射到一个条目 jQuery.cache ，它保存处理程序和其他数据。

    I have some concerns with jQuery's event handling/data storage system. It is praised because it doesn't add functions to on[event] properties that can close around other elements, creating memory leaks in IE. Instead it places a lightweight expando property, which maps to an entry in jQuery.cache, which holds handlers and other data.

    我相信那么重视，在依次调用您指定的处理程序的处理程序。或者类似的东西。

    I believe it then attaches a handler with in turn invokes the handler that you assigned. Or something like that.

    不管是什么系统其实并不重要。的一点是，该元件（S）和在 jQuery.cache 是的expando之间的连接。

    Whatever the system is doesn't really matter. The point is that the connection between the element(s) and the jQuery.cache is that expando.

    这是为什么一个大问题？那么哲学jQuery是不是一个框架;它是一个库。这似乎是一个图书馆，你应该能够使用或不使用jQuery的功能，而无需不利影响表示关注。然而，如果你删除从DOM元素时去外面的jQuery，你已经成为孤儿的处理程序，并通过的expando这些元素相关联的其他数据，创建一个很好的和完全的跨浏览器的内存泄漏。

    Why is that a big deal? Well philosophically jQuery is not a framework; it is a library. It would seem that as a library you should be able to use or not use the jQuery functions without concern for negative effects. Yet if you go outside jQuery when removing elements from the DOM, you've orphaned any handlers and other data associated with those elements via the expando, creating a nice and fully cross-browser memory leak.

    因此​​，例如，一些为 el.innerHTML =''简单可能是非常危险的。

    So for example, something as simple as el.innerHTML = '' could be very dangerous.

    与 jQuery.noConflict（）功能夫妇这一点。这使开发人员能够使用jQuery与利用 $ 全局命名空间中的其他库。那么，如果这些库之一删除哪一些元素？同样的问题。我有一种感觉，需要使用像 Prototypejs 沿侧的jQuery库可能不知道足够的JavaScript开发人员做出好的设计决策，并会受到这样的如我所描述的问题。

    Couple this with the jQuery.noConflict() feature. This enables developers to use jQuery with other libraries that utilize the $ global namespace. Well what if one of those libraries deletes some elements? Same problem. I have a feeling that the developer that needs to use a library like Prototypejs along side jQuery probably doesn't know enough JavaScript to make good design decisions, and will be subject to such a problem as I've described.

    在图书馆的预期理念中的改进方面，据我所知，他们的理念是做多，写得少什么的。我认为他们实现这个目标非常好。你可以写一些非常简洁而前pressive code，会做工作的大量。

    In terms of improvements within the intended philosophy of the library, as far as I know, their philosophy is "Do more, write less" or something. I think they accomplish that very well. You can write some very concise yet expressive code that will do an enormous amount of work.

    虽然这是很不错的，在某种程度上我认为它是一个负面的东西。你可以做这么多，这么容易，这是非常方便初学者写了一些非常糟糕的code。这将是很好，我认为，如果有一个开发版本记录该库的误用的警告。

    While this is very good, in a way I think of it as something of a negative. You can do so much, so easily, it is very easy for beginners to write some very bad code. It would be good I think if there was a "developer build" that logged warnings of misuse of the library.

    一个常见的​​例子是运行在一个循环中的选择器。 DOM的选择是非常容易做到的，它好像你每当你需要一个元素时只是运行一个选择，即使你只是跑了选择。的改进，我认为将是的jQuery（）函数来记录一个选择的重复使用，并给出一个控制台。请注意，选择器可以被缓存。

    A common example is running a selector in a loop. DOM selection is very easy to do, that it seems like you can just run a selector every time you need an element, even if you just ran that selector. An improvement I think would be for the jQuery() function to log repeated uses of a selector, and give a console note that a selector can be cached.

    由于jQuery是那么普遍，因此，我认为这将是一件好事，如果他们不仅使它容易被一个JavaScript / DOM程序员，但也帮助你成为一个更好的。

    Because jQuery is so dominant, I think it would be good if they not only made it easy to be a JavaScript/DOM programmer, but also helped you be a better one.

    这篇关于API的设计和jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！