This is the 10th day of my participation in the August Text Challenge.More challenges in August

ECMAScript 6.0 (ES6) is the next generation standard for the JavaScript language, which was officially released in June 2015. Its goal is to make JavaScript an enterprise-level development language that can be used to write complex, large-scale applications.

Let and const

In the old ES5, we defined variables, and the var used in the function caused the variable to be promoted, so we added let and const syntax in ES6. Next, I’ll show you in code

var a=[]
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6] ()var b = [];
for (let j = 0; j < 10; j++){ b[j] =function () {
    console.log(j)
  }
}
b[6] ()/ / output:
10
6
Copy the code

The only difference is that I in the for loop, j is defined differently, where I is defined as a global variable, and I is 10 at the end of the for loop. J, defined below, is a local variable, valid only in the scope of for () {}, hence the result above.

In addition, the setting of the for loop variables inside the parentheses is the parent scope, and the body of the loop is the child scope. — Introduction from teacher Ruan Yifeng’s blog

var
var
var a
a
undefined
a
a
undefined
let
/ / error ReferenceError


Temporary dead zone

typeof



let

Block scope

In ES5, there were only global and local scopes, which brought a lot of unreasonable scenarios, so now ES6 has proposed block scopes, emphasizing the specification

Ruan Yifeng -let and const

About function declarations

ES5 specifies that functions can only be declared in top-level or function scopes, not block-level scopes. However, the browser still supports declaring functions in the block-level scope without error.

ES6 introduces block-level scope, stipulating that functions outside the block-level scope cannot be referenced within the scope

function fnc() { 
   console.log('I am outside! ');
   }
(function () {
  if (0) {
    function f() { console.log('I am inside! '); } } f(); } ());Copy the code

The above code in ES5 will print I am inside! If (f = undefined); if (f = undefined); if (f = undefined);

  test.js:10
  f();
  ^
TypeError: f is not a function
Copy the code

The reason is that ES6 specifies in Appendix B that browser implementations can behave in their own way, regardless of the above rules.

  • Allows functions to be declared in block-level scopes.
  • Function declarations are similar to var in that they are promoted to the global scope or to the head of the function scope.
  • Function declarations are also promoted to the head of their block-level scope.

Const command

Const declares a read-only variable that cannot be changed or redefined and is assigned immediately. Const also has temporary dead zones and block-level scope. Similar to let before

That is, if a const defines an array or an object, the array push() and push() methods are still in effect, and the object’s properties are set properly. However, assigning to an array or an object that is const again will cause an error. If the freeze is permanent and cannot be changed, there is a freeze method called Object.freeze

If there is the following definition:

const foo = Object.freeze({});
foo.prop = 123;
Copy the code

Normal mode will not work, while strict mode will report an error.

ES6 there are 6 ways to declare variables

  • var
  • function
  • let
  • const
  • import

    • Detailed introduction

  • class

    • Detailed introduction

GlobalThis object

ES6 also introduced globalThis, which represents top-level objects such as window in a browser, Self in a WebWorker, and Global in a Node

This article mainly refers to introduction to ECMAScript6 by Yifeng Ruan (1).