es6 实例：消除魔术字符串

实例：消除魔术字符串

魔术字符串指的是，在代码之中多次出现、与代码形成强耦合的某一个具体的字符串或者数值。风格良好的代码，应该尽量消除魔术字符串，改由含义清晰的变量代替。

function getArea(shape, options) {
let area = 0;
switch (shape) {
case 'Triangle': // 魔术字符串
area = .5 * options.width * options.height;
break;
/* ... more code ... */
}
return area;
}
getArea('Triangle', { width: 100, height: 100 }); // 魔术字符串

上面代码中，字符串Triangle就是一个魔术字符串。它多次出现，与代码形成“强耦合”，不利于将来的修改和维护。

常用的消除魔术字符串的方法，就是把它写成一个变量。

const shapeType = {
triangle: 'Triangle'
};
function getArea(shape, options) {
let area = 0;
switch (shape) {
case shapeType.triangle:
area = .5 * options.width * options.height;
break;
}
return area;
}
getArea(shapeType.triangle, { width: 100, height: 100 });

上面代码中，我们把Triangle写成shapeType对象的triangle属性，这样就消除了强耦合。

如果仔细分析，可以发现shapeType.triangle等于哪个值并不重要，只要确保不会跟其他shapeType属性的值冲突即可。因此，这里就很适合改用 Symbol 值。

const shapeType = {
triangle: Symbol()
};

上面代码中，除了将shapeType.triangle的值设为一个 Symbol，其他地方都不用修改。

es6 实例：消除魔术字符串相关推荐

[JavaScript]什么是魔术字符串？
在读 ECMAScript 6 入门这本书时,看到一个术语叫做"魔术字符串". 其中对"魔术字符串"的诠释是: 魔术字符串指的是,在代码之中多次出现.与代码形成 ...
石川es6课程---8、字符串
石川es6课程---8.字符串一.总结一句话总结: · es6字符串新增两个方法:startsWith(以什么开头),endsWith(以什么结尾) · 新增反单引号:可以解析变量,可以折行:le ...
ES6学习（模板字符串）
模板字符串传统的JavaScript语言,输出模板通常是这样写的. const name = 'Jack'; const age = 18; const sentence = name + ' is ...
es6字符串添加html标签,JavaScript_详解JavaScript ES6中的模板字符串，在 ES6 中引入了一种新的字符 - phpStudy...
详解JavaScript ES6中的模板字符串在 ES6 中引入了一种新的字符串字面量 - 模板字符串,除了使用反引号 (`) 表示,它们看上去和普通的字符串没有什么区别.在最简单的情况下,他们就是 ...
ES6新特性之字符串扩展
字符串扩展在ES6中,为字符串扩展了几个新的API: includes() :返回布尔值,表示是否找到了参数字符串. startsWith() :返回布尔值,表示参数字符串是否在原字符串的头部. e ...
ES6新功能-模板字符串
ES6新功能-模板字符串 VS 传统JS字符串拼接
[译]JavaScript:ES6中的模板字符串简介
原文:http://tc39wiki.calculist.org/es6/template-strings/ ES6中的模板字符串(template string)是一种能在字符串文本中内嵌表达式的字 ...
ES6（二）——字符串模板、标签模板字符串、函数的默认参数、剩余参数、数组对象的展开语法、数值的表示、Symbol
一.字符串模板基本使用在ES6之前,如果我们想要将字符串和一些动态的变量(标识符)拼接到一起,是非常麻烦和丑陋的(ugly). ES6允许我们使用字符串模板来嵌入JS的变量或者表达式来进行拼接: 首 ...
js模板字符串自定义类名_详解JavaScript ES6中的模板字符串
这篇文章主要介绍了详解JavaScript ES6中的模板字符串,JS的ES6版本带来诸多简洁化方面的重大改进,需要的朋友可以参考下在 ES6 中引入了一种新的字符串字面量 - 模板字符串,除了使用 ...

es6 实例：消除魔术字符串

实例：消除魔术字符串

es6 实例：消除魔术字符串相关推荐

最新文章

热门文章