JavaScript 中的“use strict”有什麼作用，其背後的原因是什麼？

在本教程中，我們將學習 JavaScript 中“use strict”的作用。

“use strict”是一個指令。它起源於 JavaScript 1.8.5。

use strict 指令規定 JavaScript 程式碼必須在嚴格模式下執行。嚴格模式指令不是語句，而是一個常量表達式。早期的 JavaScript 版本會忽略此表示式。

在嚴格模式下編寫程式碼時，我們不能使用未宣告的變數。除了 IE9 及以下版本，所有現代瀏覽器都支援此 JavaScript 指令。嚴格模式允許我們編寫更簡潔的程式碼，因為它會在程式中使用未宣告的變數時丟擲錯誤。

“use strict”是一個字串。要啟用嚴格模式，我們需要將此字串寫在指令碼的開頭。寫在開頭意味著它具有全域性作用域。

使用此 JavaScript 指令的優點是我們可以獲得安全的程式碼。早期的 JavaScript 版本會忽略錯誤的語法。例如，以前，錯誤鍵入的變數名會變成全域性變數。在嚴格模式下，它會為此變數丟擲錯誤，我們可以糾正它。JavaScript 函式在必要時也會使用嚴格模式。

使用者可以按照以下語法使用此方法。

語法

"use strict";
const a = "Strict Variable";

此處，語法中的第一行是指令，a 是遵循嚴格模式的變數。

示例 1

此程式在普通模式下有一個未宣告的變數 q，在嚴格模式下有一個未宣告的變數 p。在非嚴格模式下，我們可以顯示 q 的值。當用戶選擇嚴格模式時，我們無法顯示 p 的值；相反，它會在 catch 塊中丟擲錯誤。

<html>
<body>
   <h2>Using JavaScript strict mode</h2>
   <p id = "strictModInp"></p>
   <div id = "strictModOutWrap">
      <h3>Click this button to strict mode</h3>
      <button id = "strictModBtn" onclick = "getStrictMode();">Be Strict </button>
   </div>
   <p id = "strictModOut"></p>
   <script>
      var strictModEl;
      var strictModData;
      var strictModWrap = document.getElementById("strictModOutWrap");
      function getStrictMode()
      {
         "use strict";
         try
         {
            p = 10;
            strictModData = "Undeclared variable in strict mode - 
" + p;
         }
         catch(e)
         {
            strictModData = "Undeclared variable in strict mode - 
" + e;
         }
         strictModEl = document.getElementById("strictModOut");
         strictModEl.innerHTML = strictModData;

         // strictModWrap.style.display = "none";
      }
      function noStrict()
      {
         q = 10;
         strictModEl = document.getElementById("strictModInp");
         strictModData = "Undeclared variable in normal mode - 
" + q;
         strictModEl.innerHTML = strictModData;
      }
      noStrict();
   </script>
</body>
</html>

示例 2

此程式有四個嚴格模式會丟擲錯誤的情況。我們使用 try-catch 塊將此錯誤顯示給使用者。您可以參考程式下面內聯的每個情況註釋。

<html>
<body>
   <h2>Using the JavaScript strict mode restriction cases.</h2>
   <p id = "useStrictInp"></p>
   <div id = "useStrictOutWrap">
      <h5>Click this button to strict mode</h5>
      <button id = "useStrictBtn" onclick="strictUse();"> Strict </button>
   </div>
   <p id = "useStrictOut"> </p>
   <script>
      var useStrictEl;
      var useStrictData;
      var useStrictWrap = document.getElementById("useStrictOutWrap");
      var useStrictOut = document.getElementById("useStrictOut");
      var useStrictErr = "";
      function strictMode(option)
      {
         'use strict';
         try
         {
            switch(option)
            {
               case 1: //must declare a variable
               a = 'hi';
               
               break;
               case 2://must declare an object
               jsonObj = {name: 'Carla', age: 25};

               break;
               case 3://must not assign to the non-writable property
               let obj1 = {};
               Object.defineProperty(obj1, 'x', { value: 40, writable: false });
               obj1.x = 10;

               break;
               case 4://must not assign to a getter-only property
               let obj2 = { get x() { return 10; } };
               obj2.x = 5;
               break;
            }
         }  
         catch(e)
         {
            useStrictErr += e + "<br><br>";
         }
         useStrictOut.innerHTML = useStrictErr;
      }
      function strictUse()
      {
         strictMode(1);
         strictMode(2);
         strictMode(3);
         strictMode(4);
      }
   </script>
</body>
</html>

嚴格模式中的其他限制

我們不能賦值給變數“arguments”

'use strict';
let arguments = 'hello'; //error
let eval = 44;

我們不能使用八進位制值

'use strict';
let a = 010; //error

我們不能使用跳脫字元

'use strict';
let a = \010; //error

我們不能為不可擴充套件的物件分配新屬性

'use strict';
let obj = {};
Object.preventExtensions(obj);
obj.newKey = 'test'; //error

我們不能使用重複的引數

"use strict";
function hello(p1, p1)
{
   console.log('hello')
}; //error
hello();

我們不能刪除物件

'use strict';
let person = {name: 'Egan'};
delete person; //error

我們不能使用未宣告的變數

"use strict";
var x = 1; //valid
y = 1;//invalid

我們不能使用關鍵字

"use strict";
var for = 1; //error
var if = 1;

我們不能賦值給只讀物件

"use strict";
var arr = [10,20,30];
arr.length = 10;

我們不能使用“with”

"use strict";
with (Math)
{
   x = abs(200.234, 2); //error
};

我們不能使用“eval”

"use strict";
eval("var x = 1");

函式內的嚴格模式

x = 1; //valid
function sum(val1, val2)
{
   "use strict";
   result = val1 + val2;//error
   return result;
}

我們不能刪除原型

"use strict";
delete Object.prototype;

我們不能刪除未限定的識別符號。

"use strict";
function f(a, b)
{
   delete(a); //error
}

我們不能刪除未限定的識別符號、函式或物件

"use strict";
var x = 50;
var obj =
{
   'name': 'name'
};
   function f()
{
}
delete x; //error
delete obj; //error
delete f; //error,

要在某些控制檯中使用嚴格模式，請使用此程式碼塊

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

在本教程中，我們學習了 JavaScript 中的嚴格模式，它限制了未宣告變數的使用。使用嚴格模式，我們可以確保程式碼安全和簡潔。嚴格模式很有用，因為它可以防止錯誤。

更新於：2022年10月31日

188 次瀏覽

啟動您的職業生涯

透過完成課程獲得認證

開始
廣告