译|调整JavaScript抽象的迭代方案

翻译译者:小溪里

校对:华翔、小冬

即使还没有读过我的文章《》,你也很有可能已经意识到代码的可维护性和可扩展性很重要,这也是介绍 JavaScript 抽象的目的。

为了更加清楚的说明,我们假设在 JavaScript 中抽象是一个模块。

一个模块的最初实现只是它们漫长(也许是持久的)的生命周期过程的开始。我将一个模块的生命周期分成 3 个重要阶段。

引入模块。在项目中编写该模块或复用该模块;

调整模块。随时调整模块;

移除模块。

在我先前的中,重心放在了第一点上。而在这篇文章中,我将把重点放在第二点上。

模块更改是我经常碰到的一个难题。与引入模块相比,开发者维护和更改模块的方式对保证项目的可维护性和可拓展性是同等重要甚至是更加重要。我看过一个写得很好、抽象得很好的模块随着时间推移历经多次更改后被彻底毁了。我自己也经常是造成那种破坏性更改的其中一个。

当我说破坏性,我指的是对可维护性和可扩展性方面的破坏。我也明白,当面临项目最后交付期限的压力时,放慢速度以进行更好的修改设计并不是优先选择。

开发者做出非最优修改的原因可能有很多种,我在这里想特别强调一个:

以可维护的方式进行修改的技巧

这种方法让你的修改显得更专业。

让我们从一个 API 模块的代码示例开始。之所以选择这个示例,是因为与外部 API 通信是我在开始项目时定义的最基本的抽象之一。这里的想法是将所有与 API 相关的配置和设置(如基本 URL,错误处理逻辑等)存储在这个模块中.

我将编写一个设置 API.url、一个私有方法 API._handleError() 和一个公共方法 API.get():

class API { constructor() { this.url = 'http://whatever.api/v1/'; } /** * API 数据获取的特有方法 * 检查一个 HTTP 返回的状态码是否在成功的范围内 */ _handleError(_res) { return _res.ok ? _res : Promise.reject(_res.statusText); } /** * 获取数据 * @return {Promise} */ get(_endpoint) { return window.fetch(this.url + _endpoint, { method: 'GET' }) .then(this._handleError) .then( res => res.json()) .catch( error => { alert('So sad. There was an error.'); throw new Error(error); }); } };

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wssyzs.html