js-ifelse-奇技淫巧

我们有A,B,C,D四个不同的类别,在最开始的时候只有三个类别,并且两个类别是做同样的事:

1 function categoryHandle(category) {
2     if(category !== ‘A‘) {
3       console.log(‘B, C‘);
4     } else {
5       console.log(‘A‘);
6     }
7 }

1.1

接着,出现了类别D——它与B和C相比来说,有一个不同的任务,而它又和B和C有一个相同的任务。于是,代码变成了这样。

function categoryHandle(category) {
  if(category !== ‘A‘) {
    if(category === ‘D‘) {
      console.log(‘D‘);
    } else {
      console.log(‘B,C‘);
    }
    console.log(‘B, C ,D‘)
  } else {
    console.log(‘A‘);
  }
}

1.2

然后

function categoryHandle(category) {
  if(category === ‘A‘) {
    console.log(‘A‘);
  } else if (category === ‘B‘){
    console.log(‘B‘);
  } else if (category === ‘C‘){
    console.log(‘D‘);
  }else if (category === ‘D‘){
    console.log(‘D‘);
  }
}

1.3

当然用switch语句来做,但是我真不想这样想。接着,JavaScript的奇技淫巧来完成这个工作:

function categoryHandleRefactor(category) {
  var categoryAction = {
    ‘A‘: {
      run: function () {
        console.log(‘A‘)
      }
    },
    ‘B‘: {
      run: function () {
        console.log(‘B‘)
      }
    },
    ‘C‘: {
      run: function () {
        console.log(‘C‘)
      }
    },
    ‘D‘: {
      run: function () {
        console.log(‘D‘)
      }
    }
  };
  categoryAction[category].run();
}

1.4

				
时间: 2024-08-04 07:03:44

js-ifelse-奇技淫巧的相关文章

js - if-else语句

if语句 语法: if(条件){ // 条件成立,执行这里的代码 } if中的这个条件会被转换成true/false 条件要么成立,要么不成立 成立为真 表示为true 不成立为假 表示为false 经过几天的练习,我了解到只要是条件判断,那么用  if  语句就没错了,当条件不止一个时,那就要走 else 来执行了,当 else 也压不住的话就得请else if ( 条件) 来判断啦 ヾ(???ゞ). 当然了,每学一个知识点,我们都要去用它去做一些东西来检(增)验(加)一(些)下(成)掌(就)

js求数组的最大值--奇技淫巧和笨方法

写这篇文章的原因我目前做的项目很少用到算法,于是这方面的东西自然就有点儿生疏.最近的一次编码中遇到了从数组中获取最大值的需求,当时我不自觉的想到了js的sort()函数,现在想来真是有些“罪过”,当时自己内心还觉得有些得意:“嗯,我用js的内置方法解决了一个通常需要用排序算法才能解决的问题,代码简短,不用去写头疼的遍历和比较,可读性还好...”.内心戏很重,对吧.咳咳,哎,自己还是嫩而且还懒.js内生的sort函数也是用到了排序,详见segmentfault上的这个js内生sort()函数是如何

[JS]玩转博客园的几个“奇技淫巧”

混迹博客园快一个月了,非常喜欢这块技术氛围浓厚的园地,不过在玩转园子的过程中也发现了几个小缺陷,不过好在申请了JS权限之后可以解决大部分的不方便,而在不能植入自定义JS的页面也可以用比较hack的方式来缓解问题.本文就来说一说我这一个月来碰到的几个问题以及解决之道:D 一.判断当前用户 写随笔的过程中可能经常需要对页面进行一下预览,然而编辑器的预览功能没办法带上自定义的CSS和JS,所以通常都得保存草稿然后查看随笔.预览完之后想要继续编辑的话就得一直拉到随笔的结尾,这个实在是不太方便,于是自然就

JS基础整理(if-else for循环)

1.if---else语句 if(判断条件) { 满足条件要执行的语句: } else { 不满足执行: } ----------------------------------------------------------------------- **三元运算符 var  x = 判断条件?a:b; 相当于 if(判断条件) { x=a; } else { x=b; } ------------------------------------------------------------

JS中的运算符&JS中的分支结构

一.JS中的运算符 1.算术运算(单目运算符) + 加.- 减.* 乘./ 除.% 取余.++ 自增.-- 自减 >>> +:有两种作用,连接字符串/加法运算.当+两边全为数字时,进行加法运算: 当+两边有任意一边为字符串时,起连接字符串的作用,连接之后的结果为字符串 除+外,其余符号运算时,会先尝试将左右变量用Number函数转为数字 >>> /: 结果会保留小数点 >>> ++: 自增运算符,将变量在原有基础上+1: --: 自减运算符,将变量在原

python--JavaScript(js)/上

JavaScript(js) ECMA-----定义的基础语法 DOM------document  object  model BOM------Browser  object  model Javasript 基于对象的,也是面向对象 ECMAScript描述了以下内容: 语法 类型 语句 关键字 保留字 运算符 对象(封装 继承 多态)基于对象的语言 使用对象 JavaScript的引入方式 直接编写: <script> alert(123) </script> 导入文件 &

JS基础

JavaScript 第 一 部 分 一.定义 基于浏览器的语言: 基于面向对象:c语言面向过程,java面向对象:继承,封装,多态; 事件驱动: 脚本语言: 二.作用: 表单验证,减轻服务端的压力: 添加页面动画效果: 动态更改页面内容: AJax网络请求: 三.组成部分: ECMAScript;脚本程序语言, 语言标准ES5.1,最新ES6.0; 语法,变量和数据类型, DOM; 文档对象模型 ;文档节点 BOM浏览器对象模型window:history,doucument,location

JS 部分基础内容总结

JavaScript 是脚本语言 HTML 中的脚本必须位于 <script> 与 </script> 标签之间. 脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中. JS使用三种方式: 1.HTML页面内嵌JS代码(不提倡使用) 2.HTML页面中直接使用JS: <script type="text/javascript"> JS代码 </script> 3.引用外部JS文件: <s

JS初步学习

[使用JS的三种方式] 1.HTML标签中内嵌JS(不提倡使用): <button onclick="javascript:alert('小碧池!你真点啊!')">有本事点我呀!!!</button> 2.HTML页面中直接使用JS: <script type="text/javascript"> //JS代码 </script> 3.引用外部JS文件: <script language="JavaSc

关于js的一些基础随笔

JS基础 01. js API:别人准备好的东西,我们负责使用. 能够独立写出所有代码. 五天之后说有代码从新写一遍. 十天过后提问. 问题用red标出 02. js分为三部分.语法.注释(总结).异步以及同步(简单介绍).交换两个变量量的值. 命名规范必须遵守.类型转换.运算符.流程控制. 重点 03. 快捷键  等待添加 04. 浏览器 五大浏览器:chrome.firefox.safari.ie(*).opera. 浏览器兼容问题(important) 测试只测试这五个(chrome.fi