Deep Dive into JavaScript's 'use strict' Directive

JavaScript's use strict directive is similar to an elite coach who'll push you (albeit harshly) to optimize your performance. As you embrace disciplined coding, you'll find that this tiny directive packs a big punch, shaping you into a proficient JavaScript developer. Let's delve into the many facets of strict mode with illustrative code snippets.

Why 'use strict'?

Before we move ahead, let's quickly see how you'd use use strict. Place this line at the top of your JavaScript file or function to enable strict mode.

1"use strict";

What Strict Mode Changes

No More Silent Errors

In default mode, JavaScript allows some oddities that can lead to silent errors, making debugging difficult. In strict mode, these become actual errors.

1// Without strict mode
2x = 10; // No error, but the variable 'x' is implicitly declared.
3
4// With strict mode
5"use strict";
6x = 10; // Uncaught ReferenceError: x is not defined

Performance Optimization

The engine can make better optimizations with strict mode because you can't use, for example, the with statement or eval in ways that introduce new variable bindings.

1// Without strict mode, variable assignments in eval are local
2eval("var x = 10;");
3console.log(x); // Output 10
4
5// With strict mode
6"use strict";
7eval("var x = 10;");
8console.log(x); // Uncaught ReferenceError: x is not defined

Future-Proofing Your Code

Keywords like implements, interface, let, package, private, protected, public, static, and yield are reserved in strict mode, making your code forward-compatible.

xxxxxxxxxx

// Enabling strict mode

"use strict";

​

// Illustrating no more silent errors

try {

  x = 10;  // Should throw an error because x is not declared

} catch(e) {

  console.log("Error:", e.message);  // Output: "Error: x is not defined"

}

​

// Showing performance optimization with eval

try {

  eval("var x = 10;");

  console.log(x);  // Should throw an error because x is scoped to eval

} catch(e) {

  console.log("Error:", e.message);  // Output: "Error: x is not defined"

}

​

// Demonstrating future-proofing by using reserved keywords

try {

  var let = 10;  // Should throw an error because 'let' is a reserved keyword in strict mode

} catch(e) {

  console.log("Error:", e.message);  // Output: "Error: Unexpected strict mode reserved word"

}