04.JavaScript逻辑运算

  • 计算运算符

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>运算符</title>
        <script>
            var num1 = 1;//赋值运算符,将右边的值赋给左边变量,则变量拥有值
            var num2 = num1 + 1;//加法运算
            /*
             * 常用算数运算符
             * + : 加 例:1+2=3
             * - : 减 例:2-1=1
             * * : 乘 例:2*3=6
             * / : 除 例:6/2=3
             * % : 求余 例:5%2=1;
             * ++ : 自增 例:a++等于a+1;++a
             * -- : 自减 例:a--等于a-1;--a
             * a++与++a的区别:前者先运算后+1;后者先+1后运算
             * 
             * 常用赋值运算符
             * += : a+=b等同a=a+b;
             * -= *= /= %=类同
             */
            var str1 = "Hello";//"Hello"与"Hello "为不同字符串
            var str2 = "World";//"World"与" World"为不同字符串
            var str3 = str1+" "+str2;//字符串的相加为字符串的拼接
            var str4 = str1 + num2;//字符串与数字的相加,结果为字符串,相当于把数字转换为字符串
        </script>
    </head>
    <body>
        <h2>结果查看</h2>
        <p>
            <script>
                document.write("num1 = "+num1+"<br />"+"num2 = "+num2+"<br />");
                document.write("str3 = "+str3+"<br />"+"str4 = "+str4);
            </script>
        </p>
    </body>
</html> 
运行结果

  • 比较运算符

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>运算符</title>
    </head>
    <body>
        <h1>结果:</h1>
        <script>
            /*
             * 比较运算符,返回布尔值True或者false,比较结果正确True,反正false
             * == : 比较数值相等
             * === : 全等(数值和类型)
             * != : 不等于
             * > : 大于
             * < : 小于
             * >= : 大于等于
             * <= : 小于等于
             */
            var num1 = 7;//赋值运算
            
            if(num1 == 7){//比较变量值和数值
                document.write("True");//比较结果,正确是返回
            }else{
                document.write("False");//比较结果错误是返回
            }
            
            document.write("<br />");
            
            if(num1 === "7"){//数值和类型均符合才为真
                document.write("True");
            }else{
                document.write("False");
            }
            
            /*
             * 逻辑运算符,返回True或false True:1 false:0
             * || : 或(一1则1)
             * && : 与(一0则0)
             * ! : 非(!1则0,!0则1)
             */
            document.write("<br />"+"逻辑与结果:"+(true||false));
            document.write("<br />"+"逻辑或结果:"+(true&&false));
            document.write("<br />"+"逻辑非结果:"+(!0));
            
            /*
             * 条件运算符
             * boole?aa:bb 如果ture则aa否则bb
             */
            document.write("<br />"+"条件运算结果:"+(1>2 ? true : false));
            
            /*
             * 
             */
        </script>
    </body>
</html>
运行结果

  • Boolean对象

  1. Boolean对象可以检查对象的逻辑结果(true/false)
  2. Boolean对象可以将非逻辑值转换为逻辑值
  3. 只有对象 无初始值,0,-0,null,"",false,undefined,NaN 返回false,其他返回true
  4. 注意:字符串'0',"false"值是true,只有空字符串为false.
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style type="text/css">
            .code{
                color: gray;
                border: 1px solid gainsboro;
                font-size: 15px;
            }
            pre{
                margin: 1em 0em 1em -19em;
                font-family: "楷体";
            }
            .result{
                color: gray;
                background-color: ghostwhite;
                font-size: 16px;
                padding: 0.5em 1em;
            }
            h3{
                color: red;
            }
            .result span:first-child{
                display: block;
                float: left;
                width: 10em;
                color: black;
            }
        </style>
        <script type="text/javascript">
            function objDisplay(eleId,obj){
                if(typeof(eleId)!="string" || typeof(obj)!="object"){
                    alert("Function objDisplay() need the first parameter string and second object !")
                }else{
                    var ele = document.getElementById(eleId);
                
                    if(!ele || !obj){
                        alert("Please check the parameter !")
                    }else{
                        for(i in obj){
                            var div = document.createElement("div");
                            
                            for(var j=0;j<2;j++){
                                var span = document.createElement("span");
                                if(j==0) span.innerHTML = i+" : ";
                                else span.innerHTML = obj[i];
                                div.appendChild(span);
                            }
                        ele.appendChild(div);
                        }
                    }
                }               
            }
        </script>
    </head>
    <body>
        <ul>
            <li>
                <h3>Boolean对象</h3>
                <h4>代码:</h4>
                <div class="code">
                    <pre>
                    //新建boolean对象
                    var booEty = new Boolean();
                    //布尔值
                    var booDict={
                        "Boolean()":new Boolean(),
                        "Boolean(0)":new Boolean(0),
                        "Boolean(-0)":new Boolean(-0),
                        "Boolean(null)":new Boolean(null),
                        "Boolean('')":new Boolean(''),
                        "Boolean(false)":new Boolean(false),
                        "Boolean(undefined)":new Boolean(undefined),
                        "Boolean(NaN)":new Boolean(NaN),
                        "Boolean('0')":new Boolean('0'),
                        "Boolean(1)":new Boolean(1),
                        "Boolean('false')":new Boolean('false')
                    }
                    
                    objDisplay("dict01",booDict);
                    </pre>
                </div>              
                <h4>结果:</h4>
                <div id="dict01" class="result"></div>
                <hr />
                <script>
                    //新建boolean对象
                    var booEty = new Boolean();
                    //布尔值
                    var booDict={
                        "Boolean()":new Boolean(),
                        "Boolean(0)":new Boolean(0),
                        "Boolean(-0)":new Boolean(-0),
                        "Boolean(null)":new Boolean(null),
                        "Boolean('')":new Boolean(''),
                        "Boolean(false)":new Boolean(false),
                        "Boolean(undefined)":new Boolean(undefined),
                        "Boolean(NaN)":new Boolean(NaN),
                        "Boolean('0')":new Boolean('0'),
                        "Boolean(1)":new Boolean(1),
                        "Boolean('false')":new Boolean('false')
                    }
                    
                    objDisplay("dict01",booDict);
                </script>
            </li>               
        </ul>       
    </body>
</html>
image.png

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容