摘要：
## § 详情 - 数据渲染
> 本文配套视频地址：
> https://v.qq.com/x/page/x055550lrvd.html
---
> 开始前请把 `ch4-2` 分支中的 `code/` 目录导入微信开发工具
> 这一节中，我们开始详情的接口调用、数据加载和视图渲染过程。
### Step 1. 引入公用的一些工具库，修改 `detail.js`： 阅读全文
摘要：
## 详情 - 页面制作
> 本文配套视频地址：
> https://v.qq.com/x/page/o0555o20xjd.html
---
> 开始前请把 `ch4-1` 分支中的 `code/` 目录导入微信开发工具
> 这一章节中，主要介绍详情页的页面制作过程
首先看一下我们最终要展示的页面
页面结构大体分为三部分，也是最常见的布局方式：头部、中间体、尾部。最顶部的是页面 `title`，也就是标题，如果是一般的页面，我们只需要在 `detail.json` 中增加如下配置即可： 阅读全文
摘要：
本文配套视频地址：
> https://v.qq.com/x/page/h0554i4u5ob.html
---
> 开始前请把 `ch3-4` 分支中的 `code/` 目录导入微信开发工具
> 这一篇中，我们把列表这块的剩余功能做完：下拉更新、分享、阅读标识。
### 下拉更新功能
> 下拉更新这个功能与我们在第一章中写的小 `demo` 所用方法一致：`onReachBottom`。
当用户滚动过程中触发了 `上拉` 这个动作时候，微信小程序会自动监听到并执行 `onReachBottom` 这个函数，所以我们只需要把这个监听事件写好就行了：
修改 `index.js`，增加 `onReachBottom` 函数： 阅读全文
摘要：
在后端语言中，设计模式应用的较为广泛。如Spring中常见的工厂模式、装饰者模式、单例模式、迭代器模式。但是在日常的前端开发中，设计模式使用的较少，或者大家的代码已经遵循了某某设计模式但是我们并不知道。常见的设计模式有23种，如果单纯的按照模式名称+名词解释的方式来写这篇文章，可能太枯燥了或者很难理解记忆，所以我打算换一种方式。下面我们以一个例子开始我们今天的文章。 阅读全文
摘要：
> 本文配套视频地址：
> https://v.qq.com/x/page/z0554wyswib.html
---
> 开始前请把 `ch3-3` 分支中的 `code/` 目录导入微信开发工具
### 首先
首先我们要做的是什么呢？直接写模板逻辑吗？不是，给用户以良好的提示是很重要的，所以，我们要做的第一件事就是，加载中...
这里我们采用官方 `loading` 组件，所以现在就可以直接拿来用了。
修改 `index.wxml`，增加 `loading` 组件。很明显，变量 `hiddenLoading` 控制着它的展示与隐藏: 阅读全文
摘要：
## § 页面逻辑处理
> 本文配套视频地址：
> https://v.qq.com/x/page/n0554dndrez.html
---
> 开始前请把 `ch3-2` 分支中的 `code/` 目录导入微信开发工具
### 修改 `index.js` 文件，引入我们需要的外部资源 阅读全文
摘要：
开始前请把 `ch3-1` 分支中的 `code/` 目录导入微信开发工具
> 这一章主要会教大家如何用小程序制作一个可以无限加载的列表。希望大家能通过这个例子掌握制作各种列表的原理。
### 无限列表加载的原理
其实所谓的无限列表就是将所有的数据分成一页一页的展示给用户看。我们每次只请求一页数据。当我们判断用户阅读完了这一页之后，立马请求下一页的数据，然后渲染出来给用户看，这样在用户看来，就感觉一直有内容可看。
当然，这其中很重要的一点就是，涉及到请求就肯定会有等待，处理好请求时的 **加载状态**，给用户以良好的体验也是非常重要的，否则如果网络状况不佳，而且没有给用户提示程序正在努力加载的话，用户很容易就以为他看完了，或者程序死掉了。 阅读全文
摘要：
# § 封装网络请求及 mock 数据
> 本文配套视频地址：
> https://v.qq.com/x/page/i05544fogcm.html
> 开始前请把 `ch2-3` 分支中的 `code/` 目录导入微信开发工具
上一节中，我们对 index.js 文件中增加了 util 对象，并在对象中封装了很多公用方法 阅读全文
摘要：
在平时的工作中，我们都会经常查阅一些英文文档来解决平时遇到的问题和拓宽视野。看到好的文章或者书籍有没有想要和小伙伴分享的冲动，那么我们一起来翻译吧～
翻译主张 **“信 达 雅”** 。“信”指意义不悖原文，即是译文要准确，不偏离，不遗漏，也不要随意增减意思；“达”指不拘泥于原文形式，译文通顺明白；“雅”则指译文时选用的词语要得体，追求文章本身的古雅，简明优雅。身为非专业翻译人员，要达到以上三点不是很容易的，但是我们要尽可能往这个方向上努力。一是提高自己的表达水平和阅读能力；二是能够让读者更加的明白作者本来的思想。有句话说得好：当把别人讲明白的时候，自己才算是真正的理解了。
2017 年 6 月 5 日，iKcamp 开始翻译第二本书 —— [《JavaScript 轻量级函数式编程》](https://github.com/ikcamp/Functional-Light-JS)。如果你看过 iKcamp 最近在掘金、知乎或者公众号上发过的关于这本书的文章，应该对本书有一个大致的了解，本书的作者是火爆全球的 **《你不知道的 JavaScript》** 一书原作者 。旨在探 阅读全文
摘要：
# 第二章：小程序中级实战教程之预备篇
> 本文配套视频地址
> [https://v.qq.com/x/page/m0554uf5jzt.html?new=1](https://v.qq.com/x/page/m0554uf5jzt.html?new=1)
## util公共方法
> 开始前请把 `ch2-2` 分支中的 `code/` 目录导入微信开发工具
在这一章中，我们会在util目录新建 3 个文件，这些文件分别提供了一些常用的函数，变量，已便我们在不同的页面中使用 阅读全文
摘要：
前面的章节中，我们完成了小程序的准备工作，熟悉了小程序的基本配置。接下来的章节，我们就要着手开始一个真正的项目。有没有很激动？其实不难发现，小程序的门槛还是相对比较低的，基本掌握前端开发基础的同学，完成一个简单的小程序不费吹灰之力。 阅读全文
摘要：
这一章节中，我们尝试着写一个最简单的例子，包含 2 个静态页面，并增加菜单导航功能。小体验一把。
### Step 1. 清理结构
清理后如下结构，只保留了两个 `必备` 文件，同时做如下修改： 阅读全文
摘要：
> iKcamp官网：http://www.ikcamp.com
> 访问官网更快阅读全部免费分享课程：《iKcamp出品｜全网最新｜微信小程序｜基于最新版1.0开发者工具之初中级培训教程分享》。
> 包含：文章、视频、源代码
# 第一章：小程序初级入门教程
## 工具安装
在上一节第 8 步所展示的页面中，可以点击 `开发者工具` 直接进入到下载页面，也可以直接访问 [官网下载地址](https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html)。然后根据自己的设备选择相应的下载
安装过程不再复述，一路默认。 阅读全文
摘要：
第 10 章：异步的函数式（下）
响应式函数式编程
为了理解如何在2个值之间创建和使用惰性的映射，我们需要去抽象我们对列表（数组）的想法。
让我们来想象一个智能的数组，不只是简单地获得值，还是一个懒惰地接受和响应（也就是“反应”）值的数组。考虑下： 阅读全文
摘要：
## 阅读要求
> 读者需要具备但不限于以下技能
- HTML
- JavaScript `es6更佳`
- CSS
一共四部分十五小节，适合七天的训练营。
从现在开始，我假装你已经掌握了 `html`、 `css`以及 `ES6` ☝️ 目标导向
本教程以实战项目驱动，以沪江英语微信小程序项目框架为基础，最终还原一个完整的小程序
列表页面：请求接口，并展示列表页面数据
iKcamp官网：http://www.ikcamp.com
访问官网更快阅读全部免费分享课程：《iKcamp出品｜全网最新｜微信小程序｜基于最新版1.0开发者工具之初中级培训教程分享》。
包含：文章、视频、源代码 阅读全文
摘要：
"消除阻塞渲染的CSS和JavaScript"。 这一条Google Page Speed Insights的建议总让我困惑。
当一个网页被访问时，Google希望它仅加载对初始视图有用的内容，并使用空闲时间来加载其他内容。这种方式可以使用户尽可能早地看到页面。
我们可以做很多事情来减少阻塞渲染的JavaScript，例如code splitting、tree shaking，缓存等。
但是如何减少阻塞渲染的CSS？为此，可以拆分并优先加载首次渲染所需要的CSS（关键CSS)，然后再加载其它CSS。
可以通过编程的方式筛选出关键CSS，在本文中，我将向你展示如何通过Webpack的自动化流程来实现该方案。 阅读全文
摘要：
阅读到这里，你已经学习了我所说的所有轻量级函数式编程的基础概念，在本章节中，我们将把这些概念应有到不同的情景当中，但绝对不会有新的知识点。
到目前为止，我们所说的一切都是同步的，意味着我们调用函数，传入参数后马上就会得到返回值。大部分的情况下是没问题的，但这几乎满足不了现有的 JS 应用。为了能在当前的 JS 环境里使用上函数式编程，我们需要去了解异步的函数式编程。
本章的目的是拓展我们对用函数式编程管理数据的思维，以便之后我们在更多的业务上应用。 阅读全文
摘要：
这个错误是什么情况？引擎抛出这个错误，是因为它试图保护系统内存不会被你的程序耗尽。为了解释这个问题，我们需要先看看当函数调用时JS引擎中发生了什么。
每个函数调用都将开辟出一小块称为堆栈帧的内存。堆栈帧中包含了函数语句当前状态的某些重要信息，包括任意变量的值。之所以这样，是因为一个函数暂停去执行另外一个函数，而另外一个函数运行结束后，引擎需要返回到之前暂停时候的状态继续执行。 阅读全文
摘要：
我们来谈谈递归吧。在我们入坑之前，请查阅上一页的正式定义。
我知道，这个笑话弱爆了 :)
大部分的开发人员都承认递归是一门非常强大的编程技术，但他们并不喜欢去使用它。在这个意义上，我把它放在与正则表达式相同的类别中。递归技术强大但又令人困惑，因此被视为 **不值得我们投入努力**。
我是递归编程的超级粉丝，你，也可以的！在这一章节中我的目标就是说服你：递归是一个重要的工具，你应该将它用在你的函数式编程中。当你正确使用时，递归编程可以轻松地描述复杂问题。 阅读全文
摘要：
- 大前端方向：移动Web前端、Native客户端、Node.js、
- 大前端框架：React、Vue.js、Koa
- 跨终端技术：HTML5、CSS 3、JavaScript
- 跨平台框架：React Native、Cordova
- 前端工程化：Grunt、Gulp、Webpack
- 前端预编译：Babel、Sass、Less
- 自动化测试：Jasmine、Mocha、Karma 阅读全文
摘要：
最近， 产品同学一如往常笑嘻嘻的递来需求文档， 纵使内心万般拒绝， 身体倒是很诚实。 接过需求，好在需求不复杂， 简单构思 后决定用Vue， 得心应手。 切好图， 挽起袖子准备撸代码的时候， SEO同学不知何时已经站到了背后。
"听说你要用Vue?"
"恩..."
"SEO考虑了吗?整个SPA出来，网页的SEO咋办?"
"奥..."
换以前， 估计只能无奈的换个实现方式， 但是Vue 2.0时代的到来， 给你多了一种可能。 你可以对SEO工程师说:用Vue没问题! 阅读全文
摘要：
几个月前，我看到一个邮件问：有没有人可以解析这一行 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 中，你需要了解一些关于内存管理的内容。
你可以将机器中的内存看作一堆盒子。就像你在办公室里的邮箱，或是小孩子们使用的收纳箱。
如果你想要为其他孩子留下一些东西，你可以把它放在一个盒子里。 阅读全文
摘要：
上文“走进Node.js启动过程”中我们算是成功入门了。既然Node.js的强项是处理网络请求，那我们就来分析一个HTTP请求在Node.js中是怎么被处理的，以及JavaScript在这个过程中引入的开销到底有多大。
Node.js采用的网络请求处理模型是IO多路复用。它与传统的主从多线程并发模型是有区别的：只使用有限的线程数（1个），所以占用系统资源很少；操作系统级的异步IO支持，可以减少用户态/内核态切换，并且本身性能更高（因为直接与网卡驱动交互）；JavaScript天生具有保护程序执行现场的能力（闭包），传统模型要么依赖应用程序自己保存现场，或者依赖线程切换时自动完成。当然，并不能说IO多路复用就是最好的并发模型，关键还是看应用场景。 阅读全文
摘要：
在学习 [React.js](https://facebook.github.io/react/) 时我遇到了一个问题，那就是很难找到受控组件的真实示例。受控文本输入框的例子倒是很丰富，但复选框、单选框、下拉选择框的例子却不尽人意。
本文列举了真实的受控表单组件示例，要是我在学习 React 的时候早点发现这些示例就好了。除了日期和时间输入框需要另开篇幅详细讨论，文中列举了所有的表单元素。
有时候，为了减少开发时间，有时候人们很容易为了一些东西（譬如表单元素）引入一个库。而对于表单，我发现当需要添加自定义行为或表单校验时，使用库会让事情变得更复杂。不过一旦掌握合适的 React 模式，你会发现构建表单组件并非难事，并且有些东西完全可以自己动手，丰衣足食。请把本文的示例代码当作你创建表单组件的起点或灵感之源。 阅读全文
摘要：
当我们在Spoil打算推出我们自己的移动端应用时，头一个需要作出的决定就是：我们应该使用哪种编程语言？经过一番讨论，我们最终做出的决定是：React-Native。学习一门新的“语言”或者框架并不是个大问题，但是老兄我得告诉你，React-Native和Redux确确实实是块难啃的骨头。这篇文章没有介绍React-Native是如何工作的（因为那确实不是最难的部分）。下面几段文字的目的在于帮助任何人完成从“Thingking in MVC”到“Thinking in Redux”的转换。希望能对你有所帮助。 阅读全文
摘要：
Electron 可以让你使用纯 JavaScript 调用 Chrome 丰富的原生的接口来创造桌面应用。你可以把它看作一个专注于桌面应用的 Node.js 的变体，而不是 Web 服务器。其基于浏览器的应用方式可以极方便的做各种响应式的交互，接下来介绍下关于 Electron 上衍生出的框架 Nightmare。
Nightmare 是一个基于 Electron 的框架，针对 Web 自动化测试和爬虫(其实爬虫这个是大家自己给这个框架加的功能XD)，因为其具有跟 PlantomJS 一样的自动化测试的功能可以在页面上模拟用户的行为触发一些异步数据加载，也可以跟 Request 库一样直接访问 URL 来抓取数据，并且可以设置页面的延迟时间，所以无论是手动触发脚本还是行为触发脚本都是轻而易举的(这边注意，如果事件具备 isTrusted 的检查的话，就无法触发了)。 阅读全文
摘要：
不好意思，没有像其他公众号一样赶着发文章，每年到这个时候总有一大波什么今年前端预测，技术框架预测什么的。我这次写这篇文针对的对象，是想在今年踏入前端这行的人们，不管你现在是徘徊在门口，还是已经半只脚踏入这片未知领域，都可以参考一下先行者的经验。 阅读全文
摘要：
这是一本可供任何人使用的指南，用于学习前端开发实践。该指南大体上勾勒出了前端工程的轮廓，同时也讨论了前端工程的实践：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 章，我们讨论了一个函数除了它的返回值之外还有什么输出。现在你应该很熟悉用函数式编程的方法定义一个函数了，所以对于函数式编程的副作用你应该有所了解。
我们将检查各种各样不同的副作用并且要看看他们为什么会对我们的代码质量和可读性造成损害。
这一章的要点是：编写出没有副作用的程序是不可能的。当然，也不是不可能，你当然可以编写出没有副作用的程序。但是这样的话程序就不会做任何有用和明显的事情。如果你编写出来一个零副作用的程序，你就无法区分它和一个被删除的或者空程序的区别。 阅读全文
摘要：
到目前为止，我希望你能更轻松地理解在函数式编程中使用函数意味着什么。
一个函数式编程者，会将他们程序中的每一个函数当成一小块简单的乐高部件。他们能一眼辨别出蓝色的 2x2 方块，并准确地知道它是如何工作的、能用它做些什么。当构建一个更大、更复杂的乐高模型时，当每一次需要下一块部件的时候，他们能够准确地从备用部件中找到这些部件并拿过来使用。
但有些时候，你把蓝色 2x2 的方块和灰色 4x1 的方块以某种形式组装到一起，然后意识到：“这是个有用的部件，我可能会常用到它”。
那么你现在想到了一种新的“部件”，它是两种其他部件的组合，在需要的时候能触手可及。这时候，将这个蓝黑色 L 形状的方块组合体放到需要使用的地方，比每次分开考虑两种独立方块的组合要有效的多。
函数有多种多样的形状和大小。我们能够定义某种组合方式，来让它们成为一种新的组合函数，程序中不同的部分都可以使用这个函数。这种将函数一起使用的过程叫做组合。 阅读全文
摘要：
在第 2 章的 “函数输入” 小节中，我们聊到了函数形参（parameters）和实参（arguments）的基本知识，实际上还了解到一些能简化其使用方式的语法技巧，比如 `...` 操作符和解构（destructuring）。
在那个讨论中，我建议尽可能设计单一形参的函数。但实际上你不能每次都做到，而且也不能每次都掌控你的函数签名（译者注：JS 中，函数签名一般包含函数名和形参等函数关键信息，例如 `foo(a, b = 1, c)`）。
现在，我们把注意力放在更复杂、强大的模式上，以便讨论处在这些场景下的函数输入。 阅读全文
摘要：
函数式编程**不是仅仅用 `function` 这个关键词来编程**。如果真这么简单，那我这本书可以到此为止了！重点在于：函数**是**函数式编程的核心。这也是如何使用函数（function）才能使我们的代码具有函数式（functional）的方法。
然而，你真的明白**函数**的含义吗？
在这一章，我们将会介绍函数的基础知识，为阅读本书的后续章节打下基础。从某些方面来讲，这章回顾的函数知识并不是针对函数式编程者，非函数式编程者同样需要了解。但如果我们想要充分、全面地学习函数式编程的概念，我们需要从里到外地**理解**函数。 阅读全文
摘要：
函数式编程（FP），不是一个新的概念，它几乎贯穿了整个编程史。我不确定这么说是否合理，但是很确定的一点是：直到最近几年，函数式编程才成为整个开发界的主流观念。所以我觉得函数式编程领域更像学者的领域。
然而一切都在变。不只是从编程语言的角度，一些库和框架都对函数式编程的兴趣空前高涨。你很可能也在读相关内容，因为你终于意识到函数式编程是不容忽视的东西。或者你跟我一样，已经尝试很多次去学函数式编程，但却很难理解所有的术语或数学符号。
无论你出于何目的翻阅本书，欢迎加入我们！ 阅读全文
摘要：
本书主要探索函数式编程(FP)的核心思想。在此过程中，作者不会执着于使用大量复杂的概念来进行诠释，这也是本书的特别之处。我们在 JavaScript 中应用的仅仅是一套基本的函数式编程概念的子集。我称之为“轻量级函数式编程(FLP)”。 阅读全文