准则:

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准则的更多相关文章

  1. 优化 JS 条件语句的 5 个技巧

    优化 JS 条件语句的 5 个技巧 原创: 前端大全 前端大全 昨天 (给前端大全加星标,提升前端技能) 编译:伯乐在线/Mr.Dcheng http://blog.jobbole.com/11467 ...

  2. JS条件语句优化

    1.对多个条件使用Array.includes eg: function test(fruit){                                                    ...

  3. 优化 JS 条件语句及JS 数组常用方法, ---- 看完绝对对日后开发有用

    前言: 日常所说的优化优化.最后我们到底优化了哪些,不如让我们从代码质量开始:个人觉得简洁简化代码其实觉得存在感挺强烈的QAQ 1. 获取URL中 ?后的携带参数: 这是我见过最简洁的了,若有更简洁的 ...

  4. js条件语句,用if...else if....else方程ax2+bx+c=0一元二次方程。求根

    if 语句 - 只有当指定条件为 true 时,使用该语句来执行代码 if...else 语句 - 当条件为 true 时执行代码,当条件为 false 时执行其他代码 if...else if... ...

  5. JAVAscript学习笔记 js条件语句 第三节 (原创) 参考js使用表 (2017-09-14 15:55)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. js条件语句初步练习

    var a=18            if(a<10){                alert("便宜")            }            else{  ...

  7. js条件语句之职责链数组

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. js中的条件语句

    //js中的条件语句 ; //example1 单分支语句 ){ console.log("你已经不年轻了!"); }else{ console.log("你依然很有活力 ...

  9. js中的运算符和条件语句

    js中的运算符大体上可以分为4类:1算术运算符.2一元操作符.3比较运算符.4逻辑运算符. 算术运算符一般指的是加减乘除求余这五种操作符:+,-,*,/,%.通过算术运算符可以对js中的变量进行操作. ...

  10. JS一周游~(基础、运算符、条件语句)

    一.基础篇 JavaScript 基于浏览器(客户端).基于(面向)对象{没有继承}.事件驱动(要有对象).脚本语言(灵活多变) 1.作用 表单的验证,减轻服务端的压力 添加页面动画效果 动态更改页面 ...

随机推荐

  1. laravel实现excel表的导入导出功能

    1.这是个我去公司之后曾经折磨我很久很久的功能查阅了很多资料但是功夫不负有心人在本人的不懈努力下还是实现了这个功能 (ps看不懂我下面说讲述的可以参考这个laravel学院的官方文档 https:// ...

  2. tp5.1 Auth类实现权限管理

    了解来这么久权限控制权限的知识,却不知道如何写代码,网上的代码多数并没有多少完整的源码能提供参考.偶然看到官网的例子,现在终于也把源码的实现也弄得明白了一点. tp5框架的Auth类可以实现页面的访问 ...

  3. 在虚拟机中使用Git

    自己如何从安装虚拟机到使用git进行项目代码版本管理的部分教程因为是自学所以没有好的教程只能自己进行百度,网上的教程太多了但都是只是一个模块没有从头到尾详细的教程,我们如果有个详细的教程本来只需花很少 ...

  4. Nginx可以做什么

    Nginx能做什么 ——反向代理 ——负载均衡 ——HTTP服务器(动静分离) ——正向代理 反向代理 反向代理应该是Nginx做的最多的一件事了,什么是反向代理呢,以下是百度百科的说法:反向代理(R ...

  5. win api + 基础乐理产生正弦波声音

    暂时记录. 感觉想写个电子钢琴乐程序了,不过感觉音有点怪怪的. #include <iostream> #include <windows.h> #include <Mm ...

  6. 使用git pull同步github代码到服务器

    我直接用git pull的时候遇到这个错误: error: Your local changes to the following files would be overwritten by merg ...

  7. Vue - 解决路由过渡动画抖动问题

    前言 Vue-Router 作为 Vue 的核心模块,它为我们提供了基于组件的路由配置.路由参数等功能,让单页面应用变得更易于管理.良好的路由管理尤为重要,比如路由拦截.路由懒加载.路由权限等都在开发 ...

  8. hadoop SecondNamenode详解

    SecondNamenode名字看起来很象是对第二个Namenode,要么与Namenode一样同时对外提供服务,要么相当于Namenode的HA. 真正的了解了SecondNamenode以后,才发 ...

  9. cookie、session以及中间件

    cookie cookie是保存客户端浏览器上的键值对,是服务端设置在客户端浏览器上的键值对,也就意味着浏览器其实可以拒绝服务端的'命令',默认情况下浏览器都是直接让服务端设置键值对 设置cookie ...

  10. Python turtle库详解

    Python turtle库详解 Turtle库是Python语言中一个很流行的绘制图像的函数库,想象一个小乌龟,在一个横轴为x.纵轴为y的坐标系原点,(0,0)位置开始,它根据一组函数指令的控制,在 ...