TypeScript 的 Substitutability - 图1

Substitutability 中文含义是 可代替性，这个词我未在 TypeScript 的语言特性相关文档上看到，百度、谷歌搜索也寥寥无几。仅在[TypeScript FAQ] 找到相关描述。

有关类型系统的许多答案都提到了可替代性。 这是一个原则，即如果可以使用对象X代替某些对象Y，则X是Y的子类型。我们通常也说X可以分配给Y（这些术语在TypeScript中的含义略有不同，但是 区别在这里并不重要）。

这段描述很好理解，大体就是子类型可以用在父类型出现的地方。但实际涉及的TypeScript使用场景，和这个词不是很契合，也许是语言的差异，中文含义不便于理解。

实际 Substitutability 解决的场景是： TypeScript 允许 function 作为回调函数时，入参个数、返回类型可以不符合方法签名。

回调 Function 入参比签名少

fetchResults 有一个参数，即回调函数。 该方法从某处获取数据，然后执行回调。 回调的方法签名有两个参数， statusCode 和 results 。 

  1. ction fetchResults(callback: (statusCode: number, results: number[]) => void) {
  2.   const results = [1,2,3];
  3.     ...
  4.       callback(200, results); 
  5.       }
  1.   我们用下面的方式调用 `fetchResults`，注意方法签名是不同的，它没有第二个参数 `results`。
  2.   ```
  3.   function handler(statusCode: number) {
  4.     // 业务处理
  5.       ...
  6.       }
  8.       fetchResults(handler); // ✔️
  9.       ```
  10.       可以正常编译，没有任何错误或警告。 看起来有点奇怪，但细想一下，你一直在这么用。
  12.        `Array.prototype.forEach `方法签名
  13.        ```
  14.            /**
  15.                 * Performs the specified action for each element in an array.
  16.                      * @param callbackfn  A function that accepts up to three arguments. forEach calls the callbackfn function one time for each element in the array.
  17.                           * @param thisArg  An object to which the this keyword can refer in the callbackfn function. If thisArg is omitted, undefined is used as the this value.
  18.                                */
  19.                                    forEach(callbackfn: (value: T, index: number, array: T[]) => void, thisArg?: any): void
  20.                                    ```
  21.                                    实际使用：
  22.                                    ```
  23.                                    let items = [1, 2, 3];
  24.                                    items.forEach(arg => console.log(arg));
  25.                                    ```
  26.                                    在运行时，forEach使用三个参数(value、index、array)调用给定的回调函数，但大多数时候回调函数只使用其中的一个或两个参数。
  28.                                    那为什么不干脆将forEach 参数声明为可选。
  30.                                    ```
  31.                                    forEach(callback: (element?: T, index?: number, array?: T[]))
  32.                                    ```
  33.                                    如果声明为可选，由于回调的提供者不知道调用方何时会传递多少参数，将不得不检查各个参数，这显然不是你想要的。
  35.                                    ```
  36.                                    function maybeCallWithArg(callback: (x?: number) => void) {
  37.                                        if (Math.random() > 0.5) {
  38.                                                callback();
  39.                                                    } else {
  40.                                                            callback(42);
  41.                                                                }
  42.                                                                }
  43.                                                                ```
  44.                                                                声明非可选，是站在调用者的角度，保证按声明传递参数，可以兼容需要不同个数参数的回调函数；
  46.                                                                **这么处理的合理性在于，回调函数自身是最了解如何处理入参的，如果它不关心某些入参，它可以安全的忽略。**
  49.                                                                ## 回调返回类型不匹配签名 return void 
  50.                                                                如果函数类型指定返回类型 void，则也接受具有不同的、更具体的返回类型的函数。同样，用前面的例子，这次增加handle的返回类型声明。
  52.                                                                ```
  53.                                                                function handler(statusCode: number): {age:number}{
  54.                                                                  //  业务处理
  55.                                                                    ...
  56.                                                                      return {"age": 4};
  57.                                                                      }
  59.                                                                      fetchResults(handler); // ✔️
  60.                                                                      ```
  61.                                                                      fetchResults 接受的回调函数返回类型是void，而这次的handler 返回`{age:number}`类型，依然正常编译。
  63.                                                                      你依然可以将callback结果赋值给一个变量，但仅仅限于声明语句，其他操作都将编译失败。
  64.                                                                      ```
  65.                                                                      function fetchResults(callback: (statusCode: number, results: number[]) => void) {
  66.                                                                        const results = [1,2,3];
  67.                                                                          ...
  68.                                                                            let didItWork = callback(200, results); // ✔️  1）
  69.                                                                              console.log(didItWork); // ✔️
  70.                                                                                console.log(didItWork.age) // ❌
  71.                                                                                  didItWork = {"age": 4} ; // ❌
  72.                                                                                  }
  74.                                                                                  // 注意虽然编译报错，但不影响最后js执行，Playground 运行结果
  75.                                                                                  [LOG]: {
  76.                                                                                    "age": 4
  77.                                                                                    } 
  78.                                                                                    [LOG]: 4 
  79.                                                                                    ```
  81.                                                                                    可能有人困惑既然void类型无法进行其他操作，为什么要允许1）处赋值void类型给变量。TypeScript 1.4语言规范 给出了如下说明：
  83.                                                                                    > 注意：我们考虑过禁止声明Void类型的变量，因为它们没有用处。 但是，由于允许将Void作为泛型类型或函数的类型参数，因此不允许Void属性或参数是不可行的。
  86.                                                                                    ```
  87.                                                                                    function foo<T>(param:T) {
  88.                                                                                       let localParam:T = param;
  89.                                                                                       }
  90.                                                                                       foo<number>(3); // ✔️
  91.                                                                                       foo<void>(undefined); // ✔️
  92.                                                                                       ```
  95.                                                                                       **这么处理的合理性在于，回调函数的调用者通过声明callback 返回void, 它最清楚也可以保证返回值不会被使用。**

```