RxJS 笔记 02

参考 简书原文 作者:readilen
Expressions versus statements in JavaScript

Functional Programming (功能编程)

核心思想就是做运算处理,并用 function 来思考问题

// (5 + 6) - 1 * 3
const add = (a, b) => a + b
const mul = (a, b) => a * b
const sub = (a, b) => a - b

sub(add(5, 6), mul(1, 3))

基本要件

  • 函式为一等公民 (First Class)
    指跟其他资料型别具有同等地位,也就是说函式能够被赋值给变数,函式也能够被当作参数传入另一个函式,也可当作一个函式的回传值
// 1. 函式能够被赋值给变数
var hello = function() {}

// 2. 函式能被当作参数传入
fetch('www.google.com')
.then(function(response) {}) // 匿名 function 被传入 then()

// 3. 函式能被当作回传值
var a = function(a) {
    return function(b) {
      return a + b;
    }; 
    // 可以回传一个 function
}
  • 都是 表达式 (Expression) 不会是 陈述式(Statement)。
// 表达式: 一般是一个运算过程,一定会有返回值,例如执行一个 function
add(1,2)

// 陈述式: 则是表现某个行为,例如一个 赋值给一个变数
a = 1;
  • Pure Function (Referential transparency 引用透明)
/*
指 一个 function 给予相同的参数,永远会回传相同的返回值,
并且没有任何显著的副作用(Side Effect)
*/
var arr = [1, 2, 3, 4, 5];

arr.slice(0, 3); // [1, 2, 3]

arr.slice(0, 3); // [1, 2, 3]

arr.slice(0, 3); // [1, 2, 3]

/*
这裡我们换成用 splice,因为 splice 每执行一次就会影响 arr 的值,
导致每次结果都不同,这就很明显不是一个 pure function。
*/
var arr = [1, 2, 3, 4, 5];

arr.splice(0, 3); // [1, 2, 3]

arr.splice(0, 3); // [4, 5]

arr.slice(0, 3); // []
  • Side Effect (无)
Side Effect 
是指一个 function 做了跟本身运算返回值没有关系的事,
比如说修改某个全域变数,或是修改传入参数的值,甚至是执行 console.log 都算是 Side Effect。

优势

  • 可读性高

    /*
    透过一系列的函式封装资料的操作过程,
    程式码能变得非常的简洁且可读性极高,
    */
    [9, 4].concat([8, 7]) // 合併阵列
      .sort()  // 排序
      .filter(x => x > 5) // 过滤出大于 5 的
  • 可维护性高

因为 Pure function 等特性,
执行结果不依赖外部状态,
且不会对外部环境有任何操作,
使 Functional Programming 能更好的除错及撰写单元测试。
  • 易于并行/平行处理
(Concurrency/Parallel) 并发 / 并行 处理
基本上只做运算不碰 I/O
没有 Side Effect 的特性
较不用担心 deadlock(僵局) 等问题