⚖️ JavaScript Strict vs Sloppy Mode

? Quick Overview

JavaScript can run in two main modes:

Strict Mode: A safer, more modern way of writing JavaScript that catches silent errors and prevents unsafe actions.
Sloppy Mode: The default, older behavior that allows several error-prone patterns without complaining.

Using strict mode helps you write cleaner, more secure, and future-proof code.

? Key Concepts

Enabling Strict Mode: Add "use strict"; at the top of a file or inside a function.
Variable Declarations: Strict mode throws an error if you use a variable without declaring it first.
Globals: Sloppy mode silently creates global variables when you forget let, const, or var.
this in Functions: In strict mode, this in a normal function (not a method) is undefined; in sloppy mode it points to the global object (window in browsers).
Duplicate Parameters: Strict mode disallows functions with duplicate parameter names.
Deleting Variables: Strict mode prevents deleting declared variables and shows an error.

? Syntax and Rules of Strict Mode

Strict mode is enabled using a special directive: a string "use strict"; placed at the beginning of a script or function.

? View Code: Global vs Local Strict Mode

"use strict";
// Global strict mode applies to the whole script
function demo() {
"use strict";
// Local strict mode applies only inside this function
let x = 10;
console.log(x);
}

Notes about strict mode:

When used at the top of a script file, all code in that file runs in strict mode.
When used inside a function, only that function body is in strict mode.
ES6 modules are automatically in strict mode, so you don’t need the directive there.

? Strict vs Sloppy Code Examples

? Example: Undeclared Variable

"use strict";
x = 10;
// ReferenceError: x is not defined

? Example: Sloppy Mode Undeclared Variable

// Sloppy mode (default)
x = 10;
// Creates a global variable implicitly

? Example: this Behavior in Functions

// Sloppy mode
function showThis() {
console.log(this);
}
showThis();
// Window (in browsers)
// Strict mode
"use strict";
function showThisStrict() {
console.log(this);
}
showThisStrict();
// undefined

? Live Output / Explanation

? What Actually Happens?

In strict mode, the code "use strict"; x = 10; throws a ReferenceError because x was never declared.
In sloppy mode, the same line silently creates a new global variable x on the window object. This can accidentally overwrite existing globals and cause hard-to-find bugs.
For the this examples:
- Sloppy mode: calling showThis() logs the global object (Window in a browser).
- Strict mode: calling showThisStrict() logs undefined, preventing accidental use of the global object.

? When to Use Strict Mode

When writing modern JavaScript for production applications.
When learning JavaScript and you want the engine to catch your mistakes early.
In files that should be safe, secure, and compatible with future JavaScript versions.
Whenever you use build tools, bundlers, or ES6 modules (they typically rely on strict-mode-compatible code).

? Tips & Best Practices

Start all modern non-module scripts with "use strict"; at the top of the file.
Combine strict mode with linters like ESLint for even better error checking and style enforcement.
Remember: ES6 modules are already in strict mode, so you don’t need the directive inside them.
Don’t rely on this pointing to window in functions—strict mode will make it undefined unless you call the function with an explicit context.
Avoid duplicate parameter names in functions; strict mode will treat them as errors.

? Try It Yourself

Write a small script in sloppy mode where you use an undeclared variable. Then enable strict mode and observe the error you get in the console.
Create a function and log this inside it. Test it in strict and sloppy modes. Compare the outputs (undefined vs window).
Define a function with duplicate parameter names (e.g. function f(a, a)) and see how strict mode reacts compared to sloppy mode.
Create a small ES6 module file and confirm that it behaves like strict mode even without the "use strict"; directive.