What is strict mode in JavaScript?

What is strict mode?

Strict mode forces a program to work under a "strict" operating context, which is a way to implicitly opt in, thereby opting out of sloppy mode(default mode or non-strict mode). All browsers support "strict mode" except Internet Explorer 9 or lower, hope no one is using it :)

what is the use case of use struct;?

The purpose of use script; is to indicate that the code should be executed in "strict mode". For instance, with strict mode, you cannot use an undeclared variable.

Strict mode makes it easier to write "secure" Javascript. As an example, in normal JavaScript, mistyping a variable name creates a new global variable. In strict mode, this will throw an error, making it impossible to accidentally create a global variable.

Invoking Strict Mode

How to enforce strict mode?

Strict mode applies to entire scripts or individual functions.

Strict mode for Scripts

To invoke strict mode for a script, put "use strict"; before other statements.

//Whole script strict mode
"use strict";
const variable = "Entire script in strict mode";

Strict mode for Functions

Similarly, to invoke strict mode for functions, put "use strict"; inside the function body before any other statements.

function strictModeFunction(){
    //functional level strict mode
    "use strict";
    return "This is Functional script mode";
}

Note:

• The entire contents of Javascript modules are automatically in strict mode.

• Also, the body of a class is in strict mode, including both class declarations and class expressions.

Converting mistakes to Errors

Assigning to undeclared Variables

In sloppy mode (nonstrict mode), doing this -

var variable = 'King';
vriable = 'bing';

This would result in a new global variable (window.vriable) is created, and the variable is untouched. In Strict mode, assigning a value to an undeclared variable will throw a Reference Error.

Illegal assignments

In Javascript, assigning values to protected variables would fail silently. In strict mode, it throws errors. For example, the following:

var undefined = '1';
var NaN = 143;

Would usually fail silently. With strict mode, it throws a Type Error exception.

Duplicated properties in objects

In JavaScript you can define an object property twice or more, it will just take the last definition and override the previous ones.

var myObject = {
    name: 'King',
    name: 'lion'
}console.log(myObject.name); //output 'lion'

In strict mode, this will throw a syntax error. Although it seems like we are doing something wrong (in the end, we just have a perfectly formed object), this is a bug magnet.

Arguments in functions

In normal JavaScript, we can repeat argument names in functions. The late occurrence of these arguments will override the previous ones:

function checkFunction (a, b, a, a) {
    // ...
}

This is perfectly fine. With strict mode, I’ll get a syntax error.

Note: "use strict"; is not allowed to use in functions with default parameters.

Failing to delete object properties

Attempts to delete a non-configurable or otherwise undeletable property throw in strict mode (where before the attempt would have no effect):

"use strict";
delete Object.prototype; // TypeError
delete [].length; // TypeError

Strict mode also forbids deleting plain names. delete name in strict mode is a syntax error.

"use strict";
var age;
delete age; // syntax error

Then how to delete these?

Just prefix it with globalThis to delete it.

"use strict";

delete globalThis.age;

Hope you learned something. Thank you for reading.

Happy coding!