What is "use strict" and what does it do?

Asim Hussain
A free video tutorial from Asim Hussain
Conference speaker, published author & passionate teacher
4.5 instructor rating • 5 courses • 46,109 students

Learn more from the full course

Advanced Javascript

In only seven hours you will learn enough javascript to transform from a Junior JS Dev into a Senior JS Guru

06:41:56 of on-demand video • Updated February 2020

  • Impress interviewers with knowledge about advanced JavaScript features
  • Confidently Interview other JavaScript candidates
  • Pass stage one JavaScript telephone interviews
  • Prepare for working on complex frontend frameworks like React, Vue, Svelte or Angular.
English What does ‘use strict’ do? What does ‘use strict’ do? This is one of the first questions I ask in the interview, it’s quite a nice ice breaker. It’s a simple question I expect you to know the answer to this one and even though it’s a simple question you can still impress the interviewer by showing a deep understanding of the keyword and its effects. What is strict mode? Strict mode allows you to place a program or a function in what’s called a strict operating context. I’m going to explain what this means with a series of examples but in a nutshell it makes debugging easier. Code errors that would otherwise have been ignored or would have failed silently will now generate errors or throw exceptions. This alerts you sooner to problems in your code and directs you quickly to the probable source. The first thing you should talk about is just really how to switch it on. How do you enable strict mode in a JavaScript file? One of the ways you do that is actually type in the string ‘use strict’ and put it at the top of your JavaScript file. If you get asked in the interview to write down and sometimes I do ask the students to write it out. Remember don’t write it out like use strict. It is not a special keyword called ‘use’ and a special keyword called ‘strict’. It is a string. You might ask, why is it a string? That seems a bit strange really and the answer is actually quite simple. When the feature was first thought up and implemented older browsers didn’t support it, only the newer browsers supported it. If they decided to use the keyword ‘use’ and the keyword ‘strict’ when this file was loaded up in an older browser, a browser that didn’t know about ‘use strict’ it would have failed. What they did was they just put it as a string so if an older browser read this file it would just say, “There’s a string at the top it’s not really doing anything and fine I’ll just ignore it.” In a newer browser when it sees the keyword, ‘use strict’ it then knows to turn itself into strict mode operating context. This is one way in which you can tell JavaScript to treat your code in strict mode. Doing it this way will apply to all of the code within this file. but there is one other way. If you were perhaps working on legacy JavaScript code very very old JavaScript code I doubt seriously that you’ll actually be in the situation anymore because ‘use strict’ has been in place for a very long time now. But just so you have complete knowledge it is actually possible to only apply strict mode to parts of your code by adding “use strict” to the top of a function block then anything underneath there is in strict mode, anything outside of there is in non-strict mode. Now I’ve shown you how to switch it on. What’s the point, what is the point of ‘use strict’ mode and really what does it do? One of the first things is that in ‘use strict’ mode using a variable before it’s been defined now causes an error. Without strict mode assigning a value to an undeclared variable so your variable asim is not being declared anywhere in this file before automatically creates a a global variable with that name. In JavaScript there’s always a global object and that’s where all the global variables and global functions go In a browser the global object is 'window' but if you’re using this inside node the global object is an object called 'global'. By just declaring asim is equal to one, what we’ve actually done is we’ve created a global variable, a global property on the global variable window called asim and we’ve assigned a value of one to it. You can see in the console it actually prints out this is the line that it’s printing out. So it’s printing out the one. Okay, awesome. Why is that a bad thing? Why is that annoying? Let me show you a specific example as to when that can be incredibly frustrating. Let’s imagine in my application I’ve declared a variable called theVal. I’ve declared it properly using theVal keyword at the top of my file and I’ve assigned it the value of zero and then later on in my application I then decide to change the value of my theVal variable to one but I make a silly mistake instead of typing theVal, I type ‘thval’ and I miss out the ‘e’. Then finally I use my variable ‘theVal in an ‘if’ statement since I think I’ve set it to one I’m pretty sure I’ve set it to one. I would expect it to print out ‘Hello’ but actually hello doesn’t get printed out. I then spend ages trying to figure out what’s going on. I then figure out it’s actually a syntax error. I meant to have set ‘theVal’ and then I finally get my application to work and to print ‘Hello’. So we’ve all been hit by these issues before many times they are incredibly frustrating. If we were to have used the use strict mode, let me go to the top, and then I refresh. Now it gives us an error, it gives us an error because you cannot use a variable without first declaring it with var first. I did declare with var at the top I thought I was using ‘theVal’ here but I wasn’t so it thinks I’m trying to declare a new variable called ‘theVal’ without using the var keyword so it gives us an error. This is really useful because this tells me up front that I’ve got problems with the syntax in my application and I’m not going to waste hours if not days trying to track down this problem where ‘hello’ is not getting printed. then here I might just type theVal’ that’s fine and then press refresh and the application runs as I expect it to run. By forcing you to only use variables that have been declared with the var keyword this prevents accidental globals and head scratchy syntax error problems like the one I’ve just demonstrated to you. Another feature of ‘use strict’ is it stops you from using words that are reserved for future versions of JavaScript. Let me give you an example, so if I do var let is equals to one, let me refresh and that’s fine. That’s not causing any problems but then if I add ‘use strict’ to the top you can see now it gives me another error, it says, unexpected strict mode reserved word so this is var let. The reason it’s giving me this error is because the keyword let is actually reserved for future versions of JavaScript. In fact it’s currently in use in the ECMA script six version of JavaScript. Another feature of ‘use strict’ is you cannot delete functions, variable or functions arguments in use strict mode. Let me show so normally if you just typed var foo is equal to one and then I try to delete foo, JavaScript doesn’t complain about that. Similarly, if I created a function called moo I try to delete that function so in non-strict mode you can also delete a function. When we go into use strict mode you can see there it doesn’t let us the delete variables and again it doesn’t let us delete functions. Another feature of use strict is it doesn’t let you delete arguments to functions. For instance let’s take function moo if we try to delete arg, there we go so now it doesn’t allow us to delete arguments to functions as well. Another thing I’m going to talk about is the keyword eval and use strict mode. It makes the eval keyword a little bit safer. In non-use strict mode you can do things like you use the word eval as a variable or as a function and it’s perfectly happy with that. In use strict mode this now causes an error also it makes the actual act of calling eval a bit safer. If you know eval what it does is it lets you evaluate JavaScript expressions by just passing in a string. So it lets you execute just arbitrary bits of JavaScript code type in 'var a = 1' this executes 'var a = 1', but in non-use strict mode the variable a leaks out of the eval expressions so if I then want us to do, you can see there it’s printing out the value of A which is actually created or defined within the eval block. You can imagine there maybe situations where this can cause security issues or just a pollution of your own namespace. So this can cause problems if you perhaps are depending on a variable called A or perhaps you declare a variable called A above as two and you expect it to actually print out two at the bottom but you didn’t realize that the eval block is something is actually re-declaring the variable A to one. So these are some of the problems which you can have with the eval function and non use strict mode. But when we go to use strict, what happens is any variables that you define inside the eval code only exists within the eval code and don’t leak out. So when you print console log A here it’s actually printing out the value of A outside the eval block. Even if you didn’t have A they would just say A is not defined. So again it just makes the eval a bit safer to use. It is a very very powerful feature of JavaScript but also very dangerous feature of JavaScript so you should treat it with the respect it deserves.