JS-条件语句5准则
准则:
1.多重判断时使用 Array.includes
2.更少的嵌套,尽早 return
3.使用默认参数和解构
4.倾向于遍历对象而不是 Switch 语句
5.对 所有/部分 判断使用 Array.every & Array.some
1.多重判断时使用 Array.includes
例子:查询水果是什么
function test(value) {
if (value== '苹果' || value== '香蕉') {
console.log('输入的是水果'+value);
}
}
当有很多时怎么办呢?,使用Array.includes (Array.includes)重写条件语句
function test(value) {
const datas = ['苹果','香蕉','火龙果',芒果,];
if (datas.includes(value)){
console.log('输入的是水果'+value);
}
}
2.更少的嵌套,尽早 Return
例子:判断值为空抛出错误为真继续进行
function test(value) {
const datas = ['苹果','香蕉','火龙果',芒果,];
if (value) {
if (datas.includes(value)){
console.log('输入的是水果'+value);
}
}else{
console.log("输入内容有误,不是我这的水果");
return false
}
}
改进方法:去掉一层嵌套 判断为假先return
function test(value) {
if (!value) {
console.log("输入内容有误,不是我这的水果");
return false
}
const datas = ['苹果','香蕉','火龙果',芒果,];
if (datas.includes(value)){
console.log('输入的是水果'+value);
}
}
3.使用默认参数和解构
JavaScript中我们总是需要检查 null / undefined的值和指定默认值
function test(fruit, quantity) {
if (!fruit) return;
// 如果 quantity 参数没有传入,设置默认值为 1
const q = quantity || 1;
console.log(`We have ${q} ${fruit}!`);
}
//test results
test('banana'); // We have 1 banana!
test('apple', 2); // We have 2 apple!
改进为更直观的形式:
function test(fruit, quantity = 1) {
// 如果 quantity 参数没有传入,设置默认值为 1
if (!fruit) return;
console.log(`We have ${quantity} ${fruit}!`);
}
//test results
test('banana'); // We have 1 banana!
test('apple', 2); // We have 2 apple!
JS-条件语句5准则的更多相关文章
- 优化 JS 条件语句的 5 个技巧
优化 JS 条件语句的 5 个技巧 原创: 前端大全 前端大全 昨天 (给前端大全加星标,提升前端技能) 编译:伯乐在线/Mr.Dcheng http://blog.jobbole.com/11467 ...
- JS条件语句优化
1.对多个条件使用Array.includes eg: function test(fruit){ ...
- 优化 JS 条件语句及JS 数组常用方法, ---- 看完绝对对日后开发有用
前言: 日常所说的优化优化.最后我们到底优化了哪些,不如让我们从代码质量开始:个人觉得简洁简化代码其实觉得存在感挺强烈的QAQ 1. 获取URL中 ?后的携带参数: 这是我见过最简洁的了,若有更简洁的 ...
- js条件语句,用if...else if....else方程ax2+bx+c=0一元二次方程。求根
if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码 if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码 if...else if... ...
- JAVAscript学习笔记 js条件语句 第三节 (原创) 参考js使用表 (2017-09-14 15:55)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js条件语句初步练习
var a=18 if(a<10){ alert("便宜") } else{ ...
- js条件语句之职责链数组
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- js中的条件语句
//js中的条件语句 ; //example1 单分支语句 ){ console.log("你已经不年轻了!"); }else{ console.log("你依然很有活力 ...
- js中的运算符和条件语句
js中的运算符大体上可以分为4类:1算术运算符.2一元操作符.3比较运算符.4逻辑运算符. 算术运算符一般指的是加减乘除求余这五种操作符:+,-,*,/,%.通过算术运算符可以对js中的变量进行操作. ...
- JS一周游~(基础、运算符、条件语句)
一.基础篇 JavaScript 基于浏览器(客户端).基于(面向)对象{没有继承}.事件驱动(要有对象).脚本语言(灵活多变) 1.作用 表单的验证,减轻服务端的压力 添加页面动画效果 动态更改页面 ...
随机推荐
- java 多线程实现四种方式解析Thread,Runnable,Callable,ServiceExcutor,Synchronized ,ReentrantLock
1.Thread实现: import java.util.Date; import java.text.SimpleDateFormat; public class MyThread extends ...
- JS jQuery 点击页面漂浮出文字
看到有些网站点击页面任意地方都会弹出文字出来 感觉很炫酷 但其实实现方法很简单 哇哈哈哈~~~ // 调用 ( e, 消失毫秒, 数组, 向上漂浮距离) $(document).click(funct ...
- try/catch/finally 语句
定义和用法 try/catch/finally 语句用于处理代码中可能出现的错误信息. 错误可能是语法错误,通常是程序员造成的编码错误或错别字.也 可能是拼写错误或语言中缺少的功能(可能由于浏览器差异 ...
- EditPlus等编辑器选中列(块)的方法
EditPlus 1)菜单:编辑 -> 选择 -> 列选择2)先按下 Alt + C ,释放,然后移动鼠标或键盘上下左右键进行选择注意:在自动换行的模式下是不行的,改为不自动换行就行了. ...
- python 批量编译 批量删除
把项目的py文件变异成pyc文件,好处是可以保护源码不泄露. 假如一个工程文件夹有1000个py文件,这个时候怎样快速处理 ? 两步走: ① py--->pyc python -m compi ...
- 动态数组、allocator 类
12.2 动态数组 12.2.1 new 和数组 1.分配一个动态数组即是在分配一个new对象时在类型名之后加一对方括号,用来存放数组大小,该数可以是任意表达式.也可以是0,只需是整形.无需是常量.数 ...
- 题解【洛谷P3662】[USACO17FEB]Why Did the Cow Cross the Road II S
本题是练习前缀和的好题!我们可以枚举前端点,确定一个长度为k的区间,然后利用前缀和统计区间内损坏的灯的数量,最后取最小值即可.AC代码: #include <bits/stdc++.h> ...
- flutter_html 和 WebView 解析html 和 build.gradle源码
一.flutter_html 涉及的 api 接口: http://www.phonegap100.com/appapi.php?a=getPortalArticle&aid=20 二.Flu ...
- CSS和JS两种颜色渐变文字效果代码
js实现颜色渐变文字效果代码: <!-- js颜色渐变色文字 --> <div id="moml"> <div style="text-al ...
- 优化 : Oracle数据库Where条件执行顺序 及Where子句的条件顺序对性能的影响
.Oracle数据库Where条件执行顺序: 由于SQL优化起来比较复杂,并且还会受环境限制,在开发过程中,写SQL必须必须要遵循以下几点的原则: 1.ORACLE采用自下而上的顺序解析WHERE子句 ...