新书：《jQuery、jQuery UI 和 jQuery Mobile》

《 jQuery、jQuery UI 和 jQuery Mobile 》是 Adriaan de Jonge 和 Phil Dutson 合著的新书。该书向读者介绍了各种 jQuery 库，并讲述了 jQuery 提供的插件架构。作者假定该书的读者具备基本的 HTML 和 JavaScript 知识，但在编排上仍是先从每个 jQuery 库的最基础的知识讲起，然后再逐步深入到更高级的主题。

该书分为 4 部分——前三部分分别讲述 jQuery 核心、jQuery UI 和 jQuery Mobile，最后一部分讲述插件相关知识。每部分又划分为多个章节以描述各种高级场景。每一章包括若干 攻略，而每个攻略又提供了一个或多个例子。这些攻略直指前端开发人员的各种实践，使他们能更加容易地找到所需的特定 API。最后一部分解释了怎样创建可重用的插件，并介绍了一些常用插件以及它们的用法。

InfoQ 联系了 Phil，请他谈谈书中内容的更多信息，以及其他和 JavaScript 开发相关的知识。

InfoQ**：有些函数，比如append()和appendTo()，它们语法不一样，但功能相同 ****——这仅仅是语法糖，还是有其他更重要的原因使得jQuery**需要为同一功能提供多种实现方式？

Phil Dutson：就像你所说的，那些方法主要是“语法糖”，做的事情其实是一样的。我喜欢根据编程的不同场景来划分它们。如果需要插入硬编码的元素或者跟在静态实例后面的元素，我倾向于使用.append() 方法。如果需要处理包含多个元素或者动态数据的对象，我则倾向于使用.appendTo() 方法。我想重点推荐的做法是：为怎样使用它们建立规则并坚持这些规则。否则，为了搞清楚为什么这个地方使用了 append() 而那个地方却使用了 appendTo() 而回头重新审视代码，会使你头昏脑胀的。

InfoQ**：书中涉及到JSONP并提到使用其进行跨站（cross-site）请求的固有安全威胁 **——你能在这里再解释下吗？存在可行的替代方案吗？

Phil Dutson：当使用 JSONP 时，在代码层面你只能是完全信任你所请求数据的服务器或 Web 服务的。这意味者如果服务器或者 Web 服务发出的是被恶意注入了的 JSON 数据，你再将这些数据直接给发送请求的客户端，其结果可能是灾难性的。许多社交平台（包括 Google+、Twitter 和 Facebook）已经开始封锁（lock down）返回 JSON 对象的 API 服务，而要求客户端使用 OAuth（或者类似的服务）来获取数据。作为可行的替代方案，你总是可以创建服务端代理服务来请求数据并在返回前解析对象。或者你可以升级你的应用程序以使用 OAuth 来和信任的服务器或 Web 服务交互。

InfoQ**：可以和jQuery Mobile一起使用jQuery UI（例如，在移动设备上创建可拖动的组件）吗？**

Phil Dutson：事实上这是个很受关注的话题。问题是 jQuery UI 不支持触摸事件，而 jQuery Mobile 不支持点击并拖动事件。这部分是源于 jQuery Mobile 将"drag"绑定到"swip"。我还没有找到如何用 jQuery Mobile 实现拖放事件，然而有些插件已经实现了 jQuery UI 上的触摸支持。 Touch-Punch 和 Mobile Drag and Drop 这两个程序库能够用来在 Web 项目中实现触摸设备的拖放功能。说得更明白点，Mobile Drag and Drop 并不添加拖放事件，而是添加 tap-to-select 和 tap-to-target 在 Web 站点 / 应用中移动对象。

InfoQ**：混合了触摸和鼠标的设备，比如支持触摸的笔记本电脑或者像Surface这种新硬件，最好是如何处理？**

Phil Dutson：如果你试图同时绑定鼠标事件（点击、鼠标键按下和鼠标键放开）和触摸事件（触摸开始、触摸移动、触摸结束），结果将导致所谓的“幽灵点击（ghost click）”。这是因为触摸事件触发，而仅接着点击事件又立即触发。有时候这并没有什么问题，但也有时候会导致非常奇怪和意想不到的行为（可以在 Google developers 上看到更多信息）。我找到的这个问题最好的解决方案之一是 Mathias Paumgarten 提出的。他用一段简单的代码灵巧地解决了这个问题。你可以看看这段代码。

InfoQ**：你解释了Promise对象的用法以及它们如何隐藏内部实现 ****——诸如ajax() 之类的jQuery函数也能够实现相应的功能（同时使用回调函数和promise对象）**——存在其中一种方式优于另一种方式的理由吗？

Phil Dutson：我的很多 Ajax 作品都是使用 jQuery 的 $.ajax() 函数完成的。我同时努力保证我的所有项目使用的至少是 jQuery 1.6.4，因为我总在和 Promise 接口打交道（因为它在 1.5 版本中被纳入 $.ajax() 方法）。回调函数通常用起来快速而简单，然而在调试代码时它们会导致很多难以发现的错误。当在一个 Web 应用程序中处理到各种社交网络的多个 Ajax 调用时，问题更加普遍。

InfoQ**：你们用整一章的篇幅讲述Bootstrap提供的插件 **——这是为什么呢？

Phil Dutson：实际上我本来计划写 jQuery 插件仓库的，但是它已经被关掉，仍在重建（2013 一月份它又开放了）。我那时还想介绍那些开发会活跃起来的以及发展只会越来越好的功能插件 。我还想展示 Foundation by Zurb 库（我是 Orbit and Reveal 的忠实粉丝），但他们引入的插件已经被作为一个整体集成到了程序库中，而没有单独提供。与此同时，Bootstrap 取得了出色的成就，并且是一个非常热的话题。我喜欢他们将所有插件分开提供的方式，有时候你并不想要使用整个 Bootstrap 框架。Bootstrap 仍是一个 强有力的框架，能够帮助 Web 开发者用最少的时间将应用弄出来并运行。

InfoQ**：jQuery团队很快就发布一个新版本，目前已经是1.9版本了 **——作为相关书籍的作者，你认为这是一个挑战吗？

Phil Dutson：任何技术主题都是一个挑战，因为它们更新都很快。为了编写开发技术书籍，你必须及时而快速地跟进相关技术的 alpha 版本、每日构建版本和 beta 版本，花时间捣鼓和试验相关代码和功能。总是需要猜测哪些功能会一直保留到最终版本中以及最后怎样工作。从这些方面来说，jQuery 团队做得相当出色，其让人们知道哪些功能会被砍掉以及还有多久。我认为总的来说提交了终稿并等待纸书上架的时候是最痛苦的。

InfoQ：移动设备上的网络延迟和带宽限制比桌面电脑上严重得多——jQuery有针对于此的方案吗？

Phil Dutson：jQuery 并不能优化网络，但对于那种为了以最小资源来支持各种设备和平台而构建并优化的站点而言， jQuery Mobile 程序库能够极好地交付。jQuery Mobile 能够帮助你更容易地处理鼠标和触摸事件，让你能够自由地创建自己的模板样式引擎。它甚至允许你用鼠标模拟 swipe 动作。jQuery 还有一个常被忽视的好处，你能够从诸如谷歌或微软的 CDN 地址加载 jQuery 程序库。如果用户已经访问过使用相同 CDN 的网站，则浏览器会缓存该 jQuery 库备用，避免了额外开销。

InfoQ：你们如何抽象不同插件的功能？

Phil Dutson：就我个人来说，我会确定我想要完成什么以及使用该任务的频率。对于电子商务网站，这意味着要确定我是要在每个页面上使用某种特定的模态窗口，还是使用专门定制的带滑动条的浏览框。如果我需要做许多重复性的任务，则这应该被视为一个插件。最诡异的地方在于权衡该插件应该负责多少工作以及你想要其具有多大的可定制性。如果插件要求提供 30 个参数，但实际只用到了其中两个，它不会给任何人带来任何好处。

InfoQ**：Node.js为jQuery专门定制了一个程序包，你能给出几个例子说明它对将jQuery移植到服务器端有什么帮助吗？**

Phil Dutson：jQuery 因为两个功能而为人所熟知，一个是方便的 DOM 操作和选择，另一个是方便的 Ajax 函数调用。使用包含 jQuery 的 Node.js，你能够使用所有你熟知的选择符（还有插入函数）和所有的 Ajax 特性。当然你可以选择不包含 jQuery，但对于 Node.js 新手而言，如果想在学习 Node.js 时能抓住点熟悉的东西，jQuery 可以缓解一下。

InfoQ**：你在书中未涉及单元测试。你推荐用哪些框架来测试jQuery**代码呢？

Phil Dutson：我强烈推荐使用 QUnit 来做单元测试。它是一个非常灵活的框架，jQuery 团队也使用该框架来测试代码。如果有特殊需求（比如需要测试 node.js 代码），也许需要看看其他框架，例如 jsTestDriver 、 Buster.js 和 Yeti 。

InfoQ**：有几个有趣的JavaScript程序库提供了构建UI的更高级抽象 ****——例如Backbone**、 **Knockout和Angular等——**你喜欢哪一个（或不喜欢）？为什么？

Phil Dutson：我喜欢 Backbone 和 Meteor。Backbone 是构建 JavaScript 应用程序的相当优雅的解决方案，也是我在该领域接触的第一个框架。我对 Meteor 不太熟，但我喜欢整个框架的感觉。我倾向于认为， 如果你想的话，可以使用自己已经熟悉的技术（比如 Jade 框架）。这对我是有帮助的，我就是从学习 Node.js 开始顺着学习 Jade 的。

关于书的作者

Phil Dutson是世界上最大的网上健身器材零售公司之一的 ICON Health and Fitness 的首席前端开发工程师。在该公司，他专门负责构建跨多种浏览器和平台的统一的用户体验。Phil Dutson 曾为 NordicTrack、ProForm、Freemotion、Sears、Costco 和 Sam’s Club 等公司构建项目和解决方案。他还是 iFit 项目的创始团队成员，该项目将谷歌地图整合进了个性化的训练创建和回放中。Phil 是开发技术博客“The E-Com DevBlog”的联合创始人和管理者，该博客专注于 Web 开发技术和解决方案。

本文基于《jQuery, jQuery UI, and jQuery Mobile: Recipes and Examples》一书。该书的作者是 Phil Dutson 和 Adriaan de Jonge，出版信息为 Pearson/Addison-Wesley Professional, Nov 2012, ISBN 0321822080, Copyright 2013 Pearson Education, Inc。更多信息请访问出版社网站。

感谢臧秀涛对本文的审校。

给InfoQ 中文站投稿或者参与内容翻译工作，请邮件至 editors@cn.infoq.com 。也欢迎大家通过新浪微博（ @InfoQ ）或者腾讯微博（ @InfoQ ）关注我们，并与我们的编辑和其他读者朋友交流。