《JavaScript应用程序设计》一一2.13 链式调用与流式API

简介:

本节书摘来华章计算机出版社《JavaScript应用程序设计》一书中的第2章,第2.13节,作者:Eric Elliott 更多章节内容可以访问云栖社区“华章计算机”公众号查看。

2.13 链式调用与流式API

链式调用是指下一次方法调用的上下文环境,由前一次方法调用的输出结果提供,下面的代码实例在jQuery中较为常见:

$('.friend').hide().filter('.active').show();

更为清晰的写法:

$('.friend')
  .hide()
  .filter('.active')
  .show();

这一连串方法调用的内在含义为: 先找出所有类名为.friend的元素并将它们隐藏,随后在其中找出所有拥有.active类名的元素并将之显示。
在页面加载时,好友列表做如下展示:

  • Mick
  • Hunz (active)
  • Yannis
    代码执行后,好友列表的展示为:
  • Hunz (active)
    链式调用最为主要的优点在于它为流式API提供了语法上的支持。简单来说,流式API意味着方法调用的过程阅读起来更像是一种自然语言,这里的自然语言并不是指代英语,而是指流式API中的方法命名应该与实际动词联系起来。

流式API应用的一个绝佳案例是jQuery,事实上,jQuery的流式编程语法已经使之成为市面上最为简单易上手的类库之一。在jQuery刚刚发布时,几乎它的所有特性其他类库都已支持,让jQuery从众多类库中脱颖而出的是它极为易学的语法。几乎所有jQuery语句都可以抽象为:“找出匹配选择器的所有元素,随后执行x(),再执行y(),选择其中部分元素,动词,动词”。
链式调用也有其缺点,它使得你在单行代码中掺杂了过多的逻辑,同时程序中过程式代码变得越来越多,加之由于很难在调用链中设置断点,所以代码调试变得异常困难。
如果你恰巧在调试链式代码时陷入了困境,这里有一个小技巧,你可以用赋值变量来捕获链式调用中任意环节的函数返回值,之后在变量上继续调用方法链中的下一个方法,并在这里穿插断点调试。这么说吧,流式API并不是让你将方法链从头写到尾。
流式API的重点不在于链式调用,而在于它能够让方法调用的过程看起来更像是人用词语与句子表达自己的想法。流式API将任务执行的结果用一组拥有明确含义的方法衔接起来。
构建一个流式API等同于构建一个微型领域特定语言,这部分内容将在第3章中做详细阐述。
警告: 流式API极易被滥用,比如在其他语言中,流式API主要是用来配置实例对象,而JavaScript在配置方面有天然的对象字面量语法,此时再引入流式API,就显得有些多余。

有时候,流式语法也让函数调用变得冗余,例如Should.js的API就采用了极长的链式调用,导致代码书写在编辑器内跨行。请在代码中始终保持简单性。
相关文章
|
1月前
|
JSON 缓存 JavaScript
深入浅出:使用Node.js构建RESTful API
在这个数字时代,API已成为软件开发的基石之一。本文旨在引导初学者通过Node.js和Express框架快速搭建一个功能完备的RESTful API。我们将从零开始,逐步深入,不仅涉及代码编写,还包括设计原则、最佳实践及调试技巧。无论你是初探后端开发,还是希望扩展你的技术栈,这篇文章都将是你的理想指南。
|
23天前
|
JSON JavaScript 前端开发
深入浅出Node.js:从零开始构建RESTful API
在数字化时代的浪潮中,后端开发作为连接用户与数据的桥梁,扮演着至关重要的角色。本文将引导您步入Node.js的奇妙世界,通过实践操作,掌握如何使用这一强大的JavaScript运行时环境构建高效、可扩展的RESTful API。我们将一同探索Express框架的使用,学习如何设计API端点,处理数据请求,并实现身份验证机制,最终部署我们的成果到云服务器上。无论您是初学者还是有一定基础的开发者,这篇文章都将为您打开一扇通往后端开发深层知识的大门。
39 12
|
1月前
|
JavaScript NoSQL API
深入浅出Node.js:从零开始构建RESTful API
在数字化时代的浪潮中,后端开发如同一座灯塔,指引着数据的海洋。本文将带你航行在Node.js的海域,探索如何从一张白纸到完成一个功能完备的RESTful API。我们将一起学习如何搭建开发环境、设计API结构、处理数据请求与响应,以及实现数据库交互。准备好了吗?启航吧!
|
1月前
|
JavaScript 前端开发 API
Vue.js 3:探索组合式API带来的新变革
Vue.js 3:探索组合式API带来的新变革
|
1月前
|
JavaScript 前端开发 API
Vue.js 3中的Composition API:提升你的组件开发体验
Vue.js 3中的Composition API:提升你的组件开发体验
|
1月前
|
JSON JavaScript API
深入浅出Node.js:从零开始构建RESTful API
【10月更文挑战第39天】 在数字化时代的浪潮中,API(应用程序编程接口)已成为连接不同软件应用的桥梁。本文将带领读者从零基础出发,逐步深入Node.js的世界,最终实现一个功能完备的RESTful API。通过实践,我们将探索如何利用Node.js的异步特性和强大的生态系统来构建高效、可扩展的服务。准备好迎接代码和概念的碰撞,一起解锁后端开发的新篇章。
|
1月前
|
JavaScript 中间件 API
Node.js进阶:Koa框架下的RESTful API设计与实现
【10月更文挑战第28天】本文介绍了如何在Koa框架下设计与实现RESTful API。首先概述了Koa框架的特点,接着讲解了RESTful API的设计原则,包括无状态和统一接口。最后,通过一个简单的博客系统示例,详细展示了如何使用Koa和koa-router实现常见的CRUD操作,包括获取、创建、更新和删除文章。
51 4
|
1月前
|
JavaScript 前端开发 API
Vue.js 3:深入探索组合式API的实践与应用
Vue.js 3:深入探索组合式API的实践与应用
|
1月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API
使用JavaScript和Node.js构建简单的RESTful API
|
1月前
|
JavaScript 前端开发 NoSQL
深入浅出:使用Node.js构建RESTful API
【10月更文挑战第35天】在数字时代的浪潮中,后端技术如同海洋中稳固的灯塔,为前端应用提供数据和逻辑支撑。本文旨在通过浅显易懂的方式,带领读者了解如何利用Node.js这一强大的后端平台,搭建一个高效、可靠的RESTful API。我们将从基础概念入手,逐步深入到代码实践,最终实现一个简单的API示例。这不仅是对技术的探索,也是对知识传递方式的一次创新尝试。让我们一起启航,探索Node.js的奥秘,解锁后端开发的无限可能。