JavaScript Es2015 Experience Basics Summary

One, the difference between the scope Var and the let in Es6.
1. var is the keyword that defines global variables in JavaScript
2. Let is a keyword that defines a variable in the ES6 syntax but the Let variable is a block-level scope (it can only be used within its own block, which is used outside the curly braces)

Instance (Var):
' Use strict ';
if (true) {
var a= "Apple";
}
Console.log (a); Console output Apple

Instance (let)
' Use strict ';
if (true) {
Let a= "Apple";
}
Console.log (a); Console output A is not defined

Second, const constants (also following block-level scopes)
1. var creates a variable (that is, a variable that can be created two times)
2, Const creates a constant (once created cannot be repeated assignment (meaning that the action of this duplicate declaration cannot occur))

Instance (const):
' Use strict '
Const FRUIT = "Apple";
Console.log (fruit); Console output Apple
Const FRUIT = "banana";
Console.log (fruit); Console output Duplicate decalaration "fruit" repeated statements fruit error

Because for the first time, the fruit was created using the const create constant, so you cannot repeat the declaration.

Note: The limit is to measure the assigned value of this action, not the limit worth changing
Instance (constant of the array)
' Use strict '
Const FRUIT = [];
Fruit.push ("Apple");
Fruit.push ("banana");
Console.log (fruit); will contain apples [0] and bananas in the console output as an array [1];

Instance (re-declaring the constant is wrong)
' Use strict '
Const FRUIT = [];
Fruit.push ("Apple");
Fruit.push ("banana");
fruit = []; This action again declares the constant fruit.
Console.log (fruit); Will error repeat statement.

Third, the use of the structure in the ES6 array allocation
1, the value of the traditional JavaScript array we print in the console, we need to use the array name [subscript] to print
2, in Es6, we can use let to define the array structure, to specify the return value of an array-by-assignment

Example (traditional JavaScript method)
function Breakfast () {
return [' Apple ', ' drink ', ' cake '];
}
var tmp = breakfast (), dessert = tmp[0], drink = tmp[1], fruit = tmp[2];
Console.log (dessert, drink, fruit);

Instance (the structure of the ES6 is used)
function Breakfast () {
return [' Apple ', ' drink ', ' cake '];
}
Let [dessert, drink, fruit] = breakfast (); Defines an array variable method after the return value is added to each one in turn
Console.log (dessert, drink, fruit);

Iv. ES6 Objects
Example (ES6)
function Breakfast () {
return {drink: "Orange", Dessert: "Cake", Fruit: "Apple"}
}
Let {drink:a, dessert:b, fruit:c} = breakfast ();
Console.log (A, B, c);

Note: The A in this let is the variable drink is the attribute in the created object above and the traditional JavaScript object is the opposite variable

Example (traditional JavaScript)
function Breakfast () {
return {drink: "Orange", Dessert: "Cake", Fruit: "Apple"}
}
var tmp = breakfast (), a=tmp.drink,b=tmp.dessert,c=tmp.fruit
Console.log (a);
Console.log (b);
Console.log (c);

V. Character templates template string in Es6

Instance (traditional string connection variable)
Let dessert = "apple", drink = "cake";
Let breakfast = "Today's breakfast is" + dessert + "with" + "drink" + "! ";
Consloe,log (breakfast);

Instance (es6 template string connection variable)
Let dessert = "apple", drink = "cake";
Let Breakfast1 = ' Today's breakfast is ${dessert} with ${drink}! `;
Console.log (BREAKFAST1);

Six, define the string template label (there will be a function where there are two parameters a string representing the original string value representing the template character variable)

Example (output of two parameters observed)

Let dessert = "cake", fruit = "Apple";
Let breakfast = Kenchen ' Today's breakfast is ${dessert} with ${fruit}! ` ;
function Kenchen (string, ... value) {
Console.log (string); The output is an array of strings [0: Breakfast eaten today is, 1: with, 2:!]
Console.log (value); The output is a template variable worth the array [0:cake,1:apple]
}

Instance (output breakfast via template label)
Let dessert = "cake", fruit = "Apple";
Let breakfast = Kenchen ' Today's breakfast is ${dessert} with ${fruit}! ` ;
function Kenchen (string, ... value) {
Let Breakfast1 = "";
for (Let i = 0; i<value.length; i++) {
Breakfast1 + = String[i];
Breakfast1 + = Value[i];
}
Breakfast1 + = string[string.length-1];
return breakfast1;
}
Console.log (breakfast);
Parsing: The Kenchen template tag is actually a method name, and the returned state after the execution of the method is returned to the kenchen tag, which is breakfast
The return value is actually the template label, also assigns the value to the breakfast thus outputs the time output breakfast can

The method of judging including string in ES6
StartsWith (): Determines what character the string begins with StartsWith ("abc"); Returns a Boolean value of True/false
EndsWith (): The EndsWith ("Z") that determines what character the string ends with; Returns a Boolean value of True/false
Includes (): Determines whether the word representable contains a character includes ("Cake"); Returns a Boolean value of True/false

Comprehensive example (ES6 string retrieval)

Let dessert = "cake", fruit = "Apple";
Let breakfast = ' Today's breakfast is ${dessert} with ${fruit}! ` ;
Console.log (
Breakfast.startswith ("Today S")//return False
);
Console.log (
Breakfast.endswith ("")///end with a space so return true
);
Console.log (
Breakfast.includes ("cake")//string contains the cake answer returns True
);
if (Breakfast.startswith ("Today is")) {
Alert ("Breakfast string is the beginning of today")
}else{
Alert ("Failed to retrieve")
}//Popup retrieval failed

Functions function function Set default value (parameter default value)
1. Set the default value for the function parameter in ES6, if the parameter function parameter will use the default value if it is called, the passed value is used if the pass parameter

Instance (parameter default value)
function Breakfast (dessert = "cake", fruit = "Apple") {
Return ' ${dessert} ${fruit} '
}
Console.log (
Breakfast ("AAA", "orange")//Pass the output to AAA and Apple
);

Nine... Operator
1, expand: such as the expansion of the array output

Instance (..... Expand Instances)
Let fruit = ["apple", "cake"];
Console.log (fruit); The output is an array object
Console.log (... fruit);//output is APPLA cake

Instance (the newly created array will fruit expanded after it is included in the new array to output new array objects and expand the results of the new array)
Let fruit = ["apple", "cake"],
Fruits = ["orange", ... fruit];
Console.log (fruits); Output Array Object The second one contains the first to become an array
Console.log (... fruits);//output Orange apple cake

2, used in the parameters of the function to allow the function to support the number of additional parameters is not restricted----remaining operators

Instance (one function multiple wireless pass parameter output)
function breakfast (fruit, dessert, ... food) {
Console.log (fruit, dessert, food);
Output two first is the apple cake followed by an array object [orange Banana]
}
Breakfast ("Apple", "cake", "orange", "banana");

Instance (Show all strings ...) Expand
function breakfast (fruit, dessert, ... food) {
Console.log (fruit, dessert, ... food);
Output Apple cake Orange Banana
}
Breakfast ("Apple", "cake", "orange", "banana");

function parameters of functions are the form of objects
1, parameters need to use curly braces {} to wrap the parameter object and then give a null value so that the object is not delivered without error
2, call the function to pass the object parameters also need to use {} to set the properties and values wrapped up

Instance (function object parameter (object))
function breakfast (fruit, dessert, {address, home} = {}) {
Console.log (fruit, dessert, address, home);
}
Breakfast ("Apple", "cake", {address: "Jinan", Home: "Beijing Lobster Restaurant"});

The Name property of the function in Xi. ES6
1. Common functions
2. anonymous function
3. Common function Assignment variables

Instance (normal traditional Name property)
function Breakfase () {
The outside output is the name of the breakfast function.
}
Console.log (
Breakfase.name
);

Instance (Name property of anonymous function)
Let breakfase1 = function () {
The outside output is the Breakfast1 variable anonymous function name
}
Console.log (
Breakfase1.name
);

Instance (name of the traditional assignment to the variable)
Let Breakfase2 = function Arraycheck () {
The outside output is a function name with a high priority of Arraycheck
}
Console.log (
Breakfase2.name
);

12. New way to create function of ES6

ES6 a new way to create a function
Let breakfast = dessert = Console.log (dessert);
Breakfast ("apples");
Breakfast is the name of the function
Dessert the first is a formal parameter
= = is the notation of the ES6 function
Console.log (dessert); return value of the function

The writing of ES5
var breakfast = function Breakfast (dessert) {
Console.log (dessert);
}

Above is the need to pass a parameter to pass multiple parameters how to set it?
Let breakfast = (dessert, fruit) = Console.log (dessert + "" + fruit);
Breakfast ("Cake", "apple");

ES5 notation
var breakfast = function breakfast (dessert, fruit) {
Console.log (dessert + "" + fruit);
}
Breakfast ("Cake", "apple");

If the brace is equal to the value inside, it needs to be returned.
Let breakfast = (dessert = "cake", fruit = "Apple") and {
Return dessert + "" + fruit;
};
Console.log (Breakfast ("Drink", "banana"))

ES5 notation
var breakfast = function breakfast (dessert, fruit) {
Return dessert + "" + fruit;
}
Console.log (Breakfast ("Drink", "banana"));

JavaScript Es2015 Experience Basics Summary