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

What are the knowledge points of this article "es6 declaration of variables?" most people do not understand, so the editor summarizes the following contents, detailed contents, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "es6 method of declaring variables" article.

Es6 declares variables in six ways: 1, declare variables with the keyword var; 2, declare variables with the keyword function; 3, declare variables with the keyword const; 4, declare variables with the keyword let; 5, declare variables with the keyword class; 6, declare variables with the keyword import.

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. Declare variables with the keyword var

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. Declare variables with the keyword function

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. Declare variables with the keyword const

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. Declare variables with the keyword let

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. Declare variables with the keyword class

Later on, I will write a separate article about class, which will be introduced in detail. Here is a brief introduction: first, look at the constructor in ES5, and then use ES6's class to implement it:

/ / ES5: function fun (x, y) {this.x = x; this.y = y;}; fun.prototype.GetHair = function () {return `${this.x} lost two hairs, ${this.y} said me too! `;}; let setHair = new fun ('Xiaoming', 'Lao Wang'); console.log (setHair.GetHair ()); / / Xiaoming lost two hairs, Lao Wang said I was the same!

Let's take a look at ES6's class writing:

Class Interest {constructor (x, y, e, z) {this.x = x; this.y = y; this.e = e; this.z = z;} MyInterest () {let arr = []; console.log (`I will ${[... arr,this.x,this.y,this.e,this.z]}! `) } let GetInterest = new Interest ('sing', 'jump', 'rap',' basketball'); console.log (GetInterest.MyInterest ()); / / I can sing, dance, rap, basketball!

ES6's class can be regarded as a syntax sugar, most of its functions can be done by ES5, the new class writing only makes the object prototype written more clearly, more like the syntax of object-oriented programming, the constructor method is the construction method, and the this keyword represents the instance object. This is the constructor Point of ES5, which corresponds to the constructor of the Point class of ES6.

6. Declare variables with the keyword import

Import is used to load files, receiving one or more variable names in curly braces, which need to be the same as the variable names you want to import.

For example, Chestnut: you want to import a variable in the action.js file, and a block of code is saved in this variable, so you have to write: import {Button} from 'action', you get a variable called Button from action.js, and now that you have it, you can obscene the code in Button for

If you want to rename the entered variable, the import command uses the as keyword to rename the entered variable, such as:

Import {NewButton as Button} from 'action.js'

The above code shows that you get a code snippet with the name of a variable called Button from the action.js file, and then you declare a variable NewButton to save the Button in NewButton

The above is about the content of this article on "what are the methods for es6 to declare variables?" I believe we all have a certain understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, 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.