首頁 >web前端 >js教程 >JavaScript的變數作用域解析(詳解)

JavaScript的變數作用域解析(詳解)

青灯夜游
青灯夜游原創
2018-09-13 17:50:421135瀏覽

本章帶給大家JavaScript的變數作用域解析(詳解),讓大家可以了解關於JavaScrip作用域的一些小知識。有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

什麼是JavaScript作用域?

在JavaScript中,作用域是可存取變量,對象,函數的集合。

作用域在函數內可以修改。

JavaScript局部作用域

變數在函數內聲明,變數為局部變數(局部作用域)

#局部變數:只能在函數內部存取。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <button onclick="myFunction(1,2)">试一试</button>
    <p id="demo"></p>
</body>
<script type="text/javascript">
    function name() {
        //在此处声明一个变量
        var a = 10;
        //函数内可以调用 a
    }
    //此处(函数外)不能调用变量 a  
    //因为局部变量只作用于函数内,所以不同的函数可以使用相同名称的变量名  
    //局部变量在函数开始执行时创建,函数执行完毕后,变量会自动销毁
</script>
</html>

JavaScript全域變數

變數在函數外定義,即為全域變數。

全域變數有全域作用域,網頁中所有腳本和函數都可使用。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <button onclick="myFunction(1,2)">试一试</button>
    <p id="demo"></p>
</body>
<script type="text/javascript">
    /* 在此处声明一个全局变量 */
    var a = 10;
    function name() {
        //函数内可以调用 a
    }
    //此处也能调用变量 a
</script>
</html>

如果變數在函數內沒有宣告(沒有使用var關鍵字宣告)改變量為全域變數。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <button onclick="myFunction(1,2)">试一试</button>
    <p id="demo"></p>
</body>
<script type="text/javascript">
    
    function name() {
        /* 在此处声明一个变量 */
          a = 10;
     /* a没有使用var关键字声明,则默认为全局变量 */

    }
    
</script>
</html>

JavaScript變數生命週期

#變數的生命週期在它的宣告時初始化。局部變數在函數執行完畢後銷毀。全域變數在頁面關閉後銷毀。

函數參數

函數參數只在函數內作用,是局部變數。

HTML中的全域 變數

在HTML中,全域變數是window對象,所有資料變數都屬於window物件。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
    <button onclick="myFunction(1,2)">试一试</button>
    <p id="demo"></p>
</body>
<script type="text/javascript">
    function name() {
         a = 10;
    }
    //此处可使用window.a调用变量 a
</script>
</html>

全域變數或函數可以覆寫window物件的變數或函數。局部變數包括window對象,可以覆寫全域變數和函數。

在es6中提供了let關鍵字和const關鍵字

let的宣告方式與var相同,用let來取代var宣告變量,就可以把目前變數限制在程式碼區塊中。

使用const宣告的是常數,其值一旦被設定就無法被更改。

以上是JavaScript的變數作用域解析(詳解)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
上一篇:Ajax--表單映射下一篇:Ajax--表單映射