JavaScript

coding learning websites codepractice

JS Basics

JS Variables & Operators

JS Data Types & Conversion

JS Numbers & Math

JS Strings

JS Dates

JS Arrays

JS Control Flow

JS Loops & Iteration

JS Functions

JS Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

JavaScript Strict Mode


Strict Mode in JavaScript is a feature that helps developers write safer and cleaner code. By enabling strict mode, JavaScript enforces more rigorous error checking, preventing common mistakes and unsafe actions. It helps avoid silent errors, accidental global variables, and other pitfalls.

Strict mode is introduced in ECMAScript 5 (ES5) and can be applied globally or locally within functions.

Enabling Strict Mode

Global Strict Mode

You can enable strict mode for the entire script by placing "use strict"; at the top of the file:

"use strict";

let x = 10;
console.log(x); // 10
  • This applies strict mode to all code in the script.

Function-Level Strict Mode

Strict mode can also be applied to individual functions:

function strictFunction() {
  "use strict";
  y = 20; // ReferenceError: y is not defined
}

strictFunction();
  • Variables must be declared with var, let, or const. Assigning to undeclared variables throws a ReferenceError in strict mode.

Key Features of Strict Mode

1. Prevents Undeclared Variables

In normal mode, assigning a value to an undeclared variable creates a global variable. Strict mode prevents this:

"use strict";

x = 5; // ReferenceError: x is not defined
let x = 5; // Correct
  • Helps prevent accidental globals, which are common sources of bugs.

2. Eliminates this Coercion

In normal mode, this inside a function defaults to the global object (window in browsers). In strict mode, this is undefined for standalone functions:

"use strict";

function checkThis() {
  console.log(this);
}

checkThis(); // undefined (instead of window)
  • Helps catch accidental references to global objects.

3. Prevents Duplicate Parameter Names

Strict mode disallows duplicate parameter names in functions:

"use strict";

function sum(a, a, b) { // SyntaxError
  return a + a + b;
}
  • Prevents confusion and bugs in function logic.

4. Throws Error for Assigning to Read-Only Properties

Strict mode throws errors when you attempt to modify read-only properties, non-writable properties, or constants:

"use strict";

const PI = 3.14;
PI = 3.14159; // TypeError: Assignment to constant variable
  • Prevents silent failures in non-strict mode.

5. Disallows Deleting Undeletable Properties

In strict mode, deleting variables, functions, or objects that cannot be deleted throws an error:

"use strict";

delete Object.prototype; // TypeError
  • Normal mode fails silently; strict mode alerts you to the mistake.

6. Disallows Octal Literals

Octal number literals (e.g., 010) are not allowed in strict mode:

"use strict";

let num = 010; // SyntaxError
  • Encourages using modern numeric representations like 0o10.

7. Reserved Keywords

Strict mode reserves certain keywords for future versions of JavaScript:

"use strict";

let public = 10; // SyntaxError
let static = 20; // SyntaxError
  • Prevents conflicts with future ECMAScript features.

Practical Examples

Example 1: Preventing Accidental Global Variables

"use strict";

function createUser() {
  userName = "Alice"; // ReferenceError
  let userAge = 25;   // Correct
}

createUser();
  • Without strict mode, userName would have become a global variable.

Example 2: Safer this References

"use strict";

function showThis() {
  console.log(this);
}

showThis(); // undefined
  • Ensures this is not automatically assigned to the global object.

Example 3: Catching Syntax Errors Early

"use strict";

function multiply(a, a) { // SyntaxError: duplicate parameter name
  return a * a;
}
  • Helps avoid silent bugs and makes code predictable.

Best Practices

  1. Always use "use strict"; at the top of scripts or functions to ensure safe coding.

  2. Avoid relying on accidental globals; declare all variables explicitly.

  3. Use let and const instead of var to leverage block scoping.

  4. Strict mode is particularly useful in large codebases to catch errors early.

  5. Combine strict mode with ES6+ features like arrow functions and classes for modern, robust code.

Summary of the Tutorial

  • Strict Mode enforces safer and cleaner JavaScript coding practices.

  • It prevents accidental globals, duplicate parameters, octal literals, unsafe assignments, and improper this references.

  • Strict mode can be applied globally or locally within functions.

  • Using strict mode ensures predictable behavior, easier debugging, and fewer runtime errors.

Enabling strict mode is highly recommended for all modern JavaScript projects to maintain code quality and reliability.


Practice Questions

  1. Enable strict mode globally and try assigning a value to an undeclared variable. Explain the error.

  2. Enable strict mode inside a function and try assigning a value to an undeclared variable within that function.

  3. Write a function with duplicate parameter names in strict mode and observe the result.

  4. Declare a constant and attempt to reassign its value in strict mode. Explain what happens.

  5. Try deleting a built-in object or property (e.g., Object.prototype) in strict mode and explain the output.

  6. Use this inside a standalone function in strict mode and log its value. Compare it with non-strict mode behavior.

  7. Declare a variable using an octal literal (e.g., 010) in strict mode and observe the result.

  8. Try using a reserved keyword (like static or public) as a variable name in strict mode. Explain why it fails.

  9. Create a function in strict mode that accesses a global variable and another undeclared variable. Observe which causes an error.

  10. Write a function in strict mode that works correctly with block-scoped variables using let and const.


JavaScript

online coding class codepractice

JS Basics

JS Variables & Operators

JS Data Types & Conversion

JS Numbers & Math

JS Strings

JS Dates

JS Arrays

JS Control Flow

JS Loops & Iteration

JS Functions

JS Objects

JS Classes & Modules

JS Async Programming

JS Advanced

JS HTML DOM

JS BOM (Browser Object Model)

JS Web APIs

JS AJAX

JS JSON

JS Graphics & Charts

Go Back Top