Strict mode in JavaScript is a way to opt into a restricted variant of the language, which helps in writing more secure and cleaner code by catching common coding mistakes and unsafe actions. It was introduced in ECMAScript 5 (ES5) and can be applied to entire scripts or individual functions.
Enabling Strict Mode
To enable strict mode for an entire script or a specific function, you use the directive “use strict”;.
Entire Script
“use strict”;
x = 3.14; // This will cause an error because x is not declared
Specific Function
function myFunction() {
“use strict”;
y = 3.14; // This will cause an error because y is not declared
}
Benefits and Features of Strict Mode
- Eliminates Some JavaScript Silent Errors by Changing Them to Throw Errors
- Assigning to undeclared variables:
“use strict”;
x = 3.14; // ReferenceError: x is not defined
- Assigning to non-writable properties:
“use strict”;
const obj = {};
Object.defineProperty(obj, “x”, { value: 42, writable: false });
obj.x = 9; // TypeError: Cannot assign to read only property ‘x’
- Assigning to getter-only properties:
“use strict”;
const obj = {
get x() { return 0; }
};
obj.x = 3.14; // TypeError: Cannot set property x of #<Object> which has only a getter
- Deleting undeletable properties:
“use strict”;
delete Object.prototype; // TypeError: Cannot delete property ‘prototype’ of function Object() { [native code] }
- Prevents Accidental Global Variables
Without strict mode, assigning a value to an undeclared variable implicitly creates a global variable.
“use strict”;
function myFunction() {
x = 3.14; // ReferenceError: x is not defined
}
- Throws Errors for Invalid Usage of this
In strict mode, this is undefined in functions that are called without an owner object.
“use strict”;
function myFunction() {
console.log(this); // undefined
}
myFunction();
- Disallows Duplicate Parameter Names
Strict mode disallows duplicate parameter names in functions, which can lead to unexpected behavior.
“use strict”;
function myFunction(x, x) { // SyntaxError: Duplicate parameter name not allowed in this context
// code
}
- Reserved Keywords for Future JavaScript Versions
Some keywords are reserved for future versions of JavaScript and cannot be used as variable names in strict mode.
“use strict”;
const implements = 1; // SyntaxError: Unexpected strict mode reserved word
const interface = 1; // SyntaxError: Unexpected strict mode reserved word
Strict Mode in ECMAScript Modules and Classes
Modules and classes are automatically in strict mode. You don’t need to explicitly enable it.
ECMAScript Modules
// In a module (ESM)
export function myFunction() {
x = 3.14; // ReferenceError: x is not defined
}
Classes
class MyClass {
constructor() {
this.x = 3.14; // ReferenceError: Cannot access ‘this’ before super()
}
}
Limitations of Strict Mode
Strict mode has some limitations and quirks:
- You cannot revert to non-strict mode.
- Strict mode does not apply to code evaluated using eval() unless the eval() code itself contains “use strict”;.
Example: Non-Strict vs. Strict Mode
Non-Strict Mode
function nonStrictFunction() {
x = 3.14; // Implicit global variable
console.log(x); // 3.14
}
nonStrictFunction();
console.log(x); // 3.14 (global variable)
Strict Mode
function strictFunction() {
“use strict”;
x = 3.14; // ReferenceError: x is not defined
}
strictFunction();
Summary
- Strict mode is a way to opt into a restricted variant of JavaScript, catching common errors and preventing potentially unsafe actions.
- Enabling strict mode is done with the directive “use strict”; at the beginning of a script or function.
- Benefits include preventing accidental globals, disallowing invalid this usage, catching silent errors, and reserving keywords for future use.
- Automatic strict mode in modules and classes means less boilerplate code in modern JavaScript.
Using strict mode is a best practice in JavaScript development as it promotes cleaner, more reliable, and maintainable code.