人人IT網

人人IT網

當前位置: 主頁 > JAVA編程 > JAVA >

jquery中的變量在全局與局部的不同

時間:2016-11-25 01:03來源:Internet 作者:Internet 點擊:
 今天在寫表單驗證的時候,發現一個關於變量作用域的問題。 很多人都在糾結局部變量與全局變量的問題,其實全局變量與局部變量就是差別在作用域與生命周期兩方面。 但是全局變量是魔鬼阿!過多的全局變量會造成變

 今天在寫表單驗證的時候,發現一個關於變量作用域的問題。

很多人都在糾結局部變量與全局變量的問題,其實全局變量與局部變量就是差別在作用域生命周期兩方面。

但是全局變量是魔鬼阿!過多的全局變量會造成變量覆蓋!(重名的話後聲明的會覆蓋先聲明的變量)

話不多說,咱們從一個例子來看!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>關於全局變量與局部變量</title>
</head>
<body>
    <form>
        <input type="password" id="psw1" />
        <input type="password" id="psw2" />
        <input type="button" id="send" value="驗證" />
    </form>
    <script type="text/javascript" src="../../resources/js/base/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="../../resources/js/page/test.js"></script>
</body>
</html>

 方法1:全局

var psw1 = $('#psw1').val();
var psw2 = $('#psw2').val();
$(function testpsw() { 
    $('#send').click(function() {
            if (psw1 == psw2) {
                alert('輸入正確');
            }
            else{
                alert('輸入錯誤');
            }
    });
})

 方法2:局部

$(function testpsw() { 
    
    $('#send').click(function() {
        var psw1 = $('#psw1').val();
        var psw2 = $('#psw2').val();
            if (psw1 == psw2) {
                alert('輸入正確');
            }
            else{
                alert('輸入錯誤');
            }
    });
})

 

 

我定義了2個input,我需要做的就是驗證這兩個input的value是否相同。相同就報OK,不同就報不Ok。

兩個的結果分別是

方法1:(無論我輸入什麼都是錯誤的)

 方法2:(兩個input的value一样時正確,不一样時錯誤)

 为什麼會這样呢?

 

之所以兩者會不一样,是因为作用域的問題。當我們沿用第一種做法的時候。我們在testpsw()中調用的就是全局變量。而第二種中我們調用的就是局部的變量。在function這個塊裏面,當我們觸發事件時,psw1psw2已經發生變化。然後垃圾收集。局部變量在函數執行完就就沒有存在的必要了。而全局變量的值等於先前已經獲取過了input的value,不會隨着我們的更改而改變。

簡而言之,就是全局定義的這個變量,已經有了固定的值不會隨着我們更改input的value改變。它會一直存在。

而局部變量,每次我們點擊驗證按鈕時,都會刷新兩個變量的值。每次獲取到我們輸入的新的值。因为它每次執行完點擊事件觸發後,這個變量就會銷毀。每次都會重新定義!

 

 

其中這還涉及到了關於全局變量與局部變量更多的內容,也設計到了垃圾回收機制!

剩下的內容會在隨後介紹!

 

 

 

 


From:ITEYE
頂一下
(0)
0%
踩一下
(0)
0%
------分隔線----------------------------
發表評論
請自覺遵守互聯網相關的政策法規,嚴禁發布色情、暴力、反動的言論。
評價:
表情:
驗證碼:點擊我更換圖片
欄目列表
推薦內容