Strict mode is a feature in JavaScript that was introduced in ECMAScript 5. It lets you write code in such a way that follows stricter rules.
When strict mode is enabled, the JavaScript engine enforces additional constraints. This means you may be able to catch some common errors that would have otherwise gone unnoticed. It also helps you write cleaner and more secure code.
How to Use Strict Mode
Strict mode can be used in two ways, remember strict mode doesn’t work with block statements enclosed in {} braces.
- Used in global scope for the entire script.
- It can be applied to individual functions.
Using Strict mode for the entire script
To invoke strict mode for an entire script, put the exact statement “use strict”; (or ‘use strict’;) before any other statements.
“use strict”
// Your code goes here…
Using Strict mode for a function
Likewise, to invoke strict mode for a function, put the exact statement “use strict”; (or ‘use strict';) in the function’s body before any other statements.
“use strict”
// Function body goes here…
}
1 2 3 4 | // Using a variable, without declaring it, is not allowed: 'use strict'; x = 3.14; // will throw an error //Console: Error |
Ex:
Using strict mode, don’t allow to use a variable without declaring it.
1 2 3 4 5 6 7 | // Objects are variables too. // Using an object, without declaring it, is not allowed: 'use strict'; // Will throw an error x = {p1:10, p2:20}; //Console: Error |
Difference Between Strict Mode and Regular
Using an Undeclared Variable
When writing code in strict mode, you must declare all variables and objects before use. This is useful because it helps to prevent creating global variables by accident which can lead to bugs.
Ex:
1 2 3 4 5 6 7 8 9 10 | // Regular JavaScript function regularFunc() { username = "Marie" console.log(username) } regularFunc() //Console: Marie |
Ex:
1 2 3 4 5 6 7 8 9 | // Strict mode function strictFunc() { "use strict" username = "Marie" console.log(username) } strictFunc() |
Duplicating a Parameter Name
In non-strict mode, duplicating a parameter name in a function is allowed. Only the last instance of the duplicates is allowed whiles the others are ignored.
But strict mode functions do not allow this. It throws a syntax error in the case of duplicates.
Ex:
1 2 3 4 5 | function addNums (num, num) { console.log(num + num) } addNums(2, 3) // 6 |
But:
1 2 3 4 5 6 | function addNums (num, num) { "use strict" console.log(num + num) } addNums(2, 3) |
Using Reserved Future Keywords
In JavaScript, there are some keywords reserved for potential future use. And using these keywords as identifiers (such as variables or function names) may likely cause issues in future.
Ex:
package is one of such keywords. When you’re not using strict mode, you can use it to name variables and functions.
1 2 3 4 | const package = "This is a package" console.log(package) //Console: This is a package |
Strict mode doesn’t allow the use of these reserved keywords. This ensures compatibility with future versions of JavaScript.
1 2 3 | "use strict" const package = "This is a package" console.log(package) |
Other future reserved keywords include:
- implements
- interface
- private
- protected
- public
- static
- yield
- arguments
Use of Deprecated Features
Strict mode restricts the use of JavaScript’s deprecated features like arguments.caller, arguments.callee, and so on.
These are disallowed due to security and performance concerns. But non-strict mode allows using them.
Ex:
1 2 3 4 5 6 7 8 9 10 11 12 | // non-strict mode function outerFunction() { innerFunction(); } function innerFunction() { console.log(innerFunction.caller); // Example of .caller } outerFunction(); //Without any errors. |
But:
1 2 3 4 5 6 7 8 9 10 11 | "use strict" function outerFunction() { innerFunction(); } function innerFunction() { console.log(innerFunction.caller); // Example of .caller } outerFunction(); |
Assignment to a Read-Only Property
In non-strict mode, when you attempt to assign a new value to a read-only property, the assignment will not modify the property’s value. But it will not throw any error. Instead, the assignment silently fails, and the property retains its original value.
Ex:
1 2 3 4 5 6 7 8 | const obj = {} Object.defineProperty(obj, 'key', { value: 10, writable: false }) obj.key = 20 console.log(obj.key) //Console: 10 |
In strict mode, however, attempting to update the value of the property will result in a TypeError. This stricter enforcement helps catch potential errors early.
1 2 3 4 5 6 7 | "use strict" const obj = {} Object.defineProperty(obj, 'key', { value: 10, writable: false }) obj.key = 20 console.log(obj.key) |
Greetings from Florida! I’m bored to death at work so I decided to
check out your website on my iphone during lunch break.
I really like the knowledge you present here and can’t wait to
take a look when I get home. I’m shocked at how quick your blog loaded on my cell phone
.. I’m not even using WIFI, just 3G .. Anyhow, good site!
Thank you for taking the time to visit our website during your lunch break. We’re thrilled to hear that you enjoyed the content and found it engaging. It’s great to know that our website loads quickly even on 3G, without needing WIFI. If you have any feedback or suggestions, feel free to share them with us. We hope you’ll continue to enjoy exploring our site in the future!
You ought to be a part of a contest for one of the best sites on the internet.
I most certainly will highly recommend this site!
Thank you very much for the positive recommendation! It’s a great motivation to continue providing quality content and the best possible service. If you have any suggestions or need assistance, please don’t hesitate to contact us. We’re always here to listen and improve to provide a better experience for everyone.