JavaScript中的switch详解

switch 语句用来选择多个需被执行的代码块之一。

1. 语法

switch(表达式) {
          
   
  case n:
    代码块
      break;
  case n:
      代码块
      break;
  default:
      默认代码块
}

2. 代码解释

    计算一次 switch 表达式 把表达式的值与每个 case 的值进行对比 如果存在匹配,则执行关联代码

3. break 关键词

如果 JavaScript 遇到 break 关键词,它会跳出 switch 代码块。不必中断 switch 代码块中的最后一个 case。代码块在此处会自然结束。

4. default 关键词

default 关键词规定不存在 case 匹配时所运行的代码。

    default 不必是 switch 代码块中最后一个 case。 如果 default 不是 switch 代码块中最后一个 case,请记得用 break 结束默认 case。 default 是可选的,并非必不可少(虽然惯例如此)。break 相关规则对 default 仍 然适用。

5. 严格的比较

Switch case 使用严格比较(===)。值必须与要匹配的类型相同。只有操作数属于同一类型时,严格比较才能为 true。

function demo(param) {
          
   
    switch (param) {
          
   
        case 1:
            console.log(1)
            break
        case 2:
            console.log(2)
            break
        default:
            console.log(default)
    }
}

demo(2) // 2
demo(2) // default
demo(new String(2)) // default
let o1 = {
          
   }
let o2 = {
          
   }
let o3 = {
          
   }
let o4 = o3

function demo (o) {
          
   
    switch (o) {
          
   
        case o1:
            console.log(o1)
            break
        case o2:
            console.log(o2)
            break
        case o3:
            console.log(o3)
            break
        default:
            console.log(default)
    }
}
    
demo(o1) // o1
demo(o3) // o3
demo(o4) // o3

6. case后接表达式

function demo (param) {
          
   
    switch (true) {
          
   
        case param == 1:
            console.log(1)
            break
        case param == 2:
            console.log(2)
            break
        default:
            console.log(default)
    }
}

demo (1) // 1
demo (1) // 1
demo (2) // 2
function demo () {
          
   
    switch (3) {
          
   
        case 1 + 1:
            console.log(1 + 1)
            break
        case 1 + 2:
            console.log(1 + 2)
            break
        case 1 + 3:
            console.log(1 + 3)
            break
        default:
            console.log(default)
    }
}

demo() // 1 + 2
function demo (a, b) {
          
   
    switch (a) {
          
   
        case b + 1:
            console.log(b + 1)
            break
        case b + 2:
            console.log(b + 2)
            break
        case b + 3:
            console.log(b + 3)
            break
        default:
            console.log(default)
    }
}

demo(3, 1) // b + 2
demo(4, 1) // b + 3
demo(4, 2) // b + 2
demo(4, 4) // default

7. 表达式中的严格相等

function demo () {
          
   
    let a = hello
    let b = 10

    switch (true) {
          
   
        case (a || b == 10):
            console.log(1)
            break
        default:
            console.log(default)
    }
}

// a || b == 10 的值为 hello,和 true 不严格相等
demo() // default
function demo () {
          
   
    let a = hello
    let b = 10

    switch (true) {
          
   
        case !!(a || b == 10):
            console.log(1)
            break
        default:
            console.log(default)
    }
}

demo() // 1
经验分享 程序员 微信小程序 职场和发展