Strict Mode in JavaScript - AlexWebLab in Hong Kong 香港

What is Strict Mode?

Strict Mode is a way to opt into a restricted variant of JavaScript, thereby implicitly opting out of "sloppy mode." It can be applied to entire scripts or to individual functions. Enabling strict mode helps catch common coding errors, prevents the use of certain JavaScript features that are considered problematic, and generally makes the code more robust and secure.

Strict Mode is enabled by placing the directive "use strict"; at the beginning of a script or function. For example:

// Enabling strict mode for an entire script
'use strict'

function exampleFunction() {
  // function code here
}

// Enabling strict mode for a specific function
function exampleFunction() {
  'use strict'
  // function code here
}

Characteristics of JavaScript Strict Mode

Strict Mode changes both syntax and runtime behavior. Here are some key characteristics and rules enforced by Strict Mode:

1. Eliminates Some JavaScript Silent Errors

In non-strict mode, JavaScript sometimes fails silently without throwing an error. Strict Mode changes these silent errors to throw exceptions. Examples include:

Assigning to Undeclared Variables: Assigning values to undeclared variables throws a ReferenceError.
```
'use strict'
x = 3.14 // ReferenceError: x is not defined
```

Assignment to Non-Writable Properties: Assigning values to read-only properties throws a TypeError.

'use strict'
const obj = {}
Object.defineProperty(obj, 'x', { value: 42, writable: false })
obj.x = 9 // TypeError: Cannot assign to read only property 'x'

Deleting Undeletable Properties: Deleting properties that are non-configurable throws a TypeError.

'use strict'
delete Object.prototype // TypeError: Cannot delete property 'prototype' of function Object() { [native code] }

2. Prevents Accidental Globals

Strict Mode catches variables that are implicitly declared as global variables by omission of the var, let, or const keyword. This helps prevent unintentional global variable creation.

'use strict'
mistypedVariable = 17 // ReferenceError: mistypedVariable is not defined

3. Throws Error on `this` References in Functions

In strict mode, this within functions that are not methods of an object is undefined, unlike in non-strict mode where this defaults to the global object.

'use strict'
function testThis() {
  console.log(this) // undefined
}
testThis()

4. Disallows Duplicates in Function Parameters

Strict Mode prevents functions from having duplicate parameter names, which helps avoid ambiguity and potential errors.

'use strict'
function sum(a, a, c) {
  // SyntaxError: Duplicate parameter name not allowed in this context
  return a + a + c
}

5. Disallows Octal Literals

Octal literals (numbers with a leading zero) are not allowed in Strict Mode, as they can be a source of confusion.

'use strict'
let x = 010 // SyntaxError: Octal literals are not allowed in strict mode.

6. Enforces Secure JavaScript

Strict Mode prevents the use of with statements and disables eval from creating variables in the scope from which it was called, making the code more secure and predictable.

'use strict'
eval('var x = 2')
console.log(x) // ReferenceError: x is not defined

with (Math) {
  // SyntaxError: Strict mode code may not include a with statement
  x = cos(2)
}

7. Restricts Deleting Plain Names

Strict Mode prevents the deletion of plain variables, functions, and function arguments.

'use strict'
var x
delete x // SyntaxError: Delete of an unqualified identifier in strict mode.

8. Improved `eval`

Variables and functions declared inside eval() in Strict Mode cannot be accessed outside the eval() block, leading to more predictable code.

'use strict'
eval('var x = 2')
console.log(x) // ReferenceError: x is not defined

Conclusion

Strict Mode in JavaScript is an important tool for writing safer, cleaner, and more reliable code. By enforcing stricter parsing and error handling, it helps developers avoid common pitfalls and silent errors that can lead to bugs and security vulnerabilities. Adopting Strict Mode in your JavaScript codebase is a good practice that can contribute to more maintainable and robust applications.