随笔分类 - 外文翻译
摘要：> 关于译者：这是一个流淌着沪江血液的纯粹工程：认真，是 HTML 最坚实的梁柱；分享，是 CSS 里最闪耀的一瞥；总结，是 JavaScript 中最严谨的逻辑。经过捶打磨练，成就了本书的中文版。本书包含了函数式编程之精髓，希望可以帮助大家在学习函数式编程的道路上走的更顺畅。比心。
本书主要探索函数式编程[\[1\]](#note1)(FP)的核心思想。在此过程中，作者不会执着于使用大量复杂的概念来进行诠释，这也是本书的特别之处。我们在 JavaScript 中应用的仅仅是一套基本的函数式编程概念的子集。我称之为“轻量级函数式编程(FLP)”。
**注释：** 题目中使用了“轻量”二字，然而这并不是一本“轻松的”“入门级”书籍。本书是严谨的，充斥着各种复杂的细节，适合拥有扎实 JS 知识基础的阅读者进行研读。“轻量”意味着范围缩小。通常来说，关于函数式编程的 JavaScript 书籍都热衷于拓展阅读者的知识面，并企图覆盖更多的知识点。而本书则对于每一个话题都进行了深入的探究，尽管这种探究是小范围进行的。
阅读全文
摘要：如果您已经从头到尾通读了此书，请花一分钟的时间停下来回顾一下从第 1 章到现在的收获。相当漫长的一段旅程，不是吗？希望您已经收获了大量新知识，并用函数式的方式思考你的程序。
在本书即将完结时，我想给你提供一些关于使用官方函数式编程函数库的快速指南。注意这并不是一个详细的文档，而是将你在结束“轻量级函数式编程”后进军真正的函数式编程时应该注意的东西快速梳理一下。
如果有可能，我建议你**不要**做重新造轮子这样的事情。如果你找到了一个能满足你需求的函数式编程函数库，那么用它就对了。只有在你实在找不到合适的库来应对你面临的问题时，才应该使用本书提供的辅助实用函数 —— 或者自己造轮子。
阅读全文
摘要：即使还没有读过我的文章《[在处理网络数据的 JavaScript 抽象的重要性](https://css-tricks.com/importance-javascript-abstractions-working-remote-data/)》，你也很有可能已经意识到代码的可维护性和可扩展性很重要，这也是介绍 `JavaScript` 抽象的目的。
为了更加清楚的说明，我们假设在 `JavaScript` 中抽象是一个模块。
一个模块的最初实现只是它们漫长（也许是持久的）的生命周期过程的开始。我将一个模块的生命周期分成 3 个重要阶段。
1. 引入模块。在项目中编写该模块或复用该模块；
2. 调整模块。随时调整模块；
3. 移除模块。
阅读全文
摘要：首先，我坦白：在开始写以下内容之前我并不太了解 Monad 是什么。我为了确认一些事情而犯了很多错误。如果你不相信我，去看看 [这本书 Git 仓库](https://github.com/getify/Functional-Light-JS) 中关于本章的提交历史吧！
我在本书中囊括了所有涉及 Monad 的话题。就像我写书的过程一样，每个开发者在学习函数式编程的旅程中都会经历这个部分。
尽管其他函数式编程的著作差不多都把 Monad 作为开始，而我们却只对它做了简要说明，并基本以此结束本书。在轻量级函数式编程中我确实没有遇到太多需要仔细考虑 Monad 的问题，这就是本文更有价值的原因。但是并不是说 Monad 是没用的或者是不普遍的 —— 恰恰相反，它很有用，也很流行。
函数式编程界有一个小笑话，几乎每个人都不得不在他们的文章或者博客里写 Monad 是什么，把它拎出来写就像是一个仪式。在过去的几年里，人们把 Monad 描述为卷饼、洋葱和各种各样古怪的抽象概念。我肯定不会重蹈覆辙！
阅读全文
摘要：### 组合柯里化
这一步是最棘手的。所以请慢慢的用心的阅读。
让我们看看没有将 `listCombination(..)` 传递给柯里化函数的样子：
```js
var x = curriedMapReducer( strUppercase );
var y = curriedFilterReducer( isLongEnough );
var z = curriedFilterReducer( isShortEnough );
```
看看这三个中间函数 `x(..)`， `y(..)` 和 `z(..)`。每个函数都期望得到一个单一的组合函数并产生一个 reducer 函数。
记住，如果我们想要所有这些的独立的 reducer，我们可以这样做：
```js
var upperReducer = x( listCombination );
var longEnoughReducer = y( listCombination );
var shortEnoughReducer = z( listCombination );
```
阅读全文
摘要：Transducing 是我们这本书要讲到的更为高级的技术。它继承了第 8 章数组操作的许多思想。
我不会把 Transducing 严格的称为“轻量级函数式编程”，它更像是一个顶级的技巧。我把这个技术留到附录来讲意味着你现在很可能并不需要关心它，当你确保你已经非常熟悉整本书的主要内容，你可以再回头看看这一章节。
说实话，即使我已经教过 transducing 很多次了，在写这一章的时候，我仍然需要花很多脑力去理清楚这个技术。所以，如果你看这一章看的很疑惑也没必要感到沮丧。把这一章加个书签，等你觉得你差不多能理解时再回头看看。
Transducing 就是通过减少来转换。
我知道这听起来很令人费解。但是让我们来看看它有多强大。实际上，我认为这是你掌握了轻量级函数式编程后可以做的最好的例证之一。
和这本书的其他部分一样，我的方法是先解释**为什么**使用这个技术，然后**如何**使用，最后归结为简单的这个技术到底是什么样的。这通常会有多学很多东西，但是我觉得用这种方式你会更深入的理解它。
阅读全文
摘要：第 10 章：异步的函数式（下）
响应式函数式编程
为了理解如何在2个值之间创建和使用惰性的映射，我们需要去抽象我们对列表（数组）的想法。
让我们来想象一个智能的数组，不只是简单地获得值，还是一个懒惰地接受和响应（也就是“反应”）值的数组。考虑下：
阅读全文
摘要："消除阻塞渲染的CSS和JavaScript"。 这一条Google Page Speed Insights的建议总让我困惑。
当一个网页被访问时，Google希望它仅加载对初始视图有用的内容，并使用空闲时间来加载其他内容。这种方式可以使用户尽可能早地看到页面。
我们可以做很多事情来减少阻塞渲染的JavaScript，例如code splitting、tree shaking，缓存等。
但是如何减少阻塞渲染的CSS？为此，可以拆分并优先加载首次渲染所需要的CSS（关键CSS)，然后再加载其它CSS。
可以通过编程的方式筛选出关键CSS，在本文中，我将向你展示如何通过Webpack的自动化流程来实现该方案。
阅读全文
摘要：阅读到这里，你已经学习了我所说的所有轻量级函数式编程的基础概念，在本章节中，我们将把这些概念应有到不同的情景当中，但绝对不会有新的知识点。
到目前为止，我们所说的一切都是同步的，意味着我们调用函数，传入参数后马上就会得到返回值。大部分的情况下是没问题的，但这几乎满足不了现有的 JS 应用。为了能在当前的 JS 环境里使用上函数式编程，我们需要去了解异步的函数式编程。
本章的目的是拓展我们对用函数式编程管理数据的思维，以便之后我们在更多的业务上应用。
阅读全文
摘要：这个错误是什么情况？引擎抛出这个错误，是因为它试图保护系统内存不会被你的程序耗尽。为了解释这个问题，我们需要先看看当函数调用时JS引擎中发生了什么。
每个函数调用都将开辟出一小块称为堆栈帧的内存。堆栈帧中包含了函数语句当前状态的某些重要信息，包括任意变量的值。之所以这样，是因为一个函数暂停去执行另外一个函数，而另外一个函数运行结束后，引擎需要返回到之前暂停时候的状态继续执行。
阅读全文
摘要：我们来谈谈递归吧。在我们入坑之前，请查阅上一页的正式定义。
我知道，这个笑话弱爆了 :)
大部分的开发人员都承认递归是一门非常强大的编程技术，但他们并不喜欢去使用它。在这个意义上，我把它放在与正则表达式相同的类别中。递归技术强大但又令人困惑，因此被视为 **不值得我们投入努力**。
我是递归编程的超级粉丝，你，也可以的！在这一章节中我的目标就是说服你：递归是一个重要的工具，你应该将它用在你的函数式编程中。当你正确使用时，递归编程可以轻松地描述复杂问题。
阅读全文
摘要：几个月前，我看到一个邮件问：有没有人可以解析这一行 JavaScript 代码
```js
```
这一行代码会被渲染成下图的效果。你可以在[这里](https://codepen.io/akras14/pen/yXGzVd)用浏览器打开来观看。这是 Mathieu ‘p01’ Henri 写的，你还可以在作者的网站[www.p01.org](www.p01.org)里看到更多很酷的例子。
阅读全文
摘要：我是 Kevin Ngo，一名就职于 [Mozilla VR 团队](https://mozvr.com/)的 web 虚拟现实开发者，也是 [A-Frame](https://aframe.io/) 的核心开发人员。今天，我们来看看如何使用 A-Frame 构建一个够在 HTC Vive、Oculus Rift、Samsung GearVR、Google Cardboard、桌面设备以及移动设备上运行的、支持空间追踪（room-scale）技术的 WebVR 版《我的世界》示例。该示例基于 A-Frame，且仅使用 11 个 HTML 元素！
阅读全文
摘要：要理解为什么将 ArrayBuffer 和 SharedArrayBuffer 添加到 JavaScript 中，你需要了解一些关于内存管理的内容。
你可以将机器中的内存看作一堆盒子。就像你在办公室里的邮箱，或是小孩子们使用的收纳箱。
如果你想要为其他孩子留下一些东西，你可以把它放在一个盒子里。
阅读全文
摘要：在学习 [React.js](https://facebook.github.io/react/) 时我遇到了一个问题，那就是很难找到受控组件的真实示例。受控文本输入框的例子倒是很丰富，但复选框、单选框、下拉选择框的例子却不尽人意。
本文列举了真实的受控表单组件示例，要是我在学习 React 的时候早点发现这些示例就好了。除了日期和时间输入框需要另开篇幅详细讨论，文中列举了所有的表单元素。
有时候，为了减少开发时间，有时候人们很容易为了一些东西（譬如表单元素）引入一个库。而对于表单，我发现当需要添加自定义行为或表单校验时，使用库会让事情变得更复杂。不过一旦掌握合适的 React 模式，你会发现构建表单组件并非难事，并且有些东西完全可以自己动手，丰衣足食。请把本文的示例代码当作你创建表单组件的起点或灵感之源。
阅读全文
摘要：这是一本可供任何人使用的指南，用于学习前端开发实践。该指南大体上勾勒出了前端工程的轮廓，同时也讨论了前端工程的实践：2017 年，如何学习前端工程，用什么工具来实践？
笔者有意将本书打造为一份专业资料，为想要或正在实践的前端开发者们提供学习材料和开发工具。其次，它同样可供主管、CTO、讲师和猎头们深入探索前端开发实践。
本书内容偏向于 WEB 技术（HTML、CSS、DOM、JavaScript）和以这些技术为根基直接构建而成的开源技术。书中引用和讨论的材料要么就是同类翘楚，要么就是解决问题的流行方案。
阅读全文
摘要：你是否还沉迷于上一节介绍的闭包／对象之中？欢迎回来！
如果你能做一些令人惊叹的事情，请持续保持下去。
本文之前已经简要的提及了一些实用函数：`map(..)`、`filter(..)` 和 `reduce(..)`，现在深入了解一下它们。在 Javascript 中，这些实用函数通常被用于 Array（即 “list” ）的原型上。因此可以很自然的将这些实用函数和数组或列表操作联系起来。
在讨论具体的数组方法之前，我们应该很清楚这些操作的作用。在这章中，弄明白为何有这些列表操作和这些操作如何工作同等重要。请保持头脑清晰，跟上节奏。
在本章内外，有大量常见且通俗易懂的
阅读全文
摘要：在第 5 章中，我们探讨了减少副作用的重要性：副作用是引起程序意外状态改变的原因，同时也可能会带来意想不到的惊喜（bugs）。这样的暗雷在程序中出现的越少，开发者对程序的信心无疑就会越强，同时代码的可读性也会越高。本章的主题，将继续朝减少程序副作用的方向努力。
如果编程风格幂等性是指定义一个数据变更操作以便只影响一次程序状态，那么现在我们将注意力转向将这个影响次数从 1 降为 0。
现在我们开始探索值的不可变性，即只在我们的程序中使用不可被改变的数据。
阅读全文
摘要：数年前，Anton van Straaten 创造了一个非常有名且被常常引用的 [禅理](https://www.merriam-webster.com/dictionary/koan) 来举例和证实一个闭包和对象之间重要的关系。
德高望重的大师 Qc Na 曾经和他的学生 Anton 一起散步。Anton 希望引导大师到一个讨论里，说到：大师，我曾听说对象是一个非常好的东西，是这样么？Qc Na 同情地看着他的学生回答到, “愚笨的弟子，对象只不过是可怜人的闭包”
被批评后，Anton 离开他的导师并回到了自己的住处，致力于学习闭包。他认真的阅读整个“匿名函数：终极……”系列论
阅读全文
摘要：在第 2 章，我们讨论了一个函数除了它的返回值之外还有什么输出。现在你应该很熟悉用函数式编程的方法定义一个函数了，所以对于函数式编程的副作用你应该有所了解。
我们将检查各种各样不同的副作用并且要看看他们为什么会对我们的代码质量和可读性造成损害。
这一章的要点是：编写出没有副作用的程序是不可能的。当然，也不是不可能，你当然可以编写出没有副作用的程序。但是这样的话程序就不会做任何有用和明显的事情。如果你编写出来一个零副作用的程序，你就无法区分它和一个被删除的或者空程序的区别。
阅读全文
浙公网安备 33010602011771号