JavaScript 嚴格模式
JavaScript 嚴格模式(strict mode)即在嚴格的條件下運行。
使用 "use strict" 指令
"use strict" 指令在 JavaScript 1.8.5 (ECMAScript5) 中新增。
它不是一條語句,但是是一個字面量表達式,在 JavaScript 舊版本中會被忽略。
"use strict" 的目的是指定代碼在嚴格條件下執(zhí)行。
嚴格模式下你不能使用未聲明的變量。
![]() | 支持嚴格模式的瀏覽器: Internet Explorer 10 +、 Firefox 4+ Chrome 13+、 Safari 5.1+、 Opera 12+。 |
---|
嚴格模式聲明
嚴格模式通過在腳本或函數(shù)的頭部添加 "use strict"; 表達式來聲明。
實例中我們可以在瀏覽器按下 F12 (或點擊"工具>更多工具>開發(fā)者工具") 開啟調(diào)試模式,查看報錯信息。
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許使用未定義的變量。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; x = 3.14; // 報錯 (x 未定義) </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h2>全局 "use strict" 聲明.</h2> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; myFunction(); function myFunction() { y = 3.14; // 報錯 (y 未定義) } </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
在函數(shù)內(nèi)部聲明是局部作用域 (只在函數(shù)內(nèi)使用嚴格模式):
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <p>在函數(shù)內(nèi)使用 "use strict" 只在函數(shù)內(nèi)報錯。 </p> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> x = 3.14; // 不報錯 myFunction(); function myFunction() { "use strict"; y = 3.14; // 報錯 (y 未定義) } </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
為什么使用嚴格模式:
消除Javascript語法的一些不合理、不嚴謹之處,減少一些怪異行為;
消除代碼運行的一些不安全之處,保證代碼運行的安全;
提高編譯器效率,增加運行速度;
為未來新版本的Javascript做好鋪墊。
"嚴格模式"體現(xiàn)了Javascript更合理、更安全、更嚴謹?shù)陌l(fā)展方向,包括IE 10在內(nèi)的主流瀏覽器,都已經(jīng)支持它,許多大項目已經(jīng)開始全面擁抱它。
另一方面,同樣的代碼,在"嚴格模式"中,可能會有不一樣的運行結(jié)果;一些在"正常模式"下可以運行的語句,在"嚴格模式"下將不能運行。掌握這些內(nèi)容,有助于更細致深入地理解Javascript,讓你變成一個更好的程序員。
嚴格模式的限制
不允許使用未聲明的變量:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許使用未定義的變量。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; x = 3.14; // 報錯 (x 未定義) </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
![]() | 對象也是一個變量。 |
---|
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許使用為定義的對象。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; x = {p1:10, p2:20}; // 報錯 (x 未定義) </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許刪除變量或?qū)ο蟆?/p>
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許刪除變量或?qū)ο蟆?lt;/h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var x = 3.14; delete x; </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許刪除函數(shù)。
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許刪除函數(shù)。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; function x(p1, p2) {}; delete x; </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許變量重名:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許變量重名。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; function x(p1, p1) {}; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許使用八進制:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許使用八進制。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var x = 010; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許使用轉(zhuǎn)義字符:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許使用轉(zhuǎn)義字符。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var x = \010; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許對只讀屬性賦值:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許對只讀屬性賦值。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var obj = {}; Object.defineProperty(obj, "x", {value:0, writable:false}); obj.x = 3.14; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許對一個使用getter方法讀取的屬性進行賦值
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許對一個使用getter方法讀取的屬性進行賦值。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var obj = {get x() {return 0} }; obj.x = 3.14; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許刪除一個不允許刪除的屬性:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許刪除一個不允許刪除的屬性值。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; delete Object.prototype; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
變量名不能使用 "eval" 字符串:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>變量名不能使用 "eval" 字符串。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var eval = 3.14; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
變量名不能使用 "arguments" 字符串:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>變量名不能使用 "arguments" 字符串。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var arguments = 3.14; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
不允許使用以下這種語句:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>不允許使用以下這種語句。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; with (Math){x = cos(2)}; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
由于一些安全原因,在作用域 eval() 創(chuàng)建的變量不能被調(diào)用:
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>由于一些安全原因,在作用域 eval() 創(chuàng)建的變量不能被調(diào)用。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; eval ("var x = 2"); alert (x); // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
禁止this關(guān)鍵字指向全局對象。
function f(){ return !this; } // 返回false,因為"this"指向全局對象,"!this"就是false function f(){ "use strict"; return !this; } // 返回true,因為嚴格模式下,this的值為undefined,所以"!this"為true。
因此,使用構(gòu)造函數(shù)時,如果忘了加new,this不再指向全局對象,而是報錯。
function f(){ "use strict"; this.a = 1; }; f();// 報錯,this未定義
保留關(guān)鍵字
為了向?qū)鞪avascript的新版本過渡,嚴格模式新增了一些保留保留關(guān)鍵字:
implements
interface
let
package
private
protected
public
static
yield
實例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文網(wǎng)(php.cn)</title> </head> <body> <h1>使用 "use strict":</h1> <h3>嚴格模式不允許使用保留關(guān)鍵字。</h3> <p>瀏覽器按下 F12 開啟調(diào)試模式,查看報錯信息。</p> <script> "use strict"; var public = 1500; // 報錯 </script> </body> </html>
運行實例 ?
點擊 "運行實例" 按鈕查看在線實例
![]() | "use strict" 指令只運行出現(xiàn)在腳本或函數(shù)的開頭。 |
---|