loading...
Cover image for Strict Mode in JavaScript

Strict Mode in JavaScript

bhagatparwinder profile image Parwinder πŸ‘¨πŸ»β€πŸ’» ・2 min read

JavaScript with Parwinder (39 Part Series)

1) What is Javascript? 2) Where can I run JavaScript? 3 ... 37 3) Types in JavaScript 4) What are objects in JavaScript? 5) Reference vs Value 6) Arrays in JavaScript 7) Array Methods in JS 8) Array Instance Methods 9) Array Instance Methods II 10) Functions in JavaScript 11) Type of Functions in JavaScript 12) Scope in JavaScript 13) Hoisting in JavaScript 14) Closures in JavaScript 15) Debugging in JavaScript: Console Methods 16) The new Keyword in JavaScript 17) JavaScript: Type Conversion 18) JavaScript: While Loop 19) JavaScript: Do While Loop 20) JavaScript: For Loop 21) Lesser-Known JavaScript Tricks 22) Events & Event Handling 23) Event Bubbling 24) Event Capturing 25) JS: Switch Statement Explained 26) Arrow Function: Basics 27) this Keyword in JavaScript 28) Arrow functions & this keyword 29) Callback Functions & Callback Hell 30) Strict Mode in JavaScript 31) Optional Chaining 32) Timers & Intervals 33) Arrow Function and The new, arguments & super Keyword! 34) Promises: Introduction 35) Promises: Chaining, Error Handling & Operators 36) New Promise Methods: allSettled & any 37) Async/Await: Introduction 38) Async/Await: Common Mistakes 39) Async/Await: Error Handling

The strict mode was introduced in ES5. It is a way of enforcing strict rules while coding in JS. Not all browsers support strict mode, so always test your code.

Advantages:

  1. Disable some silent JS errors and throw them instead.
  2. Performant code in specific instances where a JS engine supports performance optimizations
  3. Code improvements
    • No duplicate keys in objects
    • Variable declaration without var keyword
    • Error on duplicate function arguments

Enabling strict mode

  • File-level: add "use strict" on top of the file before any other statements.
  • Function level: add the same "use strict" on top of the function body before any other statements.
  • Module level: Modules introduced in ES6/ES2015 are in strict mode by default.

Changes applied in strict mode

  1. Variable declaration without var keyword
   someVariable = 17;
   console.log(someVariable); // 17

This is a completely valid code. Even though we did not use let, var or const to declare the variable, JavaScript works without an issue. This would force JS to create a global property, and that could cause side effects in a large application (variable name conflict and modifying global variables).

Strict mode solves this by throwing an error.

  1. No duplicate keys in objects
   const myObject = {
        name: "Parwinder",
        age: 34,
        car: "MiniCoop",
        name: "Bhagat"
    }
   console.log(myObject.name); // Bhagat

Again, completely valid under non-strict mode (sloppy mode) but throws an error in strict mode.

  1. Throw error when trying to delete undeletable properties of an object
   "use strict"
   delete Object.prototype; // throws a TypeError
  1. No duplicate arguments in functions
   function sumOfNumbers(a, a, b) {
       return a + a + b;
   }

   console.log(sumOfNumbers(1, 2, 3)); // 7

The above code is valid too. It ends up with unexpected results. The value of a is set to 2, and the sum returns 7 instead of our expectation, 6. Strict mode throws a syntax error.

  1. Assigning NaN to a variable has no failure feedback in sloppy mode. Strict mode throws an exception

🚨 There’s no way to cancel "use strict". Once we enter strict mode, there’s no way to turn it off.

JavaScript with Parwinder (39 Part Series)

1) What is Javascript? 2) Where can I run JavaScript? 3 ... 37 3) Types in JavaScript 4) What are objects in JavaScript? 5) Reference vs Value 6) Arrays in JavaScript 7) Array Methods in JS 8) Array Instance Methods 9) Array Instance Methods II 10) Functions in JavaScript 11) Type of Functions in JavaScript 12) Scope in JavaScript 13) Hoisting in JavaScript 14) Closures in JavaScript 15) Debugging in JavaScript: Console Methods 16) The new Keyword in JavaScript 17) JavaScript: Type Conversion 18) JavaScript: While Loop 19) JavaScript: Do While Loop 20) JavaScript: For Loop 21) Lesser-Known JavaScript Tricks 22) Events & Event Handling 23) Event Bubbling 24) Event Capturing 25) JS: Switch Statement Explained 26) Arrow Function: Basics 27) this Keyword in JavaScript 28) Arrow functions & this keyword 29) Callback Functions & Callback Hell 30) Strict Mode in JavaScript 31) Optional Chaining 32) Timers & Intervals 33) Arrow Function and The new, arguments & super Keyword! 34) Promises: Introduction 35) Promises: Chaining, Error Handling & Operators 36) New Promise Methods: allSettled & any 37) Async/Await: Introduction 38) Async/Await: Common Mistakes 39) Async/Await: Error Handling

Posted on by:

bhagatparwinder profile

Parwinder πŸ‘¨πŸ»β€πŸ’»

@bhagatparwinder

Happy, cheerful, confident. Web developer based out of Chicago :)

Discussion

markdown guide