switch case 优化

前情提示：前几天遇到代码里面switch case写的又长又臭，维护起来很麻烦，于是开始优化。

看一下原来代码：

看上去是不是很蠢，switch case里面还有一层switch case。严重影响可维护性。
先设定一个函数，传进来id为1，2，3，4分别返回不同的值，下面说一下三种解决方案。

let id
switch (id) {
	case 1:
	   return 'a'
	case 2:
	   return 'b'
	case 3:
	   return 'c'
	case 4:
	   return 'd'
}

方案一:

Map里接受一个具有iterable接口的对象，然后对其进行遍历，get传入的值如果跟Map里key值对应，那么就会返回与key对应的value，如果是赋值操作Map可以完美替代switch case。代码如下：

let map = new Map([
	[1, 'a'],
	[2, 'b'],
	[3, 'c'],
	[4, 'd']
])
let str = map.get(id)
console.log(str)

方案二:

lookup对象：将所有结果写到一个对象里，传进key，返回key对应的value。代码如下：

let obj = {
     1: 'a',
     2: 'b',
     3: 'c',
     4: 'd'
}
let str = obj[id]
console.log(str)

方案三:

分别用一个数组存放key和value，然后循环遍历key数组，拿到相对应的value。代码如下：

let str
let arrKey = [1, 2, 3, 4]
let arrValue = ['a', 'b', 'c', 'd']
arrKey.map(function (key, index) {
    if (id === key) {
        str = arrValue[index];
    }
})
console.log(str)

补充：
有时候switch case作用在图片路径上，也可用上述方案二，如下：

<img :src="arrKey[id]">

data () {
        return {
            arrKey: {
                '0': require('../../../../assets/public/1.png'),
                '1': require('../../../../assets/public/2.png'),
                '2': require('../../../../assets/public/3.png'),
                '3': require('../../../../assets/public/4.png'),
                '4': require('../../../../assets/public/5.png'),
                '5': require('../../../../assets/public/6.png')
            }
        }
    }

以上，互勉~~~