Strict Mode in JavaScript

JAVACRIPT’s strict mode, introduced in ECMAScript 5, is a way to opt in to a restricted variant of JAVACRIPT.

Strict mode is not just a subset: it intentionally has different semantics from all other normal code.

Some browsers does not support strict mode.

To run strict mode code with different behavior from browsers need to test for support for the relevant aspects of strict mode.

Strict mode code and non-strict mode code can be co existing, so scripts can opt into strict mode incrementally

Strict mode makes many changes to normal JavaScript semantics:

Eliminates some JavaScript silent errors by changing them to throw errors.
Fixes mistakes that make it difficult for JavaScript engines to perform optimizations: strict mode code can sometimes be made to run faster than identical code that’s not strict mode.

The “use strict”; Syntax

For declaring strict mode the syntax was designed to be compatible with of JS.

Compiling a numeric literal (10 + 15;) or a string literal (“Ram Das”;) in a JS program has no side effects.

It will simply compiles to a non existing variable and it will dies.

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

Simplifying variable uses

Strict mode simplifies how variable names map to particular variable definitions in code.

This is critical to fully optimizing JS code.

JS makes this basic mapping of name to variable definition in the code impossible to perform until runtime.

Strict mode will removes most cases where it will happens, so the compiler can better optimize strict mode code.

First, strict mode prohibits with.

The problem with with is that any name inside the block might map either to a property of the object passed to it, or to a variable in surrounding (or even global) scope, at run time, Strict mode makes with a syntax error, so there’s no chance for a name in a with to refer to an unknown location at run time.

Example

'use strict';
varjsx = 17;
with (obj) { // syntax error
  // If this weren't strict mode, would this be varjsx, or
  // would it instead be obj.jsx?  It's impossible in general
  // to say without running the code, so the name can't be
  // optimized.
jsx;
}

'use strict';

varjsx = 17;

with (obj) { // syntax error

// If this weren't strict mode, would this be varjsx, or

// would it instead be obj.jsx? It's impossible in general

// to say without running the code, so the name can't be

// optimized.

jsx;

}

JavaScript allows strictness of code using “use strict”. Write “use strict” at the top of JavaScript code or in a function to run strict mode.

Example

<html>

<body>

    <p id="JSerrorMessage"></p>

    <script>
        "use strict";
        try {
            varjsx = 1; // valid in strict mode
            jsy = 1; // error
        } catch (ex) {
            document.getElementById("JSerrorMessage").innerHTML = ex;
        }
    </script>

</body>

</html>

<html>

<body>

"use strict";

try {

varjsx = 1; // valid in strict mode

jsy = 1; // error

} catch (ex) {

document.getElementById("JSerrorMessage").innerHTML = ex;

}

</script>

</body>

</html>

Output

ReferenceError:jsy is not defined

1	ReferenceError:jsy is not defined

Defines that JavaScript code should be executed in “strict mode”.

“use strict” is to indicate, the code should be executed within “strict mode”.

Declaring Strict Mode

Strict mode is declared by adding “use strict”; to the beginning of a script or a function.

Example

<html>

<body>
<html>

<body>
    <script>
        "use strict";
        jsx = 3.14; // This will cause an error (jsx is not defined).
    </script>

</body>

</html>

<html>

<body>

<html>

<body>

"use strict";

jsx = 3.14; // This will cause an error (jsx is not defined).

</script>

</body>

</html>

Declared inside a function

<html>

<body>

    <script>
        jsx = 3.14; // This will not cause an error.
        myFunction();

        functionmyFunction() {
            "use strict";
            jsy = 3.14; // This will cause an error (jsy is not defined).
        }
    </script>

</body>

</html>

<html>

<body>

jsx = 3.14; // This will not cause an error.

myFunction();

functionmyFunction() {

"use strict";

jsy = 3.14; // This will cause an error (jsy is not defined).

}

</script>

</body>

</html>