JS010. 三元运算符扩展运用（多层判断语句 / 多条表达式）

MDN - 三元运算符

语法

Condition ? exprIfTrue : exprIfFalse

用例：

function getFee(isMember) {
    return(isMember ? '$2.00' : '$10.00')
}

getFee(true)    // expected output: "$2.00"
getFee(false)   // expected output: "$10.00"
getFee(null)    // expected output: "$10.00"

多层判断语句：

// 颜色越深条件层级越深
typeof arg == 'number' ? (arg > 0 ? (arg > 100 ? i = 'Num huge!' : 'Num small!') : i = 'Num is minus.') : (typeof arg == 'string' ? i = 'Arg is a Str.' : i = 'Arg unknow.')

等价于

if (typeof arg == 'number') {
    if (arg > 0) {
        if (arg > 100) {
            i = 'Num huge!'
        } else {
            i = 'Num small!'
        }
    } else {
        i = 'Num is minus.'
    }
} else {
    if (typeof arg == 'string') {
        i = 'Arg is a Str.'
    } else {
        i = 'Arg unknow.'
    }
}

一行解决，就是可读性较差

多条执行语句

方法1：括号同上；方法2：匿名函数 + ES6箭头函数

// 方法1 括号同上
isShow? (isShow = false, btn = 'show') : (isShow = true, btn = 'hide')

// 方法2 匿名函数 + ES6箭头函数
isShow ? (() = > {
    isShow = false;
    btn = 'show';
})()
: (() => {
    isShow = true;
    btn = 'hide';
})();

括号不可省略。

- END -