摘要:两个例子比较而言,语句的实现可能更具兼容性,可以适应于数组元素是小数的情况。若数组元素为浮点类型,第二个例子就无法正常使用。开发环境推荐是基于浏览器的集成式开发环境,支持绝大部分编程语言,包括小程序等等,无需下载安装程序,一键切换开发环境。
Coding Tip: Try to Code Without If-statements
现在开始,请尝试尽量避免使用if语句来实现我们的业务
你可能会疑问不使用if有什么好处?额~,可能也没啥很明显的好处,就是换种思考方式来解决问题。if-else并没有错,但在某些情况下大量的if-else可能会降低代码可读性。下面会列举一些实例带你感受其中的奥妙。
Challenge #1: 统计数值数组中共有多少个奇数已知一个整数类型数组,统计该数组中奇数的个数
const arrayOfIntegers = [1, 4, 5, 9, 0, -1, 5];
if实现
let counter = 0;
arrayOfIntegers.forEach((integer) => {
const remainder = Math.abs(integer % 2);
if (remainder === 1) {
counter++;
}
});
console.log(counter);
非if实现
let counter = 0;
arrayOfIntegers.forEach((integer) => {
const remainder = Math.abs(integer % 2);
// 偶数除2的余数为零,奇数的余数为一
counter += remainder;
});
console.log(counter);
记: 上述两个例子,forEach是会改变原数组的,方法是可变的,违背了当下所提倡的函数式编程immutable理念,不用在意,不是本文关注点。两个例子比较而言,if语句的实现可能更具兼容性,可以适应于数组元素是小数的情况。若数组元素为浮点类型,第二个例子就无法正常使用。
Challenge #2: 判断一个日期是周末还是工作日实现一个函数,日期对象 new Date()作为输入,根据不同日期返回当天是工作日还是周末。
if实现
const weekendOrWeekday = inputDate => {
const day = inputDate.getDay();
if (day === 0 || day === 6) {
return "weekend";
}
return "weekday";
// Or, for ternary fans:
// return (day === 0 || day === 6) ? "weekend" : "weekday";
};
console.log(weekendOrWeekday(new Date()));
非if实现
const weekendOrWeekday = (inputDate) => {
const day = inputDate.getDay();
return weekendOrWeekday.labels[day] ||
weekendOrWeekday.labels["default"];
};
weekendOrWeekday.labels = {
0: "weekend",
6: "weekend",
default: "weekday"
};
console.log(weekendOrWeekday(new Date()));
有没有注意到,if语句中的数字代表哪天是周末,判定条件分布的较为零散,我们需要做的是将数字和周末或工作日类型对应起来,如例子2,可以使用一个对象或者map来存储对应关系。
上述两个例子对比,可以明显看出非if代码实现具有更好的可读性和扩展性
Challenge #3: The doubler function (here be dragons),翻译不出来~尬~实现一个doubler函数,根据输入不同,做如下处理:
若输入是number类型, 做翻倍处理(5 => 10, -10 => -20)
若输入是string类型,重复每个字符("hello" => "hheelloo")
若输入是function类型,调用执行两次函数
若输入是array类型,对数组的每个元素做doubler处理
若输入是object类型,对对象的每个属性做doubler处理
switch实现
const doubler = (input) => {
switch (typeof input) {
case "number":
return input + input;
case "string":
return input
.split("")
.map(letter => letter + letter)
.join("");
case "object":
Object.keys(input)
.map(key => (input[key] = doubler(input[key])));
return input;
case "function":
input();
input();
}
};
console.log(doubler(-10));
console.log(doubler("hey"));
console.log(doubler([5, "hello"]));
console.log(doubler({ a: 5, b: "hello" }));
console.log(
doubler(function() {
console.log("call-me");
}),
);
非switch实现
const doubler = (input) => {
return doubler.operationsByType[typeof input](input);
};
doubler.operationsByType = {
number: (input) => input + input,
string: (input) =>
input
.split("")
.map((letter) => letter + letter)
.join(""),
function: (input) => {
input();
input();
},
object: (input) => {
Object.keys(input)
.map((key) => (input[key] = doubler(input[key])));
return input;
},
};
console.log(doubler(-10));
console.log(doubler("hey"));
console.log(doubler([5, "hello"]));
console.log(doubler({ a: 5, b: "hello" }));
console.log(
doubler(function() {
console.log("call-me");
}),
);
和Challenge #2类似,将条件值聚合在一起做统一处理。
总结当if-else的判断条件较多时,将条件做集中处理(用object存储其对应关系--条件做key,处理做value)。好处是增删某个条件变得容易,代码更加可读,提倡使用key-value对应来取代一部分的if-else的条件判断。
【开发环境推荐】Cloud Studio 是基于浏览器的集成式开发环境,支持绝大部分编程语言,包括 HTML5、PHP、Python、Java、Ruby、C/C++、.NET 小程序等等,无需下载安装程序,一键切换开发环境。 Cloud Studio提供了完整的 Linux 环境,并且支持自定义域名指向,动态计算资源调整,可以完成各种应用的开发编译与部署。
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/107038.html
摘要:译者按试着不用撸代码,是件很有趣的事,而且,万一你领会了什么是数据即代码,代码即数据呢原文译者为了保证可读性,本文采用意译而非直译。但是,不使用的话,有时候可以增加代码的可读性。 译者按: 试着不用if撸代码,是件很有趣的事,而且,万一你领会了什么是数据即代码,代码即数据呢? 原文: Coding Tip: Try to Code Without If-statements 译者:...
摘要:更多信息嵌套三元运算符之前改造后我承认,一开始,使用嵌套三元运算符的想法的确令人倒胃口。当然使用三元运算符具有两面性,但就我个人而言,嵌套三元运算符真的越来越吸引我了。 在这篇文章中,我介绍了一些编程时尝试使用的模式。这些模式是多年来我自己在工作中实践的结果,也有是从同事那里偷偷学到的。 这些模式没有特定的顺序,只是一个简单的集合。 提前退出(early exits) function...
摘要:函数式编程一开始我并不理解。渐渐地,我熟练掌握了使用函数式的方法去编程。但是自从学习了函数式编程,我将循环都改成了使用和来实现。只有数据和函数,而且因为函数没有和对象绑定,更加容易复用。在函数式的中,这些问题不复存在。 译者按: 当从业20的JavaScript老司机学会函数式编程时,他扔掉了90%的特性,也不用面向对象了,最后发现了真爱啊!!! 原文: How I rediscov...
阅读 2172·2021-09-03 10:50
阅读 1532·2019-08-30 15:55
阅读 3580·2019-08-30 15:52
阅读 1468·2019-08-30 15:44
阅读 1220·2019-08-30 15:44
阅读 3506·2019-08-30 14:23
阅读 3789·2019-08-28 17:51
阅读 2517·2019-08-26 13:52