ecmascript6-Next-generation JavaScript standard

Introduction

ECMASCRIPT6 is the next-generation JavaScript standard that will be approved in June 2015. ES6 is a significant update to JavaScript and is the first update since the release of ES5 in 2009. It will implement the following new features in the main JavaScript engine.

Arrows (arrow function)

ES6 allows you to define functions using the arrow (= =). are syntactically similar to the related attributes of C #, Java8, and Coffeescript. They support both expressions and statement bodies, and unlike functions, arrows share the same this keyword in context.

//An expressionvarOdds = Evens.map (v = v + 1);varNums = Evens.map ((v, i) = + V +i);//Statement BodyNums.foreach (v = {  if(v% 5 = = = 0) Fives.push (v);});//This keywordvarBob ={_name:"Bob", _friends: [], Printfriends () { This. _friends.foreach (f =Console.log ( This. _name + "knows" +f)); }}

　

Classe structure

The class approach in ES6 is a simple syntactic sugar relative to the prototype-based object-oriented model currently in use. It has a convenient declaration model and encourages interoperability. Class supports prototype-based inheritance, super invocation, instance and static methods, and constructors.

class Skinnedmesh extends three. Mesh {//constructor Functionconstructor (geometry, materials) {super (geometry, materials);  This. Idmatrix =Skinnedmesh.defaultmatrix ();  This. Bones = [];  This. bonematrices = []; //...} update (camera) {//...super.update (); }  //Static Methodsstatic Defaultmatrix () {return Newthree.  Matrix4 (); }}

In the preceding code, ES6 uses the constructor method instead of the ES5 constructor.

An enhanced Object object

The enhanced ES6 of Object objects allows you to write directly to variables and functions as properties and methods of an object. This kind of writing is more concise.

var obj = {    //  __proto__    __proto__: theprotoobj,    //  Simplified version of the ' Handler:handler '     handler,    //  method     ToString () {     //  Super calls     return "D" + super.tostring ();    } ,    //  Compute (dynamic) property name    [' Prop_ ' + (() =] ()]: ();

Template string

The

Template string provides syntax sugars that construct a string, which is similar to the interpolation feature feature in Perl,python. Optionally, you can add a label that allows custom string construction, avoids injection attacks, or constructs a higher-level data structure from a string.

// The basic string is created ' in JavaScript ' \ n ' is a line-feed. '//  Multi-line string  This is not legal. '//  build Dom query var name = "Bob", time = "Today"; ' Hello ${name}, how is you ${time} ? ' GET ' http: // Foo.org/bar?a=${a}&b=${b} X-Credentials: ${credentials}    "foo": ${foo},      "bar": ${bar} ' ( Myonreadystatechangehandler);

Let and const operators

ES6 has a new let command to declare variables. Its usage is similar to Var, but the declared variable is valid only within the code block where the Let command resides. A const is also used to declare a variable, but a constant is declared. Once declared, the value of the constant cannot be changed.

function f () {  {let    x;    {      //  Okay, block scoped name      const x = "Sneaky";       // error, const      x = "foo";    }     // error, already declared in block    Let x = "inner";  }}

For...of Cycle

JavaScript original for...in loop, can only obtain the object's key name, cannot obtain the key value directly. ES6 provides for...of loops that allow traversal to get key values

Let Fibonacci = {  [Symbol.iterator] () {    = 0, cur = 1;     return {      Next () {        = [cur, pre + cur];         return false , value:cur}   }}}  for (var  N of Fibonacci) {  //  truncate the sequenceat +  if
     (n >)    break;  print (n);}

Generators

ES6 the generator function defined by the draft, you need to add an asterisk after the function keyword. The yield statement is then used inside the function to define each member of the walker.

Yield is somewhat similar to the return statement, and can return a value. The difference is that each time yield is encountered, the function returns the value of the expression immediately following yield, pauses execution, resumes execution from that position the next time, and the return statement does not have the function of positional memory.

varFibonacci ={[Symbol.iterator]:function*() {    varPre = 0, cur = 1;  for (;;) {      vartemp =Pre; Pre=cur; Cur+=temp;    Yield cur; }  }} for(varN of Fibonacci) {  //truncate the sequence at  if(N > 1000)     Break; print (n);}

Modules Module

• Basic usage

  ES6 allows you to define modules. That is, a JavaScript script file is allowed to invoke another script file.

  Suppose there is a circle.js, which is a separate module.

    // Circle.js function Area   (RADIUS) {    return Math.PI * radius * RADIUS;}       function  circumference (radius) {    return 2 * Math.PI * radius;  }

              

  Then, main.js references this module.

    // Main.js    ' Circle ';  Console.log ("Circle Size:" + area (4));  Console.log ("circumference length:" + circumference (14));

  < Span class= "pun" >< Span class= "KWD" >< Span class= "PLN" >< Span class= "pun" >< Span class= "pun" >< Span class= "lit" >&NBSP;         

  Another way to do this is to load circle.js as a whole.

    // Main.js    ' Circle ';  Console.log ("Round area:" + Circle.area (4));  Console.log ("circumference length:" + circle.circumference (14));

            

• Inheritance of modules

  A module can also inherit from another module.

    // Circleplus.js * from ' Circle ';      var e = 2.71828182846;   default function (x) {      return  math.exp (x);  }

              

  Load the above module.

•   // Main.js "Circleplus";  "    Circleplus ";  Console.log (exp (MATH.PI);

• Default methods for modules

  You can also define a default method for a module.

•   Circleplus.js  Export default function(x) {      return math.exp (x);  }  

Use

Currently, the V8 engine has deployed some of the features of ECMAScript 6. With node. JS version 0.11, you can experience these features. (Please visit the node. JS website for download and installation)

Using the--harmony parameter into the node runtime environment, you can experience ECMAScript 6 under the command line.

Node--harmony

ecmascript6-Next-generation JavaScript standard