JS Strict Mode

Understanding Strict Mode

Strict mode was introduced in ECMAScript 5 (ES5). It's a more stringent version of JavaScript that catches errors which would otherwise be ignored. For instance, in non-strict mode, if you set a variable without using var (e.g., x = 5;), JavaScript assumes it's a global variable and creates it if it doesn't exist.

Strict mode also highlights deprecated features as errors. This helps in reducing bugs, enhancing security, and improving the overall performance of your application.

Enabling Strict Mode

To activate strict mode, simply begin your script with "use strict", like this:

"use strict";

// All your code goes here
x = 5; // ReferenceError: x is not defined
console.log(x);

If you include the "use strict" directive at the beginning of your JavaScript code, strict mode applies to the entire script. Alternatively, you can enable strict mode within a specific function, like so:

x = 5;
console.log(x); // 5

function sayHello() {
"use strict";
str = "Hello World!"; // ReferenceError: str is not defined
console.log(str);
}
sayHello();

General Restrictions in Strict Mode

Strict mode alters both syntax and runtime behavior. In the sections below, we'll explore the general restrictions enforced by strict mode:

Undeclared Variables are Not Allowed

In strict mode, every variable must be declared. If you assign a value to an identifier that isn't a declared variable, it will throw a ReferenceError.

"use strict";

function doSomething() {
msg = "Hi, there!"; // ReferenceError: msg is not defined
return msg;
}
console.log(doSomething());

Deleting a Variable or a Function is Not Allowed

Strict mode prohibits deleting variables or functions. Attempting to delete them will result in a syntax error. In non-strict mode, such attempts fail silently, and the delete expression evaluates to false.

"use strict";

var person = {name: "Peter", age: 28};
delete person; // SyntaxError

Similarly, attempting to delete a function in strict mode will result in a syntax error:

"use strict";

function sum(a, b) {
return a + b;
}
delete sum; // SyntaxError

Duplicating a Parameter Name is Prohibited

In strict mode, a syntax error will occur if a function declaration includes two or more parameters with identical names. In non-strict mode, this does not cause an error.

"use strict";

function square(a, a) { // SyntaxError
return a * a;
}
console.log(square(2, 2));

The eval Method Cannot Change Scope

In strict mode, to enhance security, code executed via eval() cannot create or modify variables or define functions in the enclosing scope, unlike in non-strict mode.

"use strict";

eval("var x = 5;");
console.log(x); // ReferenceError: x is not defined

The eval and arguments Keywords

In strict mode, the identifiers eval and arguments are treated as reserved keywords. Therefore, you cannot use them as names for variables, functions, or function parameters.

"use strict";

var eval = 10; // SyntaxError
console.log(eval);

Restrictions on the with Statement

In strict mode, the with statement is prohibited. The with statement introduces properties and methods of an object into the current scope, allowing direct access to them within nested statements without explicit qualification.

"use strict";

// Without with statement
var radius1 = 5;
var area1 = Math.PI * radius1 * radius1;

// Using with statement
var radius2 = 5;
with(Math) { // SyntaxError
var area2 = PI * radius2 * radius2;
} 

Modifying Read-only Properties is Restricted

In strict mode, trying to assign a value to a property that is read-only, or attempting to modify a non-existing property, results in an error. In contrast, in non-strict mode, these operations fail silently.

"use strict";

var person = {name: "Peter", age: 28};

Object.defineProperty(person, "gender", {value: "male", writable: false});
person.gender = "female"; // TypeError

Modifying Non-extensible Objects is Restricted

In strict mode, trying to add new properties to objects that are non-extensible or non-existent will result in an error. However, in non-strict mode, such attempts do not generate errors and fail silently.

"use strict";

var person = {name: "Peter", age: 28};

console.log(Object.isExtensible(person)); // true
Object.freeze(person); // lock down the person object
console.log(Object.isExtensible(person)); // false
person.gender = "male"; // TypeError

Octal Numbers are Prohibited

In strict mode, octal numbers (numbers prefixed with a zero, e.g., 010, 0377) are not permitted. They are supported in all browsers in non-strict mode. However, in ES6, octal numbers are supported by prefixing a number with 0o (e.g., 0o10, 0o377).

"use strict";

var x = 010; // SyntaxError
console.log(parseInt(x));

You can see from the examples above how strict mode helps prevent common mistakes often overlooked in JavaScript programming.

Future Reserved Keywords are Restricted

As mentioned in previous sections, JavaScript prohibits using reserved words as identifiers (variable names, function names, and loop labels). Strict mode adds additional restrictions on certain keywords reserved for future use.

According to the latest ECMAScript 6 (ES6) standards, these keywords are reserved in strict mode: await, implements, interface, package, private, protected, public, and static. To ensure compatibility, it's best to avoid using these reserved keywords as variable or function names in your code.