"Use Strict" is a feature introduced in ECMAScript 5 that allows developers to opt-in to a stricter interpretation of JavaScript syntax. This feature ensures that code is executed in a "strict mode" that catches potential errors and enforces stricter rules for variable declarations and other programming constructs.
In this article, we will explore the benefits of using "use strict" and provide 20 examples of how to use it in your JavaScript code.
Benefits of Using "Use Strict"
Catching Errors Earlier: "Use Strict" enables JavaScript engines to catch more errors during the code compilation phase. This helps to reduce the number of runtime errors, making it easier to debug code.
Eliminating "Implicit Globals": In JavaScript, variables that are not explicitly declared are automatically assigned to the global scope. This can cause unexpected behavior and make it harder to track down bugs. "Use Strict" eliminates this behavior, requiring all variables to be explicitly declared.
Preventing Ambiguity: Without "Use Strict", JavaScript engines may interpret code differently, leading to unexpected behavior. "Use Strict" enforces consistent interpretation of code, reducing ambiguity.
Disabling Deprecated Features: In some cases, features may be deprecated in newer versions of JavaScript, but still work in older versions. "Use Strict" disables these features, helping to ensure code compatibility with future versions of JavaScript.
Examples of Using "Use Strict"
- Basic Example:
javascript"use strict";
let a = 1;
This example shows how to use "use strict" in its most basic form. By including this directive at the beginning of a script, the code will run in strict mode.
- Function-Level Strict Mode:
javascriptfunction myFunction() {
"use strict";
let a = 1;
}
This example shows how to use "use strict" at the function level. By including the directive inside a function, only that function will run in strict mode.
- Use Strict Within a Module:
javascriptexport function myFunction() {
"use strict";
let a = 1;
}
This example shows how to use "use strict" within a module. By including the directive within a module, all functions within that module will run in strict mode.
- Eliminating Implicit Globals:
javascriptfunction myFunction() {
"use strict";
a = 1;
}
Without "use strict", this code would create a global variable called "a". With "use strict", the variable must be explicitly declared with "let", "const", or "var".
- Duplicate Object Property Names:
javascript"use strict";
let myObject = {
prop1: 1,
prop1: 2
};
Without "use strict", this code would create an object with two properties both named "prop1". With "use strict", this code would throw a syntax error.
- Deleting Variables:
javascript"use strict";
let myVar = 1;
delete myVar;
Without "use strict", this code would simply do nothing. With "use strict", this code would throw a syntax error.
- Changing Read-Only Properties:
javascript"use strict";
let myObj = {};
Object.defineProperty(myObj, "myProp", {
value: 1,
writable: false
});
myObj.myProp = 2;
Without "use strict", this code would do nothing. With "use strict", this code would throw a type error.
- Octal Literals:
javascript"use strict";
let myNum = 012;
Without "use strict", this code would create a number with a value of 10. With "use
- Duplicate Function Parameter Names:
javascript"use strict";
function myFunction(a, b, a) {
// Code goes here
}
Without "use strict", this code would create a function with three parameters, with the last parameter overwriting the first. With "use strict", this code would throw a syntax error.
- Using "eval":
javascript"use strict";
let x = 1;
eval("x = 2");
Without "use strict", this code would change the value of "x" to 2. With "use strict", this code would throw a syntax error.
- Using "arguments.callee":
javascript"use strict";
let myFunction = function() {
console.log(arguments.callee);
};
Without "use strict", this code would log the function definition to the console. With "use strict", this code would throw a type error.
- Duplicate Variable Declarations:
javascript"use strict";
let x = 1;
let x = 2;
Without "use strict", this code would simply overwrite the value of "x". With "use strict", this code would throw a syntax error.
- "with" Statement:
javascript"use strict";
let myObj = { x: 1 };
with (myObj) {
console.log(x);
}
Without "use strict", this code would log the value of "x" to the console. With "use strict", this code would throw a syntax error.
- Using "delete" on Non-Configurable Properties:
javascript"use strict";
let myObj = {};
Object.defineProperty(myObj, "myProp", {
value: 1,
configurable: false
});
delete myObj.myProp;
Without "use strict", this code would do nothing. With "use strict", this code would throw a type error.
- Using "this" in Function Context:
javascript"use strict";
function myFunction() {
console.log(this);
}
myFunction();
Without "use strict", this code would log the global object to the console. With "use strict", this code would log "undefined" to the console.
- Changing Non-Writable Properties:
javascript"use strict";
let myObj = {};
Object.defineProperty(myObj, "myProp", {
value: 1,
writable: false
});
myObj.myProp = 2;
Without "use strict", this code would do nothing. With "use strict", this code would throw a type error.
- Calling Non-Callable Objects:
javascript"use strict";
let myObj = {};
myObj();
Without "use strict", this code would throw a runtime error. With "use strict", this code would throw a type error.
- Function Declarations in Blocks:
javascript"use strict";
if (true) {
function myFunction() {
console.log("Hello");
}
}
myFunction();
Without "use strict", this code would log "Hello" to the console. With "use strict", this code would throw a syntax error.
- "this" Keyword in Strict Mode:
javascript"use strict";
function myFunction() {
console.log(this);
}
myFunction();
Without "use strict", this code would log the global object to the console. With "use strict", this code would log "undefined" to the console.
- Duplicate Label Names:
javascript"use strict";
myLabel: for (let i = 0; i < 10; i++) {
console.log(i);
myLabel: for (let j = 0; j < 10; j++) {
- Octal Numeric Literals:
javascript"use strict";
let myNumber = 0123;
Without "use strict", this code would assign the value 83 to "myNumber". With "use strict", this code would throw a syntax error.
- Writing to Read-Only Properties:
javascript"use strict";
let myObj = {};
Object.defineProperty(myObj, "myProp", {
value: 1,
writable: false
});
myObj.myProp = 2;
Without "use strict", this code would do nothing. With "use strict", this code would throw a type error.
- Using "arguments" Keyword in Functions:
javascript"use strict";
function myFunction() {
console.log(arguments[0]);
}
myFunction(1, 2, 3);
Without "use strict", this code would log "1" to the console. With "use strict", this code would log "undefined" to the console.
- Unqualified "delete":
javascript"use strict";
let myObj = {};
delete myObj;
Without "use strict", this code would do nothing. With "use strict", this code would throw a syntax error.
- Getter-Only Accessor Properties:
javascript"use strict";
let myObj = {
get myProp() {
return 1;
}
};
myObj.myProp = 2;
Without "use strict", this code would do nothing. With "use strict", this code would throw a type error.
These are just a few of the restrictions enforced by "use strict". By enabling strict mode, developers can avoid common programming mistakes, increase code security, and improve performance. It is recommended to use strict mode in all JavaScript code.