js中连写两个？：三元运算符语法解释

72 阅读 0 评论 48 点赞

我是靠谱客的博主难过紫菜，最近开发中收集的这篇文章主要介绍js中连写两个？：三元运算符语法解释，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

在angular 源码中有连写两个三元运算符的代码：

var hash = isString(hash) ? hash : isNumber(hash) ? hash.toString() :$location.hash;

上述代码等价于：

if(isString(hash)){
    return hash;
}else{
    if(isNumber(hash)){
        return hash.toString();
    }else{
        return $location.hash;
    }
}
验证代码如下所示：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>连写两个三元运算符的执行顺序</title>
 6 </head>
 7 <body>
 8 <!--下面这两个script 脚本中的自执行匿名函数证明了连写连个三元运算符的执行顺序是从左到右顺序执行。-->
 9 <script>
10 
11     //        hash = isString(hash) ? hash : isNumber(hash) ? hash.toString() : $location.hash();
12     (function (hash) {
13         isString=function (str) {
14             return  toString.call(str)=='[object String]'?true:false;
15         }
16         isNumber=function (number) {
17             return toString.call(number)=='[object Number]'?true:false;
18         }
19 
20         var hash = isString(hash) ? hash : isNumber(hash) ? hash.toString() :"人生";
21         alert(hash);
22     })("ouyangfeng");
23 </script>
24 <script>
25     (function (hash) {
26         isString=function (str) {
27             return  toString.call(str)=='[object String]'?true:false;
28         }
29         isNumber=function (number) {
30             return toString.call(number)=='[object Number]'?true:false;
31         }
32         function getHash() {
33             if(isString(hash)){
34                 return hash;
35             }else{
36                 if(isNumber(hash)){
37                     return hash.toString();
38                 }else{
39                     return "人生";
40                 }
41             }
42         }
43         var hash=getHash(hash);
44         alert(hash);
45     })("123");
46 </script>
47 <style>
48 </body>
49 </html>