为什么我喜欢 JavaScript 可选链

在电影对象内部，actor 数组可以为空甚至丢失，所以你必须添加其他条件：

function getLeadingActor(movie) { 
  if (movie.actors && movie.actors.length > 0) { 
    return movie.actors[0].name; 
  } 
} 
 
getLeadingActor(movieSmall); // => undefined 
getLeadingActor(movieFull);  // => 'Harrison Ford' 

如果需要 if (movie.actors && movies.actors.length > 0) {...} ，则必须确保 movie 包含 actors 属性，并且该属性中至少有一个 actor。

使用可选链，这个任务就很容易解决：

function getLeadingActor(movie) { 
  return movie.actors?.[0]?.name; 
} 
 
getLeadingActor(movieSmall); // => undefined 
getLeadingActor(movieFull);  // => 'Harrison Ford' 

actors?. 确保 actors 属性存在。 [0]?. 确保列表中存在第一个参与者。这真是个好东西!

3. 默认为Nullish合并

一项名为nullish 合并运算符的新提案会处理 undefined 或 null ，将其默认设置为特定值。

如果 variable 是 undefined 或 null，则表达式 variable ?? defaultValue 的结果为 defaultValue。否则，表达式的计算结果为 variable 值。

const noValue = undefined; 
const value = 'Hello'; 
 
noValue ?? 'Nothing'; // => 'Nothing' 
value   ?? 'Nothing'; // => 'Hello' 

当链评估为 undefined 时，通过将默认值设置为零，Nullish 合并可以改善可选链。

例如，让我们更改 getLeading() 函数，以在电影对象中没有演员时返回 "Unknown actor" ：

function getLeadingActor(movie) { 
  return movie.actors?.[0]?.name ?? 'Unknown actor'; 
} 
 
getLeadingActor(movieSmall); // => 'Unknown actor' 
getLeadingActor(movieFull);  // => 'Harrison Ford' 

4. 可选链的3种形式

你可以通过以下 3 种形式使用可选链。

（编辑：西安站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!