本章帶給大家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中文網其他相關文章!