碎片时间学编程「77]:用对象字面量替换 JavaScript switch 语句

JavaScript 的switch语句是我发现很难记住语法的少数几件事之一(很高兴 VS Code 具有自动完成功能)。它在语法上也感觉有点不合适,因为它是唯一不使用花括号的东西,你需要记住每个case 的 breakw语句. 此外,由于其控制流程是程序性的,因此其性能并不出色。

幸运的是switch对于我能想到的大多数语句用例来说,JavaScript 的对象文字是一个很好的替代方案。case这个想法是为您在switch语句中拥有的每个键定义一个对象。然后,您可以使用传递给switch语句的表达式直接访问其值。

let fruit = 'oranges';

switch (fruit) {

case 'apples':

console.log('Apples');

break;

case 'oranges':

console.log('Oranges');

break;

}

// Logs: 'Oranges'

const logFruit = {

'apples': () => console.log('Apples'),

'oranges': () => console.log('Oranges')

};

logFruit[fruit](); // Logs: 'Oranges'

虽然这无限地更具可读性和更少冗长,但它也明显更快。然而,我们还没有解决default问题。要处理它,我们只需添加一个'default'键并检查表达式的值是否存在于我们的对象中。

let fruit = 'strawberries';

switch (fruit) {

case 'apples':

console.log('Apples');

break;

case 'oranges':

console.log('Oranges');

break;

default:

console.log('Unknown fruit');

}

// Logs: 'Unknown fruit'

const logFruit = {

'apples': () => console.log('Apples'),

'oranges': () => console.log('Oranges'),

'default': () => console.log('Unknown fruit')

};

(logFruit[fruit] || logFruit['default'])(); // Logs: 'Unknown fruit'

最后要解决的是break,我们的对象字面量替换应该能够处理失败的情况,类似于没有语句时发生的情况。这是一个简单地提取和重用对象文字中的逻辑的问题。

let fruit = 'oranges';

switch (fruit) {

case 'apples':

case 'oranges':

console.log('Known fruit');

break;

default:

console.log('Unknown fruit');

}

// Logs: 'Known fruit'

const knownFruit = () => console.log('Known fruit');

const unknownFruit = () => console.log('Unknown fruit');

const logFruit = {

'apples': knownFruit,

'oranges': knownFruit,

'default': unknownFruit

};

(logFruit[fruit] || logFruit['default'])(); // Logs: 'Known fruit'

为了总结这一切,我们可以将这个逻辑概括并提取到一个简单的可重用函数中。我们将为它提供查找对象和默认情况的可选名称(我们将默认_default为避免任何冲突)。该函数将依次返回一个具有适当查找逻辑的函数,我们可以使用它来替换任何switch语句。

const switchFn = (lookupObject, defaultCase = '_default') =>

expression => (lookupObject[expression] || lookupObject[defaultCase])();

const knownFruit = () => console.log('Known fruit');

const unknownFruit = () => console.log('Unknown fruit');

const logFruit = {

'apples': knownFruit,

'oranges': knownFruit,

'default': unknownFruit

};

const fruitSwitch = switchFn(logFruit, 'default');

fruitSwitch('apples'); // Logs: 'Known fruit'

fruitSwitch('pineapples'); // Logs: 'Unknown fruit'

更多内容请访问我的网站:https://www.icoderoad.com

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容