為了轉生而點技能-JavaScript，day15(Strict mode摘要整理

javascript strict mode

openthedoor2004 2021-12-06 08:02:47 ‧ 823 瀏覽

分享至

嚴格模式(Strict mode)：

瀏覽器：在Strict mode跟沒有Strict mode下的瀏覽器會有不同的執行結果。
如何進入Strict mode：

在scripts中必須在第一行打use strict才會整篇都生效。

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        'use strict'

函式(function)中第一行登打use strict進入Strict mode，但是Strict mode的效果只侷限在該函式。

        function foo1() {
            console.log(this);
        }
        foo1();                      //指向window物件

        function foo() {
            'use strict';           //進入Strict mode
            console.log(this);
        }
        foo();                      //undefined

特徵：某些條件下會報錯

* 直接定義未宣告變數

    <script>
        'use strict'
        myName = 'Emma';   //Uncaught ReferenceError

* 不允許對變數及函式使用delete，會出現Uncaught SyntaxError。

    <script>
        'use strict'
        var myName = 'Emma';
        delete myName;   //Uncaught SyntaxError

    <script>
        'use strict'
        function sum(a, b) {
            return a + b;
        }
        delete sum;   //Uncaught SyntaxError

* 不能接受重複的參數名稱

    <script>
        'use strict'
        function square(a, a) {      // Uncaught SyntaxError
            return a * a;
        }
        console.log(square(2, 2));

* silently fail失效：在非Strict mode下，有些錯誤不會被執行但是也不會報錯中斷，但是在Strict mode下會報錯中斷。

給不可寫入的屬性賦值：
Object.defineProperty：會對一個物件定義、或是修改現有的屬性。執行後會回傳定義完的物件。

    <script>
        'use strict'
        var obj1 = {};
        Object.defineProperty(obj1, "x", { value: 42, writable: false });
        obj1.x = 9            //Uncaught TypeError

給只提供讀取的屬性賦值：

    <script>
        'use strict';
        var obj2 = { get x() { return 17; } };
        obj2.x = 5;        //Uncaught TypeError

給不能擴展的屬性賦值：
Object.preventExtensions：避免物件被新增新的屬性。

    <script>
        'use strict';
        var fixed = {};
        Object.preventExtensions(fixed);
        fixed.newProp = "ohai"        //Uncaught TypeError

* 不能接受Octal Numbers(八進位)

    <script>
        'use strict';
        var x = 010;                  // Uncaught SyntaxError
        console.log(parseInt(x));

eval失效

在Strict mode下，eval無法再變更原變數。

  <script>
        var name = 'Tom';
        var name2 = eval("var name = 'Mary';");
        console.log(name);          //Mary
  
   <script>
        'use strict'
        var name = 'Tom';
        var name2 = eval("var name = 'Mary';");
        console.log(name);          //Tom

在Strict mode下，eval無法被當成變數名稱、function names, 或是 function parameter names。

<script>
        'use strict';
        var eval = 10;
        console.log(eval);     //Uncaught SyntaxError

在Strict mode的this：一般函式呼叫(Simple Call)的 this 值都是 undefined。

參考文章：

JavaScript Strict Mode：https://www.tutorialrepublic.com/javascript-tutorial/javascript-strict-mode.php
MDN：Strict mode：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Strict_mode