Javascript: Why 'use strict';
Tags: javascript, webdev, discuss
Published: 2022-03-05 15:23:20

Every concept in Javascript has too much information to keep in mind. Even `"use strict;"` as well. I can write lengthy article on it but I am a kind of guy usually ignore lengthy theoretical articles. So, this time I want to write article in different way but like one stop for `"use strict;"`. No further words. Let's start:

## What is `"use strict;"`?

To indicate code should run in `strict mode` - Thatz it. Yes 😊

## How to use?
Everywhere in article writing it as `"use strict;"`. Just place the same to the beginning of function or script.

## When it is introduced in Javascript?
Do we really required?🧐 anyhow, In <u>ES 5</u>.

Please don't ask me, who introduced it. 😛

## why do I use?
It makes to write `secure` Javascript. Short answers are not accepted for questions starting with `Why`😳.

Alright, Let's go deep but no theory.

<table>
<tr>
<th>S.No</th>
<th>Action</th>
<th>Example</th>
<th>Strict Mode</th>
<th>Non - Strict Mode</th>
<th>Fix</th>
</tr>
<tr>
<td>1</td>
<td>Using variable without declaring it</td>
<td>{% embed https://gist.github.com/K-Vishwak/458b1f2af20bcd780d304a65905363a4 %}
</td>
<td>
Uncaught ReferenceError: a is not defined
</td>
<td>3.14</td>
<td>{% embed https://gist.github.com/K-Vishwak/8ec546d3d63e0d9b4a2df7337d77449f %}</td>
</tr>
<tr>
<td>2</td>
<td>Deleting a variable</td>
<td>{% embed https://gist.github.com/K-Vishwak/78f664fb94cc8493bdafb4718523c63f %}</td>
<td>Uncaught SyntaxError: Delete of an unqualified identifier in strict mode.</td>
<td>false</td>
<td>It can't be deleted. Variables created without var, let & const are deleted using delete.</td>
</tr>
<tr>
<td>3</td>
<td>Duplicate function params</td>
<td>{% embed https://gist.github.com/K-Vishwak/5720030cddacabb44f9ae937cfa4cc41 %}</td>
<td>Uncaught SyntaxError: Duplicate parameter name not allowed in this context</td>
<td>10 10</td>
<td>{% embed https://gist.github.com/K-Vishwak/ef067a830af612cc6db46ffddaecdc09 %}</td>
</tr>
<tr>
<td>4</td>
<td>Octal numeric literals</td>
<td>{% embed https://gist.github.com/K-Vishwak/a077473234946d6094ba82a6c819ffcf %}</td>
<td>Uncaught SyntaxError: Octal literals are not allowed in strict mode.</td>
<td>8</td>
<td>{% embed https://gist.github.com/K-Vishwak/32adbd3629cb8ed929bd263730a7e609 %}</td>
</tr>
<tr>
<td>5</td>
<td>Using variable name as eval or arguments</td>
<td>{% embed https://gist.github.com/K-Vishwak/9f245f9bc8986c29e8c1a309bb713ac2 %}</td>
<td>Uncaught SyntaxError: Unexpected eval or arguments in strict mode</td>
<td>10 20</td>
<td>{% embed https://gist.github.com/K-Vishwak/2d00fffba970246da96bb5166a32767b %}</td>
</tr>
<tr>
<td>6</td>
<td>`this` inside function - refers to the object that called the function.</td>
<td>{% embed https://gist.github.com/K-Vishwak/904eacdeefa0e0c93db9aaf0961d9294 %}</td>
<td>undefined</td>
<td>Returns window object: Window {0: Window, 1: Window, 2: global,......</td>
<td>Avoid using this inside functions to not to expose window object.</td>
</tr>
<tr>
<td>7</td>
<td>Creating variable with `eval`</td>
<td>{% embed https://gist.github.com/K-Vishwak/d7ad0624d4175c633cf1e3be68a5a706 %}</td>
<td>Uncaught ReferenceError: a is not defined</td>
<td>10</td>
<td>Avoid using eval.</td>
</tr>
<tr>
<td>8</td>
<td>Using `with` statement</td>
<td>{% embed https://gist.github.com/K-Vishwak/b1289a8b21f97bde8b0aad2a105a323a %}</td>
<td>Uncaught SyntaxError: Strict mode code may not include a with statement</td>
<td>20</td>
<td>Avoid using it</td>
</tr>
<tr>
<td>9</td>
<td>Deleting undeletable property</td>
<td>{% embed https://gist.github.com/K-Vishwak/6c1c608f1a6cc71f178638851dcae92b %}</td>
<td>Uncaught TypeError: Cannot delete property 'prototype' of function Object() { [native code] }
    at <anonymous>:2:1</td>
<td>false</td>
<td>Avoid it</td>
</tr>
<tr>
<td>10</td>
<td>Using Octal Escape characters</td>
<td>{% embed https://gist.github.com/K-Vishwak/99a2ff0d0d4d8d0725d27cdac3ff642e %}</td>
<td>Uncaught SyntaxError: Octal escape sequences are not allowed in strict mode.</td>
<td>Returns nothing</td>
<td>Avoid it </td>
</tr>
<tr>
<td>11</td>
<td>Writing to read only property</td>
<td>{% embed https://gist.github.com/K-Vishwak/4178cf36cafe671f16fcc46a2f772ee0 %}</td>
<td>Uncaught TypeError: Cannot assign to read only property 'a' of object '#<Object>'</td>
<td>10</td>
<td>{% embed https://gist.github.com/K-Vishwak/f369128deb1e0f342eb03b6e13208a21 %}</td>
</tr>
<tr>
<td>12</td>
<td>Writing to get only property</td>
<td>{% embed https://gist.github.com/K-Vishwak/b74fe4c84336292f91990936db88b2c1 %}</td>
<td>Uncaught TypeError: Cannot set property test of #<Object> which has only a getter</td>
<td>FIRST</td>
<td>{% embed https://gist.github.com/K-Vishwak/db8a66659662d3177225b4bb609bff1f %}</td>
</tr>
<tr>
<td>13</td>
<td>Using variable as reserved keywords</td>
<td>{% embed https://gist.github.com/K-Vishwak/05b09ebfc78e3ace41e964a837a370b6 %}</td>
<td>Uncaught SyntaxError: Unexpected strict mode reserved word</td>
<td>10</td>
<td>Avoid using reserved keywords as variables</td>
</tr>
</table>

Oops, it took whole day to write. Anyhow, please do comment if I miss any or in case of improvements.

Thanks.

<hr style="border-width: 2px;border-color: #87CEEB;">
<h1> 💎 Love to see your response</h1>
<ol>
<li style="padding: 10px;font-size: 30px;"><b>Like</b> - You reached here means. I think, I deserve a like.  </li>
<li style="padding: 10px;font-size: 30px;"><b>Comment</b> - We can learn together. </li>
<li style="padding: 10px;font-size: 30px;"><b>Share</b> - Makes others also find this resource useful.</li>
<li style="padding: 10px;font-size: 30px;"><b>Subscribe / Follow</b> - to stay up to date with my daily articles. </li>
<li style="padding: 10px;font-size: 30px;"><b>Encourage me</b> - <a href="https://www.buymeacoffee.com/urstrulyvishwak" target="_blank">You can buy me a Coffee</a>
</ol>
<hr style="border-width: 2px;border-color: #87CEEB;">

<h2> Let's discuss further. </h2>

<ol style="padding: 20px;">
<li style="padding: 10px;font-size: 30px;">Just DM <br> <a href="https://twitter.com/messages/compose?recipient_id=1388837509824610314&text=Hello world"
class="twitter-dm-button" data-screen-name=“@urstrulyvishwak” data-size="large">@urstrulyvishwak</a>
</li>
<li style="padding: 10px;font-size: 30px;">
<p> Or mention <br> <a href="https://twitter.com/intent/tweet?screen_name=urstrulyvishwak&ref_src=twsrc^tfw" class="twitter-mention-button" data-size="large" data-text="Hi, Vishwak" data-related="@urstrulyvishwak" data-show-count="false">@urstrulyvishwak</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script></p> </li>
</ol>

<h2> For further updates: </h2>
<a href="https://twitter.com/urstrulyvishwak?ref_src=twsrc^tfw" class="twitter-follow-button" data-size="large" data-text="Hi, Vishwak" data-related="@urstrulyvishwak" data-show-count="false">Follow @urstrulyvishwak</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>