TypeScript 可选链初体验

TypeScript 3.7 的新功能中，最受关注的就是可选链 (Optional Chaining)了，可以说是彻底解决了多层级嵌套对象的属性访问时的判断苦恼，赶快来尝尝看香不香。

下面是开发中会碰到的一个典型场景，我们从后端接口拿到一个返回对象：

const apiResult = {
  data: {
    Response: {
      code: 0,
      total: 0,
      List: null,
    },
  },
};

 这是一个列表的接口，但我们看到，这里面List的值是null，这明显不合我们的预期，直接调用的话就会导致后继代码的报错，所以我们需要先进行判断，然后给他赋一个默认值。

在此之前，我们也许要这样判断

const list =
  (apiResult &&
    apiResult.data &&
    apiResult.data.Response &&
    apiResult.data.Response.List) ||
  [];

 又或者这样：

const list = !apiResult
  ? undefined
  : !apiResult.data
  ? undefined
  : !apiResult.data.Response
  ? undefined
  : apiResult.data.Response.List || [];

 又或者是借助于lodash

import * as _ f