Skip to content

Commit e7f6d25

Browse files
committed
Merge pull request #12 from dyygtfx/master
add simple chinese translation version
2 parents 63454e3 + fee33b1 commit e7f6d25

File tree

2 files changed

+271
-0
lines changed

2 files changed

+271
-0
lines changed

README.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ A Cookbook for writing FP in JavaScript using ES6
44
**Translations**
55

66
- [Português (Brasil)](/translations/pt-BR/README.md)
7+
- [简体中文](/translations/zh-CN/README.md)
78

89
### Summary
910

@@ -260,3 +261,5 @@ addFive(10);
260261
[https://drboolean.gitbooks.io/mostly-adequate-guide/](https://drboolean.gitbooks.io/mostly-adequate-guide/)
261262

262263
[https://www.youtube.com/watch?v=DisD9ftUyCk](https://www.youtube.com/watch?v=DisD9ftUyCk)
264+
265+

translations/zh-CN/README.md

Lines changed: 268 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,268 @@
1+
## JavaScript 函数式编程手册 (ES6)
2+
一份用 ES6 写的 JavaScript 函数式编程手册
3+
4+
**Translations**
5+
6+
- [Português (Brasil)](/translations/pt-BR/README.md)
7+
- [简体中文版](/translations/zh-CN/README.md)
8+
9+
### 概要
10+
11+
* [Pure functions](#pure-functions)
12+
* [Higher-order functions](#higher-order-functions)
13+
* [Recursion](#recursion)
14+
* [Functor](#functor)
15+
* [Compose](#compose)
16+
* [Destructuring](#destructuring)
17+
* [Currying](#currying)
18+
19+
### 纯函数式
20+
Returns the same result given same parameters. It's execution doesn't depend on the state of the system.
21+
22+
1) 非纯函数式
23+
24+
```javascript
25+
let number = 1;
26+
27+
const increment = () => number += 1;
28+
29+
increment();
30+
// 2
31+
```
32+
33+
2) 纯函数式
34+
35+
```javascript
36+
const increment = n => n + 1;
37+
38+
increment(1);
39+
// 2
40+
```
41+
42+
### 高阶函数
43+
Functions that operate on other functions, either by taking them as arguments or by returning them.
44+
45+
1) 加法
46+
47+
```javascript
48+
const sum = (x, y) => x + y;
49+
50+
const calculate = (fn, x, y) => fn(x, y);
51+
52+
calculate(sum, 1, 2);
53+
// 3
54+
```
55+
56+
2) filter
57+
58+
```javascript
59+
let students = [
60+
{name: 'Anna', grade: 6},
61+
{name: 'John', grade: 4},
62+
{name: 'Maria', grade: 9}
63+
];
64+
65+
const isApproved = student => student.grade >= 6;
66+
67+
students.filter(isApproved);
68+
// [ { name: 'Anna', grade: 6 }, { name: 'Maria', grade: 9 } ]
69+
```
70+
71+
3) Map
72+
73+
```javascript
74+
const byName = obj => obj.name;
75+
76+
students.map(byName);
77+
// [ 'Anna', 'John', 'Maria' ]
78+
```
79+
80+
4) 链式
81+
82+
```javascript
83+
let students = [
84+
{name: 'Anna', grade: 6},
85+
{name: 'John', grade: 4},
86+
{name: 'Maria', grade: 9}
87+
];
88+
89+
const isApproved = student => student.grade >= 6;
90+
91+
const byName = obj => obj.name;
92+
93+
students.filter(isApproved).map(byName);
94+
// ['Anna', 'Maria']
95+
```
96+
97+
5) Reduce
98+
99+
```javascript
100+
const totalGrades = students.reduce((sum, student) => sum + student.grade, 0);
101+
102+
totalGrades
103+
// 19
104+
```
105+
106+
### 递归
107+
108+
当一个函数调用它自己的时候,就创造了一个循环
109+
110+
1) 递减
111+
112+
```javascript
113+
const countdown = num => {
114+
if (num > 0) {
115+
console.log(num);
116+
countdown(num - 1);
117+
}
118+
}
119+
120+
countdown(5);
121+
/*
122+
5
123+
4
124+
3
125+
2
126+
1
127+
*/
128+
```
129+
130+
2) 阶乘
131+
132+
```javascript
133+
const factorial = num => {
134+
if (num <= 0) {
135+
return 1;
136+
} else {
137+
return (num * factorial(num - 1));
138+
}
139+
}
140+
141+
factorial(5);
142+
//120
143+
```
144+
145+
### Functor
146+
有 map 方法的对象。functor 的 map 方法通过 map 回调函数调用自己的内容,然后返回一个新的 functor.
147+
148+
1) 给数组所有的元素添加一个值
149+
150+
```javascript
151+
const plus1 = num => num + 1;
152+
153+
let numbers = [1, 2, 3];
154+
numbers.map(plus1);
155+
// [2, 3, 4]
156+
```
157+
158+
### 组合
159+
160+
通过组合两个或更多的函数生成一个新的函数
161+
162+
1) 组合两个函数生成一个新的函数
163+
164+
```javascript
165+
const compose = (f,g) => x => f(g(x));
166+
167+
const toUpperCase = x => x.toUpperCase();
168+
const exclaim = x => `${x}!`;
169+
170+
const angry = compose(exclaim, toUpperCase);
171+
172+
angry("stop this");
173+
// STOP THIS!
174+
```
175+
176+
2) 组合三个函数生成一个新的
177+
178+
```javascript
179+
const compose = (f,g) => x => f(g(x));
180+
181+
const toUpperCase = x => x.toUpperCase();
182+
const exclaim = x => `${x}!`;
183+
const moreExclaim = x => `${x}!!!!!`;
184+
185+
const reallyAngry = compose(exclaim, compose(toUpperCase, moreExclaim));
186+
187+
reallyAngry("stop this");
188+
// STOP THIS!!!!!!
189+
```
190+
191+
### 解构
192+
193+
从数组中提取数据或对象使用一种语法混合数组和对象文本的建设。或“模式匹配”。
194+
195+
1) Select from pattern
196+
197+
```javascript
198+
const foo = () => [1, 2, 3];
199+
200+
const [a, b] = foo();
201+
console.log(a, b);
202+
// 1 2
203+
```
204+
205+
2) 接收 rest 值
206+
207+
```javascript
208+
const [a, ...b] = [1, 2, 3];
209+
console.log(a, b);
210+
// 1 [2, 3]
211+
```
212+
213+
3) 可选参数
214+
215+
```javascript
216+
const ajax = ({ url = "localhost", port: p = 80}, ...data) =>
217+
console.log("Url:", url, "Port:", p, "Rest:", data);
218+
219+
ajax({ url: "someHost" }, "additional", "data", "hello");
220+
// Url: someHost Port: 80 Rest: [ 'additional', 'data', 'hello' ]
221+
222+
ajax({ }, "additional", "data", "hello");
223+
// Url: localhost Port: 80 Rest: [ 'additional', 'data', 'hello' ]
224+
```
225+
226+
### 柯里化
227+
228+
一个函数有多个参数,把每个参数通过链式的形式返回下一个函数,直到最后返回结果。
229+
230+
231+
1) 对象柯里化
232+
233+
```javascript
234+
const student = name => grade => `Name: ${name} | Grade: ${grade}`;
235+
236+
student("Matt")(8);
237+
// Name: Matt | Grade: 8
238+
```
239+
240+
2) 加法函数柯里化
241+
242+
```javascript
243+
const add = x => y => x + y;
244+
245+
const increment = add(1);
246+
const addFive = add(5);
247+
248+
increment(3);
249+
//4
250+
251+
addFive(10);
252+
// 15
253+
```
254+
255+
### 参考资源
256+
[https://gist.github.com/mikaelbr/9900818](https://gist.github.com/mikaelbr/9900818)
257+
258+
[https://www.gitbook.com/book/jcouyang/functional-javascript/details](https://www.gitbook.com/book/jcouyang/functional-javascript/details)
259+
260+
[https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84](https://www.youtube.com/playlist?list=PL0zVEGEvSaeEd9hlmCXrk5yUyqUag-n84)
261+
262+
[http://functionaljavascript.blogspot.com.br/2013/07/functors.html](http://functionaljavascript.blogspot.com.br/2013/07/functors.html)
263+
264+
[http://nicoespeon.com/en/2015/01/pure-functions-javascript/](http://nicoespeon.com/en/2015/01/pure-functions-javascript/)
265+
266+
[https://drboolean.gitbooks.io/mostly-adequate-guide/](https://drboolean.gitbooks.io/mostly-adequate-guide/)
267+
268+
[https://www.youtube.com/watch?v=DisD9ftUyCk](https://www.youtube.com/watch?v=DisD9ftUyCk)

0 commit comments

Comments
 (0)