JavaScript 嚴格模式

2023-03-20 15:50 更新

除了正常的運行模式，JavaScript 還有第二種運行模式：嚴格模式（strict mode）。顧名思義，這種模式采用更加嚴格的 JavaScript 語法。

同樣的代碼，在正常模式和嚴格模式中，可能會有不一樣的運行結果。一些在正常模式下可以運行的語句，在嚴格模式下將不能運行。

設計目的

早期的 JavaScript 語言有很多設計不合理的地方，但是為了兼容以前的代碼，又不能改變老的語法，只能不斷添加新的語法，引導程序員使用新語法。

嚴格模式是從 ES5 進入標準的，主要目的有以下幾個。

  • 明確禁止一些不合理、不嚴謹?shù)恼Z法，減少 JavaScript 語言的一些怪異行為。
  • 增加更多報錯的場合，消除代碼運行的一些不安全之處，保證代碼運行的安全。
  • 提高編譯器效率，增加運行速度。
  • 為未來新版本的 JavaScript 語法做好鋪墊。

總之，嚴格模式體現(xiàn)了 JavaScript 更合理、更安全、更嚴謹?shù)陌l(fā)展方向。

啟用方法

進入嚴格模式的標志，是一行字符串use strict。

'use strict';

老版本的引擎會把它當作一行普通字符串，加以忽略。新版本的引擎就會進入嚴格模式。

嚴格模式可以用于整個腳本，也可以只用于單個函數(shù)。

（1） 整個腳本文件

use strict放在腳本文件的第一行，整個腳本都將以嚴格模式運行。如果這行語句不在第一行就無效，整個腳本會以正常模式運行。(嚴格地說，只要前面不是產生實際運行結果的語句，use strict可以不在第一行，比如直接跟在一個空的分號后面，或者跟在注釋后面。)

<script>
  'use strict';
  console.log('這是嚴格模式');
</script>

<script>
  console.log('這是正常模式');
</script>

上面代碼中，一個網(wǎng)頁文件依次有兩段 JavaScript 代碼。前一個<script>標簽是嚴格模式，后一個不是。

如果use strict寫成下面這樣，則不起作用，嚴格模式必須從代碼一開始就生效。

<script>
  console.log('這是正常模式');
  'use strict';
</script>

（2）單個函數(shù)

use strict放在函數(shù)體的第一行，則整個函數(shù)以嚴格模式運行。

function strict() {
  'use strict';
  return '這是嚴格模式';
}

function strict2() {
  'use strict';
  function f() {
    return '這也是嚴格模式';
  }
  return f();
}

function notStrict() {
  return '這是正常模式';
}

有時，需要把不同的腳本合并在一個文件里面。如果一個腳本是嚴格模式，另一個腳本不是，它們的合并就可能出錯。嚴格模式的腳本在前，則合并后的腳本都是嚴格模式；如果正常模式的腳本在前，則合并后的腳本都是正常模式。這兩種情況下，合并后的結果都是不正確的。這時可以考慮把整個腳本文件放在一個立即執(zhí)行的匿名函數(shù)之中。

(function () {
  'use strict';
  // some code here
})();

顯式報錯

嚴格模式使得 JavaScript 的語法變得更嚴格，更多的操作會顯式報錯。其中有些操作，在正常模式下只會默默地失敗，不會報錯。

只讀屬性不可寫

嚴格模式下，設置字符串的length屬性，會報錯。

'use strict';
'abc'.length = 5;
// TypeError: Cannot assign to read only property 'length' of string 'abc'

上面代碼報錯，因為length是只讀屬性，嚴格模式下不可寫。正常模式下，改變length屬性是無效的，但不會報錯。

嚴格模式下，對只讀屬性賦值，或者刪除不可配置（non-configurable）屬性都會報錯。

// 對只讀屬性賦值會報錯
'use strict';
Object.defineProperty({}, 'a', {
  value: 37,
  writable: false
});
obj.a = 123;
// TypeError: Cannot assign to read only property 'a' of object #<Object>

// 刪除不可配置的屬性會報錯
'use strict';
var obj = Object.defineProperty({}, 'p', {
  value: 1,
  configurable: false
});
delete obj.p
// TypeError: Cannot delete property 'p' of #<Object>

只設置了取值器的屬性不可寫

嚴格模式下，對一個只有取值器（getter）、沒有存值器（setter）的屬性賦值，會報錯。

'use strict';
var obj = {
  get v() { return 1; }
};
obj.v = 2;
// Uncaught TypeError: Cannot set property v of #<Object> which has only a getter

上面代碼中，obj.v只有取值器，沒有存值器，對它進行賦值就會報錯。

禁止擴展的對象不可擴展

嚴格模式下，對禁止擴展的對象添加新屬性，會報錯。

'use strict';
var obj = {};
Object.preventExtensions(obj);
obj.v = 1;
// Uncaught TypeError: Cannot add property v, object is not extensible

上面代碼中，obj對象禁止擴展，添加屬性就會報錯。

eval、arguments 不可用作標識名

嚴格模式下，使用eval或者arguments作為標識名，將會報錯。下面的語句都會報錯。

'use strict';
var eval = 17;
var arguments = 17;
var obj = { set p(arguments) { } };
try { } catch (arguments) { }
function x(eval) { }
function arguments() { }
var y = function eval() { };
var f = new Function('arguments', "'use strict'; return 17;");
// SyntaxError: Unexpected eval or arguments in strict mode

函數(shù)不能有重名的參數(shù)

正常模式下，如果函數(shù)有多個重名的參數(shù)，可以用arguments[i]讀取。嚴格模式下，這屬于語法錯誤。

function f(a, a, b) {
  'use strict';
  return a + b;
}
// Uncaught SyntaxError: Duplicate parameter name not allowed in this context

禁止八進制的前綴0表示法

正常模式下，整數(shù)的第一位如果是0，表示這是八進制數(shù)，比如0100等于十進制的64。嚴格模式禁止這種表示法，整數(shù)第一位為0，將報錯。

'use strict';
var n = 0100;
// Uncaught SyntaxError: Octal literals are not allowed in strict mode.

增強的安全措施

嚴格模式增強了安全保護，從語法上防止了一些不小心會出現(xiàn)的錯誤。

全局變量顯式聲明

正常模式中，如果一個變量沒有聲明就賦值，默認是全局變量。嚴格模式禁止這種用法，全局變量必須顯式聲明。

'use strict';

v = 1; // 報錯，v未聲明

for (i = 0; i < 2; i++) { // 報錯，i 未聲明
  // ...
}

function f() {
  x = 123;
}
f() // 報錯，未聲明就創(chuàng)建一個全局變量

因此，嚴格模式下，變量都必須先聲明，然后再使用。

禁止 this 關鍵字指向全局對象

正常模式下，函數(shù)內部的this可能會指向全局對象，嚴格模式禁止這種用法，避免無意間創(chuàng)造全局變量。

// 正常模式
function f() {
  console.log(this === window);
}
f() // true

// 嚴格模式
function f() {
  'use strict';
  console.log(this === undefined);
}
f() // true

上面代碼中，嚴格模式的函數(shù)體內部this是undefined。

這種限制對于構造函數(shù)尤其有用。使用構造函數(shù)時，有時忘了加new，這時this不再指向全局對象，而是報錯。

function f() {
  'use strict';
  this.a = 1;
};

f();// 報錯，this 未定義

嚴格模式下，函數(shù)直接調用時（不使用new調用），函數(shù)內部的this表示undefined（未定義），因此可以用call、apply和bind方法，將任意值綁定在this上面。正常模式下，this指向全局對象，如果綁定的值是非對象，將被自動轉為對象再綁定上去，而null和undefined這兩個無法轉成對象的值，將被忽略。

// 正常模式
function fun() {
  return this;
}

fun() // window
fun.call(2) // Number {2}
fun.call(true) // Boolean {true}
fun.call(null) // window
fun.call(undefined) // window

// 嚴格模式
'use strict';
function fun() {
  return this;
}

fun() //undefined
fun.call(2) // 2
fun.call(true) // true
fun.call(null) // null
fun.call(undefined) // undefined

上面代碼中，可以把任意類型的值，綁定在this上面。

禁止使用 fn.callee、fn.caller

函數(shù)內部不得使用fn.caller、fn.arguments，否則會報錯。這意味著不能在函數(shù)內部得到調用棧了。

function f1() {
  'use strict';
  f1.caller;    // 報錯
  f1.arguments; // 報錯
}

f1();

禁止使用 arguments.callee、arguments.caller

arguments.callee和arguments.caller是兩個歷史遺留的變量，從來沒有標準化過，現(xiàn)在已經取消了。正常模式下調用它們沒有什么作用，但是不會報錯。嚴格模式明確規(guī)定，函數(shù)內部使用arguments.callee、arguments.caller將會報錯。

'use strict';
var f = function () {
  return arguments.callee;
};

f(); // 報錯

禁止刪除變量

嚴格模式下無法刪除變量，如果使用delete命令刪除一個變量，會報錯。只有對象的屬性，且屬性的描述對象的configurable屬性設置為true，才能被delete命令刪除。

'use strict';
var x;
delete x; // 語法錯誤

var obj = Object.create(null, {
  x: {
    value: 1,
    configurable: true
  }
});
delete obj.x; // 刪除成功

靜態(tài)綁定

JavaScript 語言的一個特點，就是允許“動態(tài)綁定”，即某些屬性和方法到底屬于哪一個對象，不是在編譯時確定的，而是在運行時（runtime）確定的。

嚴格模式對動態(tài)綁定做了一些限制。某些情況下，只允許靜態(tài)綁定。也就是說，屬性和方法到底歸屬哪個對象，必須在編譯階段就確定。這樣做有利于編譯效率的提高，也使得代碼更容易閱讀，更少出現(xiàn)意外。

具體來說，涉及以下幾個方面。

禁止使用 with 語句

嚴格模式下，使用with語句將報錯。因為with語句無法在編譯時就確定，某個屬性到底歸屬哪個對象，從而影響了編譯效果。

'use strict';
var v  = 1;
var obj = {};

with (obj) {
  v = 2;
}
// Uncaught SyntaxError: Strict mode code may not include a with statement

創(chuàng)設 eval 作用域

正常模式下，JavaScript 語言有兩種變量作用域（scope）：全局作用域和函數(shù)作用域。嚴格模式創(chuàng)設了第三種作用域：eval作用域。

正常模式下，eval語句的作用域，取決于它處于全局作用域，還是函數(shù)作用域。嚴格模式下，eval語句本身就是一個作用域，不再能夠在其所運行的作用域創(chuàng)設新的變量了，也就是說，eval所生成的變量只能用于eval內部。

(function () {
  'use strict';
  var x = 2;
  console.log(eval('var x = 5; x')) // 5
  console.log(x) // 2
})()

上面代碼中，由于eval語句內部是一個獨立作用域，所以內部的變量x不會泄露到外部。

注意，如果希望eval語句也使用嚴格模式，有兩種方式。

// 方式一
function f1(str){
  'use strict';
  return eval(str);
}
f1('undeclared_variable = 1'); // 報錯

// 方式二
function f2(str){
  return eval(str);
}
f2('"use strict";undeclared_variable = 1')  // 報錯

上面兩種寫法，eval內部使用的都是嚴格模式。

arguments 不再追蹤參數(shù)的變化

變量arguments代表函數(shù)的參數(shù)。嚴格模式下，函數(shù)內部改變參數(shù)與arguments的聯(lián)系被切斷了，兩者不再存在聯(lián)動關系。

function f(a) {
  a = 2;
  return [a, arguments[0]];
}
f(1); // 正常模式為[2, 2]

function f(a) {
  'use strict';
  a = 2;
  return [a, arguments[0]];
}
f(1); // 嚴格模式為[2, 1]

上面代碼中，改變函數(shù)的參數(shù)，不會反應到arguments對象上來。

向下一個版本的 JavaScript 過渡

JavaScript 語言的下一個版本是 ECMAScript 6，為了平穩(wěn)過渡，嚴格模式引入了一些 ES6 語法。

非函數(shù)代碼塊不得聲明函數(shù)

ES6 會引入塊級作用域。為了與新版本接軌，ES5 的嚴格模式只允許在全局作用域或函數(shù)作用域聲明函數(shù)。也就是說，不允許在非函數(shù)的代碼塊內聲明函數(shù)。

'use strict';
if (true) {
  function f1() { } // 語法錯誤
}

for (var i = 0; i < 5; i++) {
  function f2() { } // 語法錯誤
}

上面代碼在if代碼塊和for代碼塊中聲明了函數(shù)，ES5 環(huán)境會報錯。

注意，如果是 ES6 環(huán)境，上面的代碼不會報錯，因為 ES6 允許在代碼塊之中聲明函數(shù)。

保留字

為了向將來 JavaScript 的新版本過渡，嚴格模式新增了一些保留字（implements、interface、let、package、private、protected、public、static、yield等）。使用這些詞作為變量名將會報錯。

function package(protected) { // 語法錯誤
  'use strict';
  var implements; // 語法錯誤
}

參考鏈接


以上內容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號