"use strict"; in javascript

midasxiv

Midas/XIV

Posted on September 24, 2019

"use strict"; in javascript

Hey guys, so full disclosure; I have been working as a product engineer and I had the task to quickly prototype a feature and a long story short I basically asked a few of the other members for help since I couldn't get a certain POST request to work right, and after a few hours in and since all of them said the way the POST request was being made is pretty much right, I decided to debug the application and by this moment the application was extremely complex and branched.
So just when I was about to begin, one of my coworkers asked if he could checkout the code and as i scrolled to the POST request i realized I had misspelled a variable and my coworker saw that and that's when he told me about "use strict" so that's pretty much when I took a moment to read up about it and thought it's something that everyone starting JavaScript should definitely know.

The "use strict" directive was new in ECMAScript version 5 (around since 2011) and forces a program (or function) to work under a “strict” operating context. It is not a statement, but a literal expression, ignored by earlier versions of JavaScript. With strict mode on it is easier to detect JavaScript silent errors as they would throw an error now. This makes debugging much easier and the chances of developers making mistakes is reduced. Most modern browsers support strict mode except Internet Explorer 9.

so why exactly is "use strict" a string ?

If an older browser saw the "use strict" string it would consider it as a string and simply ignore it executing without enabling the strict mode as it is just a string Internet Explorer 9 will not throw an error even if it does not understand it, in a new browser when it sees the keyword used strict it then knows to turn itself into strict mode operating.

enabling strict mode !

Strict mode can be used in two ways

  • used in global scope

    // Whole-script strict mode syntax
    'use strict';
    var v = "Hi! I'm a strict mode script!";
    
  • used in functions

    // not strict
    function strict() {
        // Function-level strict mode syntax
        'use strict';
        return "Hi!  I'm a strict mode function!  ";
    }
    // not strict
    

"strict mode"; reports errors on the following:

  • Using a variable, without declaring it.
  • Using an object, without declaring it.
  • Using reserved keywords as variable names.
  • Deleting a variable (or object) is not allowed.
  • Deleting a function is not allowed.
  • Duplicating a parameter name is not allowed.
  • The word eval cannot be used as a variable.
  • For security reasons, eval() is not allowed to create variables in the scope from which it was called.

Examples

  1. Using variable / object without declaring it. ( helps is you misspelled a variable )
'use strict';
var uniqueValue = 23;
uniquValue = 17;         // this line throws a ReferenceError due to the 
                                    // misspelling the variable

unknownValue = 25;      // this line also throws a ReferenceError as variable is not declared
Enter fullscreen mode Exit fullscreen mode

Would result in a new global variable (as in unknownValue and uniquValue) created, and uniqueValue would remain untouched. Under strict mode, assigning a value to an undefined variable will throw a ReferenceError.

  1. Using reserved words to declare variables. ( future proof your code )
var let = 24;
console.log(let) // will output 24
Enter fullscreen mode Exit fullscreen mode
"use strict";
var let = 24;
console.log(let) // will raise an error
Enter fullscreen mode Exit fullscreen mode

Keywords reserved for future JavaScript versions can NOT be used as variable names in strict mode.
These are: implements,interface,let,package,private,protected,public,static,yield.

  1. Deleting variables, object, functions in strict mode raises error.
"use strict";
var variable = 23;
var obj = { 'name':'mxiv' };
function func(p1, p2 ) {
    console.log("Hello");
}
delete variable; // will raise error
delete obj; // will raise error
delete func; // will raise error
Enter fullscreen mode Exit fullscreen mode
  1. Function arguments cannot be deleted and have same name.
"use strict";
function func(p1, p2 ) {
    console.log("Hello");
    delete(p1); // raises error
}

function func2(p1,p1) { // raises error
    console.log("hey");
}
Enter fullscreen mode Exit fullscreen mode
  1. Eval restrictions.
eval('var variable = 2;');
console.log(variable); // displays 2 as the variable is leaked out of the eval function.
Enter fullscreen mode Exit fullscreen mode

when strict mode is used eval does not leak variables declared in the expression passed to it.
hence for security reasons in strict mode eval is not allowed to create variables in the scope from which it was called this brings us to the end of this article.

💖 💪 🙅 🚩
midasxiv
Midas/XIV

Posted on September 24, 2019

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Simplified: Javascript V8 engine ✨
javascript Simplified: Javascript V8 engine ✨

October 1, 2024

What is JSON?
javascript What is JSON?

September 20, 2024

Introduction to Node.js
javascript Introduction to Node.js

August 1, 2024

JavaScript on the Server: Node.js
javascript JavaScript on the Server: Node.js

July 28, 2024