JS直接if參數的用法&JS中!和!!區別


   經常在JS中見一些代碼直接if(參數),然后參數調用的時候是將元素自己傳下去。例如下面代碼:

    <body>
    <input type="text" name="" id="" value="111222" onclick="test1(this)" />
    <input type="text" name="" id="" value="111222" onclick="test1()" />
    </body>
    <script>
        function test1(obj){
            if(obj){
                alert($(obj).val());
            }else{
                alert("has not obj");
            }
        }
    </script>    

 

  我們分別點擊上面的兩個輸入框顯示如下:

 

解釋:實際上相當於java中的重載,如果傳參數了就走if(obj),不傳參數就走else。

  也就是如果參數不為空或者nul或者undefinedl或者“”空串則if(obj)成立。

 

進一步的測試:

    <script>
        function test1(obj){
            if(obj){
                alert("has obj");
            }else{
                alert("has not obj");
            }
        }
        test1();//has not obj
        test1(null);//has not obj
        test1(undefined);//has not obj
        test1("");//has not obj
        test1(" ");//has obj
        test1("1");//has obj
    </script>    

  總結:不傳參數,傳的參數為null,傳的參數為undefined,傳的參數為""的時候if(obj)不成立,反之則成立。

 

補充:直接if(param)可以用於判斷參數,也相當於if(param != null),相反if(!param)就相當於if(param == null),例如:

    <script>
        function test(a, b) {
            if (!a || !b) {
                alert("參數沒傳");
            } else {
                alert("a與b不等於null")
            }
        }
        test();
        test("1", "2");
    </script>

 結果:

  

 

補充:實際上是用!與上對象來求得一個布爾值,js中!和!!的區別及用法

js中!的用法是比較靈活的,它除了做邏輯運算常常會用!做類型判斷,可以用!與上對象來求得一個布爾值,
1、!可將變量轉換成boolean類型,null、undefined和空字符串、數字0 通過!轉為boolean值0為true,其余為false。

!null=true
!undefined=true
!''=true
!100=false
!'abc'=false
!0=true

  特別注意0的情況。

2、!!  常常用來做類型判斷,在第一步!(變量)之后再做邏輯取反運算,在js中新手常常會寫這樣臃腫的代碼:
判斷變量a為非空,未定義或者非空串才能執行方法體的內容

var a;
if(a!=null&&typeof(a)!=undefined&&a!=''){
    //a有內容才執行的代碼  
}

實際上只需要一個表達式:

if(!a){
    //a有內容才執行的代碼...  
}

 

比如:如下一個驗證值必填的函數,有值的話返回true,沒值的話返回字符串消息"required." 

        function required(val) {
            return !!val || 'required.';
        }

        console.log(required());
        console.log(required(''));
        console.log(required(0));
        console.log(required("xxxxx"));

結果:

(1)required('')解釋: !'' 返回的是true, 再進行一次!之后是false。 所以會返回后面的字符串。

(2)required("xxxxx")解釋: !"xxxxx" 返回的是false,再進行一次 ! 返回的是true。因此不與后面的字符串進行邏輯或運算,直接返回true。

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM