资讯专栏INFORMATION COLUMN

(译)《学习JavaScript设计模式》(一)

ls0609 / 3484人阅读

摘要:模式并不就是一个具体的解决方案。我们要记住模式的角色仅仅就是给我们提供一个解决方案体系。使用本地浏览器的方法比如来选择所有为的元素。后者毫无竞争力。在本书的后面我们将继续讨论更多的设计模式。

原书链接Learning JavaScript Design Patterns
水平有限很多地方不通顺,错翻漏翻欢迎交流。

什么是模式?

模式是一种可普遍应用于软件设计——对我们前端人员来讲就是JavaScript网络应用程序的可重用方案。或者说是一种可用于解决很多不同情况的模板。

所以理解模式对我们来说究竟有什么好处呢?设计模式主要有三点优势:

模式是成熟的解决方案: 它使用成熟的技术为软件开发中问题提供了可靠的方法,这些技术反映了为模式定义的开发的经验和见解。

模式易于重用: 模式通常反映了一个很好的可适应我们本身需求的方法。这个特征使得它鲁棒性很好。

模式有很好的表现力: 模式通常都有一个解决方案的关键词用法和语法结构,通过它我们可以让大型的解决方案表现得更优雅。

模式并不就是一个具体的解决方案。我们要记住模式的角色仅仅就是给我们提供一个解决方案体系。模式并不能解决所有的设计问题,也不能取代一个好的设计师,但它确实能成为设计师的好帮手。接下来我们来讨论一下模式的其他一些优势。

模式可以防患于未然: 当我们的代码是建立在成熟的模式上时,我们可以花更少的时间考虑我们的代码结构,而把更多的时间放在我们的总的解决方案的质量上。这是由于模式总是鼓励我们以结构化和组织化的方式来编写代码,很好地避免了一些未来重构代码的需求。

模式可以提供文档化的通用解决方案,不会被某个多带带问题所限制: 这种通用化的方式意味着我们不需要被应用(通常是编程语言的不同)所限制,设计模式仍然可以改善我们代码的结构。

特定的模式确实可以避免重复来减少代码量: 通过鼓励开发者在容易减少代码重复区域更加警惕(比如用一个通用函数来取代减少执行函数)。这也就是我们所说的让代码更加"DRY"

模式添加到开发者的字典中可以让他们交流更加方便

频繁被使用的模式可以随着开发者在社区中交流得到改善: 在某些情况这可以引领一种全新的设计模式,并让它更好地适应更多的具体情况。这可以保持基于模式的解决方案保持健壮性,甚至超过点对点的解决方案。

我们已经天天在用模式了

为了理解模式究竟多吊,我们来回顾一个jQuery已经帮我们解决的元素选择的问题。

假设我们有个script,在DOM中为每个找到的class为"foo"的元素添加一个计数器。效率最高的查询方法是什么?来看看下面几种解决方案:

选择页面中的所有DOM元素并存储他们的引用,然后通过正则表达式(或者其他的方法)来过滤只存储那些class"foo"的元素。

使用本地浏览器的方法比如querySelectorAll()来选择所有class"foo"的元素。

使用原生方法比如getElementsByClassName()来类似地选择所需集合。

所以这仨哪个快呢?事实上是<3>,它是其他俩的8-10倍。但是天不遂人愿,<3>在IE9以下是没用的,一次在<2>和<3>都不支持的环境下只能使用<1>了。

然而使用jQuery的开发者就不用愁了,因为它为我们这些使用外观模式的把选择器抽象出来了。我们后面会提到,这种模式为以后一些潜在的负载代码提供了一些抽象接口(比如$el.css(), $el.animate())。这意味这我们不需要花太多的时间在实现细节上了。

jQuery还自动地根据我们的浏览器来挑选选择器方法。

我们可能都熟悉jQuery的$("selector"),同样是选择HTML元素,它比起getElementById(), getElementsByClassName(), getElementByTagName()等方法来说方便多了。

我们知道querySelectorAll()也试图做同样的事,比较一下使用jQuery的模式VS我们自己来选择。后者毫无竞争力(?)。抽象使用模式有现实价值。

在本书的后面我们将继续讨论更多的设计模式。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/79399.html

相关文章

  • 那些年,我的前端/Java后端书单

    摘要:全文为这些年,我曾阅读深入理解过或正在阅读学习即将阅读的一些优秀经典前端后端书籍。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 全文为这些年,我曾阅读、深入理解过(或正在阅读学习、即将阅读)的一些优秀经典前端/Java后端书籍。全文为纯原创,且将持续更新,未经许可,不得进行转载。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 基础 基础书籍 进阶 进阶阶段,深入学习的书...

    fxp 评论0 收藏0
  • 那些年,我的前端/Java后端书单

    摘要:全文为这些年,我曾阅读深入理解过或正在阅读学习即将阅读的一些优秀经典前端后端书籍。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 全文为这些年,我曾阅读、深入理解过(或正在阅读学习、即将阅读)的一些优秀经典前端/Java后端书籍。全文为纯原创,且将持续更新,未经许可,不得进行转载。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 基础 基础书籍 进阶 进阶阶段,深入学习的书...

    Tecode 评论0 收藏0
  • 那些年,我的前端/Java后端书单

    摘要:全文为这些年,我曾阅读深入理解过或正在阅读学习即将阅读的一些优秀经典前端后端书籍。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 全文为这些年,我曾阅读、深入理解过(或正在阅读学习、即将阅读)的一些优秀经典前端/Java后端书籍。全文为纯原创,且将持续更新,未经许可,不得进行转载。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 基础 基础书籍 进阶 进阶阶段,深入学习的书...

    VPointer 评论0 收藏0
  • 那些年,我的前端/Java后端书单

    摘要:全文为这些年,我曾阅读深入理解过或正在阅读学习即将阅读的一些优秀经典前端后端书籍。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 全文为这些年,我曾阅读、深入理解过(或正在阅读学习、即将阅读)的一些优秀经典前端/Java后端书籍。全文为纯原创,且将持续更新,未经许可,不得进行转载。当然,如果您喜欢这篇文章,可以动手点点赞或者收藏。 基础 基础书籍 进阶 进阶阶段,深入学习的书...

    idealcn 评论0 收藏0
  • 】《学习JavaScript设计模式》(二)

    摘要:学习模式设计的过程中,我们遇到原生模式这玩意儿也不是啥大惊小怪的事。最好的设计模式通常不直接给出问题的答案,这被人认为是解决困难问题的必要步骤。 原书链接Learning JavaScript Design Patterns水平有限很多地方不通顺,错翻漏翻欢迎交流。 模式测试,原生模式&约法三章 记住并不是所有的算法啊,最佳实践啊,解决方案啊什么的都可以被称为一个完整的模式的。很可能它...

    lifefriend_007 评论0 收藏0

发表评论

0条评论

ls0609

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<