Friday, April 10, 2020

The Basics of JS Must Know “Strict Mode 'use strict'”


JS's strict mode'use strict'should be familiar with knowledge, literally to explain is to follow strict behavior patterns to Write code. But what are the rules that constrain us to use strict mode to regulate our own code during development? So the purpose of this article is simply to deepen the understanding of the strict model once again. Although this article is the basics, I hope it helps you.

Definitions of Strict Mode

use strict is a (strict) running mode added to ECMAscript5, which makes Javascript Operate in stricter conditions. The implementation of strict mode makes your program or function follow a strict operating environment.

The purpose of establishing the “strict model” is to:

  • Eliminate some unreasonable and inrigorous aspects of Javascript syntax and reduce some weird behavior;
  • Eliminate some insecure aspects of code operation and ensure the safe operation of code;
  • Improve compiler efficiency and increase running speed;
  • Padders
  • for future versions of Javascript.

Use of strict mode

Enable strict mode for scripts

To open strict mode for the entire script file, you need to put a specific statement “use strict”before all statements; (or 'use strict';)

 // syntax for opening strict mode for the entire script
“ use strict”;
var v =  “Hi! I'm a strict mode script!” 
;
This syntax is stuck if you merge a script in strict mode with a script in non-strict mode: the merge appears to be strict mode. And vice versa: non-strict merging is strictly seeming non-strict. It is therefore recommended to either switch on strict mode or not use non-strict mode.

Enable strict mode for functions

To turn on strict mode for a function, you have to put “use strict”; (or 'use strict' ;) declarations are placed without leakage before all statements of the function body.

 function  strict ( ) {
 // function level strict mode syntax
 'use strict';
 function  nested ( ) { 
 return ” And so am I!” ; 
 }
 return ” Hi! I'm a strict mode function!  “ + nested ();
}

function  notStrict ( ) { 
 return ” I'm not strict.” ; 
}

Specifications for Strict Mode

variable

Rules for using variables in strict mode

  1. Do not allow accidental creation of global variables
  2. Declaring variables cannot be deleted using delete operator
  3. Do not use reserved words (e.g. implements, interface, let, package, private, protecte, public, static, and yield identifiers) as variable names

Rule 1

 // create a global variable called message
message = “Hello JavaScript! “; //this line will throw ReferenceError 

Rule 2

 var x;
delete x; //!!! syntax error

eval(” var y; delete y;”); //!!! syntax error

Rule 3

 var private = 123; // !!! syntax error
var public = ' hello '; //!!! syntax error

object

Rules for using objects in strict mode

  1. A value for a read-only attribute throws TypeError
  2. Using the delete operator on non-configurable properties throws TypeError
  3. Adding properties to non-extensible objects throws TypeError
  4. When using object literal, attribute names must be unique

Rule 1

 // give a value to the read-only property
var obj2 = { get x () { return  17;}};
obj2.x = 5; // Throw TypeError error

// give a value to a non-writing property
var obj1 = {};
Object.defineProperty (obj1, “ x”, {  value: 42, writable:   false});
obj1.x = 9; // Throw TypeError error

Rule 2

  delete Object.prototype; // Throw TypeError error

Rule 3

 // give a value to the new property of an object that is not expensible
var fixed = {};
Object.preventExtensions (fixed);
fixed.newProp = “ohai”; // Throw TypeError error

Rule 4

  var o = {  p: 1, p: 2 }; //!!!! syntax error

Functions

Rules for using functions in strict mode

  1. Requires unique parameters for named functions
 function  sum ( a, a, c){ //!!! syntax error
 return a +a+c; // code running here will go wrong
}

eval vs. arguments

Rules for using eval and arguments in strict mode

  1. eval does not create variables or functions in the context of
  2. eval and arguments cannot be bound or assigned by program syntax
  3. The value of the parameter does not change as the value of the arguments object changes
  4. The use of arguments.callee is prohibited
 function  doSomething ( ) {
 eval(” var x=10");
 alert (x); //Throw TypeError error
}

Rule 2All attempts below will cause a syntax error:


 eval =  17;
arguments++;
++eval;
var obj = { set p (arguments) {}};
var  eval;
try {} catch ( arguments) {}
function  x ( eval){}
function  arguments ( ) {}
var y = function  eval ( ) {};
var f = new  Function (“arguments”, “ 'use strict'; return 17;”); 

Rule 3

 function  f ( a){
 a = 42;
 return [Aa arguments[ 0]];
}
var pair = f ( 17);
console.assert (pair [ 0] ==42 );
console.assert (pair [ 1] ===17 );

Rule 4

 var f = function (){ 
 return arguments.callee; 
};
f (); //throw a type error

Suppressing traversing the call stack inside a function

 function  restricted ( ) {
 restricted.caller; //throws a type error
 restricted.arguments; //throw a type error
}

Static Bindings

  1. Prohibit the use of the with statement
  2. eval () declaration variables and functions are valid only in the scope of the current eval

Rule 1

 var x =  17;
with (obj) { //!!! syntax error
 // If strict mode is not enabled, the x in with will point to the x above with, or obj.x? 
 // If you don't run the code, we can't know it, so this code does not allow the engine to be optimized, and the speed will change. Slow. 
 x;
}

Rule 2

 var result = eval(” var x=10, y=11; x+y”);
alert (result); //21

this points to

    This
  1. in a function in a global scope no longer points to global but undefined.
  2. If you forget to add new when using the constructor, this no longer points to the global object, but instead undefined
 // Rule 1
function  bar ( ) {
 console.log ( this)
}
bar () //undefined


// Rule 2
function  Person ( ) {
 this.name= “ Vincent” // Uncaught TypeError: Unset property 'name' of undefined
}

Person () //error is reported. If you forget to add new, this no longer points to global object, but undefined.name. 

summary

Now a lot of people are working with various frameworks and tools, but in fact, there is no problem in our development, because it brings efficiency gains. But all things can grow without root, so the foundation is always the basic core. I also know that everyone's time is limited, and it's not enough to take care of it. But I recommend taking some time on the basis, even if it takes 10 to 20 minutes a day to take a look at the basics, because every time I read it, there will be a certain gain.

I don't have a good technical skills or a solid foundation, so I remind myself every day not to stop moving forward.


### References
- [ JavaScript Advanced Programming (3rd Edition)] ( https://item.jd.com/10951037.html)
- [Strict Mode MDN] ( https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Strict_mode 
)

No comments:

Post a Comment