Shulou(Shulou.com)06/03 Report--

This article is to share with you about how to use es6 to declare variables, the editor thinks it is very practical, so I share it with you to learn. I hope you can get something after reading this article.

Methods of declaring variables: 1, use the var command, syntax "var variable name;"; 2, use function command; 3, use cosnt command, syntax "const variable name"; 4, use let command, syntax "let variable name"; 5, use import command; 6, use class command.

The operating environment of this tutorial: windows7 system, ECMAScript version 6, Dell G3 computer.

ES5 has only two ways to declare variables: the var command and the function command.

In addition to adding let and const commands, ES6 has two ways to declare variables: the import command and the class command.

Therefore, there are six ways to declare variables in ES6-1.

(1) var command

Var a; / / undefinedvar b = 1

Variables defined by var can be modified. If not initialized, undefined will be output and no error will be reported.

The variable declared by var is on window. Use let or const to declare the variable. This variable will not be placed on window.

There are block-level scopes in many languages, but JS does not. It uses var to declare variables and demarcates scopes by function. Curly braces "{}" do not limit the scope of var, so variables declared with var have the effect of variable promotion.

The variable scope declared by var is global or functional

(2) function command

Function add (a) {var sum = a + 1; return sum;}

A new variable named add is declared and assigned a function definition

The content between {} is assigned to add

The code inside the function is not executed, but is stored in variables for future use

(3) cosnt command

Const a; / / error report, const b = 1 must be initialized

Variables defined by const cannot be modified and must be initialized

The variable is a global variable, or a global variable within a module

If a variable is assigned only once when declared and never reassigned in other lines of code, const should be used, but the initial value of the variable may be adjusted in the future (constant)

Create a read-only constant that is immutable on different browsers; it is recommended not to modify it after declaration; has block-level scope

Const represents a constant index of a value, that is, the pointer to the variable name in memory cannot be changed, but the value pointing to the variable may change.

The variables defined by const cannot be modified. Generally, some global constants are used or defined when require a module.

You can declare a constant in a global scope or within a function, but you must initialize the constant

A constant cannot have the same name as any other variable or function in its scope

(4) let command

Let a; / / undefinedlet b = 1; function add (b) {let sum = b + 1; return sum;} let c = add (b)

"javascript strict mode" is required: 'use strict'

There is no variable promotion.

Repetition is not allowed.

The variable scope declared by let is in the block-level domain. After using let definition inside the function, it has no effect on the outside of the function (block-level scope).

You can assign a value to a variable when you declare it, with a default value of undefined, or you can assign a value to the variable later in the script, which cannot be used before life (temporary dead zone)

(5) import command

1. ES6 introduces its own module system. Export through export and import by import.

2. Unlike CommonJS, it gets a reference to the module and does not really get the value until it is used.

3. For example, in js:

Let student = [{name: 'xiaoming', age: 21,}, {name:' xiaohong', age: 18}] export default student; / / this export method, you can specify its name when you import.

4. In app.js, we can use this:

Import StudentList from'. / student.js'; / / specify the name console.log (StudentList [0] .name); / / xiaoming

(6) class command

1:class, as the grammatical sugar of es6, can actually be realized by es5.

Class Point {constructor (x, y) {this.x = x; this.y = y;} toString () {return this.x +','+ this.y;}} / / above is a class Object.assign (Point.prototype, {getX () {return this.x;}, getY () {return this.y;}}) let p1 = new Point (1Jue 2) Console.log (p1.toString ()); / / 1 console.log (p1.getX ()); / / 1 console.log (p1.getY ()); / / 2 console.log (Object.keys (Point.prototype)); / / ["getX", "getY"]

No comma separation is required between methods

ToString () {} is equivalent to toString: function () {}

You can still use Point.prototype

You can extend many methods at once with Object.assign ().

Most of the internal definition methods of a class cannot be enumerated.

Constructor () {} is a default method, and if it is not added, an empty one is automatically added.

Constructor returns instance objects (this) by default, and you can specify other objects to be returned.

Must be called with new

There is no variable promotion.

When you use a variable to accept class, you can omit classname

Es6 does not provide private methods.

2: use extends inheritance

Class ThreeDPoint extends Point {constructor (x, y, z) {console.log (new.target); / / ThreeDPoint super (x, y); this.z = z;} toString () {return super.toString () +','+ this.z;} static getInfo () {console.log ('static method');} get z () {return 4 } set z (value) {console.log (value);}} ThreeDPoint.getInfo (); / / "static method" let ta = new ThreeDPoint (2 console.log (ThreeDPoint)); console.log (ta.toString ()); / / 4 ta.z = 200; / / 200 console.log (Object.getPrototypeOf (ThreeDPoint)); / / Point

Super must be called in constructor because there is no this in the subclass and must inherit from the parent class.

The _ _ proto__ attribute of a subclass always points to the parent class

The _ _ proto__ of the prototype attribute of a subclass always points to the prototype of the parent class

Object.getPrototypeOf () gets the parent class

Super as a method can only be used in constructor

Super points to the prototype of the parent class as an attribute.

When you use super.x = 2 in constructor, you actually have this.x = 2, but when you read super.x, it becomes the parent class .prototype.x.

Native constructors cannot be inherited.

The get set method can intercept the assignment and reading of attributes

Static methods cannot be inherited by instances. Declare through static

Static attributes can only be declared with ThreeDPoint.name = "123" (nothing to do with static)

The above is how to use es6 to declare variables. The editor believes that there are some knowledge points that we may see or use in our daily work. I hope you can learn more from this article. For more details, please follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.