javascript - 你如何在javascripts中设计（大）短路分配？

Question

想象一下你有这条线：

var result = content['aPossbileValue'] || $el.data('root-path') + content.type +  '/something/' + content.slug;

线路长度太长，所以我想知道我该如何改进？

可能的选项：

var result = content['aPossbileValue'] 
  || $el.data('root-path') + content.type + '/something/' + content.slug;

var result = content['aPossbileValue'] ||
             $el.data('root-path') + content.type + '/something/' + content.slug;

var result = content['aPossbileValue'] 
             || $el.data('root-path') + content.type + '/something/' + content.slug

或者也许这被认为是一种不好的做法！

让我知道你的意见^^！

score 0 · Accepted Answer

如果您希望减少行的长度，一种可能性是对对象使用解构赋值content来首先获取相关属性。第二步，您可以使用模板文字来生成default分配给结果的值，以防万一aPossibleValue结果falsy。像这样的东西：

let {aPossibleValue, type, slug} = content;
var result = aPossibleValue || $el.data('root-path') + `${type}/something/${slug}`;

但您应该注意，这些是ES6某些浏览器和/或版本不支持的功能。因此，请务必检查浏览器兼容性部分。如果您无法享受这种奢侈，我将采用以下方式：

let val = content.aPossibleValue, type = content.type, slug = content.slug;
var result = val | $el.data('root-path') + type + '/something/' + slug;

score 0 · Accepted Answer

使用具有描述性名称的变量比长而复杂的行更具可读性。在你的情况下，这会更好：

var customPath = $el.data('root-path') + type + '/something/' + slug;
var result = content['aPossibleValue'] || customPath;

2 回答 2