JavaScript Strict Mode

JavaScript Strict Mode is a feature in JavaScript that allows you to place your code in a more restricted and safer environment. When you enable strict mode, JavaScript code is executed in a stricter way and certain actions that were previously allowed are no longer permitted. This can help you catch coding mistakes and make your code more robust. Deprecated features might potentially produce problems in strict mode. Hence, stringent mode decreases defects while enhancing security and overall program speed.

It's important to note that enabling strict mode may cause some existing code to break, as it disallows certain behaviours that were previously allowed. For example, using undeclared variables will now result in an error instead of creating a new global variable. However, these changes can help you catch coding mistakes and write more robust code. Overall, enabling strict mode is a simple and powerful way to make your JavaScript code more secure and reliable.

Enabling Strict Mode

To enable strict mode in JavaScript, you can simply add the following statement at the beginning of your script. This statement can be added to the top of a script, a function, or a module.

You can also enable strict mode for a specific module by including the 'use strict'; statement at the beginning of the module file.

Example

<html>
<body>

<h1>Enable Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";
    num = 2023;
    console.log(num);  // Please Check Console
</script>

</body>
</html>

Preview

Example

<!DOCTYPE html>
<html>
<body>

<h1>Enable Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    str = "WebTutor";
    document.write(str);

    function Myfunction() {
        "use strict";
        num = 2023;
        console.log(num);
    }
    Myfunction();
</script>

</body>
</html>

Preview

General Restrictions in Strict Mode

Enabling strict mode in JavaScript imposes a number of restrictions on the behavior of your code, which can help catch common programming errors and make your code more robust. Some of the general restrictions that apply when strict mode is enabled include:

1. Undeclared Variables are Not Allowed

One of the key restrictions of strict mode in JavaScript is that undeclared variables are not allowed. In non-strict mode, if you attempt to use a variable that has not been declared with var, let, or const, JavaScript will create a new global variable with that name. This can lead to unexpected behavior and hard-to-find bugs in your code.

By explicitly declaring variables, you can make your code more clear and less error-prone. Additionally, strict mode prevents accidental creation of global variables, which can be a security risk and cause unexpected behavior in your program.

Example

<!DOCTYPE html>
<html>
<body>

<h1>Undeclared Variables in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    function Myfunction() {
        str = "WebTutor";
        return str;
    }
    console.log(Myfunction());  // Please Check Console
</script>

</body>
</html>

Preview

2. Deleting a Variable or a Function is Not Allowed

In JavaScript strict mode, the delete operator cannot be used to delete variables, functions, or function arguments. Attempting to do so will result in a SyntaxError. In non-strict mode, the delete operator can be used to delete properties from objects, including object properties and array elements. However, in strict mode, attempting to delete non-configurable properties of objects will also result in a TypeError.

By disallowing the deletion of variables, functions, and non-configurable properties, strict mode helps to prevent accidental modification of program elements and can lead to more reliable and secure code.

Example

<!DOCTYPE html>
<html>
<body>

<h1>Delete a Variable in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    var user = {name: "Peter", age: 26};
    delete user;  // Please Check Console
</script>

</body>
</html>

Preview

3. Duplicating a Parameter Name is Not Allowed

In JavaScript strict mode, duplicating a parameter name in a function definition is not allowed. This means that if you define a function with two or more parameters that have the same name, a SyntaxError will be thrown.

This restriction helps to prevent common programming errors, such as accidentally reassigning a parameter variable, which can cause unexpected behaviour in your program. By enforcing unique parameter names, strict mode can help to make your code more reliable and easier to maintain.

Example

<!DOCTYPE html>
<html>
<body>

<h1>Duplicate Parameter Name in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    function Myfunction(e, e) {
        return e * e;
    }
    console.log(Myfunction(4, 4));  // Please Check Console
</script>

</body>
</html>

Preview

4. The eval Method Cannot Alter Scope

In JavaScript strict mode, the eval() method cannot be used to create variables or functions in the local scope of the caller. This means that any variables or functions created within an eval() statement will not be accessible outside of the eval() statement, and will not be able to modify the scope of the caller.

This restriction helps to prevent unintended side effects and improve the predictability of your code. By disallowing the modification of scope through eval(), strict mode can help to make your code more secure and easier to debug.

Example

<!DOCTYPE html>
<html>
<body>

<h1>eval Method Cannot Alter in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    eval("var num = 26;");
    console.log(num);  // Please Check Console
</script>

</body>
</html>

Preview

5. The eval and arguments Cannot be Used as Identifiers

In JavaScript strict mode, the identifiers eval and arguments cannot be used as variable or function names. This means that any attempt to declare a variable or function with either of these names will result in a SyntaxError.

This restriction helps to prevent potential bugs and improve the security of your code. By disallowing the use of eval and arguments as identifiers, strict mode can help to make your code more reliable and easier to maintain.

Example

<!DOCTYPE html>
<html>
<body>

<h1>eval and arguments Cannot in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    var eval = 26;
    console.log(eval);  // Please Check Console
</script>

</body>
</html>

Preview

6. The with Statement is Not Allowed

In JavaScript strict mode, the with statement is not allowed. This means that any attempt to use the with statement will result in a SyntaxError. The with statement allows you to simplify access to properties of an object by treating them as if they were variables in the current scope. However, it can lead to unintended consequences and make your code more difficult to read and maintain.

By disallowing the with statement, strict mode helps to make your code more predictable and easier to reason about. It can also help to prevent common programming errors, such as accidentally modifying global or outer-scope variables. Instead of using with, you should use explicit object references to access the properties of an object.

Example

<!DOCTYPE html>
<html>
<body>

<h1>The with Statement in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    var radius = 26;
    with(Math) {
        var area2 = PI * radius * radius;  // Please Check Console
    }
</script>

</body>
</html>

Preview

7. Writing to a Read-only Property is Not Allowed

In JavaScript strict mode, writing to a read-only property is not allowed. This means that any attempt to modify a read-only property will result in a TypeError. A read-only property is a property that has been marked as not writable, either by using the Object.defineProperty() method or by using an object literal with the writable property set to false.

This restriction helps to prevent unintended side effects and improve the predictability of your code. By disallowing the modification of read-only properties, strict mode can help to make your code more secure and easier to debug.

Example

<!DOCTYPE html>
<html>
<body>

<h1>Writing to a Read-only Property in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    var user = {name: "Peter", age: 26};

    Object.defineProperty(user, "gender", {value: "male", writable: false});
    user.gender = "female";  // Please Check Console
</script>

</body>
</html>

Preview

8. Adding a New Property to a Non-extensible Object is Not Allowed

In JavaScript strict mode, adding a new property to a non-extensible object is not allowed. This means that any attempt to add a new property to a non-extensible object will result in a TypeError. An object is non-extensible if it has been marked as not extensible using the Object.preventExtensions() method. Once an object has been marked as non-extensible, it cannot be extended with new properties.

This restriction helps to prevent unintended modifications to objects and improve the predictability of your code. By disallowing the addition of new properties to non-extensible objects, strict mode can help to make your code more secure and easier to debug.

Example

<!DOCTYPE html>
<html>
<body>

<h1>Adding a New Property to a Non-extensible Object in Strict Mode</h1>
<p>Please Check Console</p>
<script>
    "use strict";

    var user = {name: "Peter", age: 26};

    console.log(Object.isExtensible(user));
    Object.freeze(user);
    console.log(Object.isExtensible(user));
    user.gender = "male";   // Please Check Console
</script>

</body>
</html>

Preview

9. Octal Numbers are Not Allowed

In JavaScript strict mode, octal numbers are not allowed. This means that any attempt to use octal notation to represent a number will result in a SyntaxError. Octal notation is a way of representing numbers in base 8 by prefixing the number with a zero (0). For example, the number 10 can be represented in octal notation as 012. However, in strict mode, octal notation is not allowed.

This restriction helps to prevent common programming errors, such as accidentally using octal notation instead of decimal notation, which can lead to unexpected behavior in your code. By disallowing octal notation, strict mode can help to make your code more predictable and easier to reason about.

Example

<!DOCTYPE html>
<html>
<body>

<h1>Octal Literals in Strict Mode</h1>
<p>Please Check Console(F12)</p>
<script>
    "use strict";

    var x = 026;
    console.log(parseInt(x));  // Please Check Console
</script>

</body>
</html>

Preview

10. Keywords Reserved for Future are Not Allowed

In JavaScript strict mode, keywords reserved for future use are not allowed as variable names, function names, or parameter names. This means that any attempt to use a keyword that has been reserved for future use as an identifier will result in a SyntaxError.

Keywords reserved for future use are keywords that are not currently used by the language, but may be used in future versions of the language. These keywords are reserved to prevent them from being used as variable names, function names, or parameter names, which could cause problems in future versions of the language.

This restriction helps to prevent future compatibility issues and improve the maintainability of your code. By disallowing the use of keywords reserved for future use, strict mode can help to make your code more future-proof and easier to maintain.

JS Hoisting

JS Arrow Function

JavaScript Strict Mode

Enabling Strict Mode

Example

Example

General Restrictions in Strict Mode

1. Undeclared Variables are Not Allowed

Example

2. Deleting a Variable or a Function is Not Allowed

Example

3. Duplicating a Parameter Name is Not Allowed

Example

4. The eval Method Cannot Alter Scope

Example

5. The eval and arguments Cannot be Used as Identifiers

Example

6. The with Statement is Not Allowed

Example

7. Writing to a Read-only Property is Not Allowed

Example

8. Adding a New Property to a Non-extensible Object is Not Allowed

Example

9. Octal Numbers are Not Allowed

Example

10. Keywords Reserved for Future are Not Allowed

Links

Tutorials

Connect with us