ES 6新規特性--文法編(一)---文法特性

1、文法的特性
1.1、変数

let

const

特性:

声明の重複ができない

let a = "1";
let a = "2"  //   ，    

const定数が定義されていて、変更できない

const a = 1;
a = 2;   //   ，       

/*     function、Array、Object    ，     */
const b = {
     name: "duck"};
b.name = "pig"  //     

ブロックレベルのスコープ

一番有名なクローズドの問題は、var自分のブロックレベルのスコープ(関数レベルのスコープ)がないからです.だから、一つの関数を使ってそれを包んで、ブロックレベルのスコープをあげます.

let btns = document.getElementsByTagName("button");
 for(var i = 0; i < btns.length; i++) {
     
     (function (i){
     
         btns[i].onclick = function() {
     
             console.log(i)
         };
     })(i)
 }

ただし、ブロックレベルの作用領域がある変数letを使用すると、この問題は発生しません.

let btns = document.getElementsByTagName("button");

for(let i = 0; i < btns.length; i++) {
     
    btns[i].onclick = function() {
     
        console.log(i)
    };
}

1.2、分配値
作用:
取り出しやすいjson、Array、Objectの値
大きな構造のデータを取り出すのに適しています.
よくネットでajaxに内部の値を取得するように要求します.
使用:

両方の構造は同じでなければならない

右側は必ず個(対象)

賦課と解凍を同時に行う

/*      */

// json = {a: 12, b:5}
let {
      a, b } = json

// array
array = [12, 5, 8];
let [ a, b, c ] = array;

1.3、矢印関数
注意:
矢印関数と一般関数は、書き方以外にもthisの違いがあります.
矢印関数のthis:**は関数のスコープから来ました.その値は普通の変数のような規則に従って、関数のスコープの中の階層を上に探します.つまり、矢印関数のthis最近のスコープthis使用:

パラメータが一つしかないなら、()書かなくてもいい

一つの文だけで、かつreturnであれば、{}書かなくてもいい

let array = [12, 8, 37, 26, 9];

 /*         */
 // array.sort(function(a, b) {
     
 //     return a - b
 // });

/*        */
array.sort((a, b) => a - b)

console.log(array)

1.4、パラメータ展開…

パラメータ収集

/*          c   */
function show(a, b, ...c) {
     
   console.log(a, b, c) // 1, 2, Array(5)
}

show(1, 2, 3, 4, 5, 6, 7) 

配列展開

let arr = [];
let arr1 = [1, 2, 3, 4, 5];
let arr2 = [6, 7, 8, 9];
arr = [...arr1, ...arr2];
console.log(...arr);

json展開

let json1 = {
     
    a: 1,
    b: 2
}
let json2 = {
     
    ...json1,
    c: 3
}
console.log(json2)

1.5、テンプレート文字列`.
テンプレート文字列は、埋め込み式を許可する文字列の文字列の文字数です.複数行の文字列と文字列補間機能を使用できます.
テンプレート文字列に使用${}変数値の挿入

let name = 'duck';
console.log(`     ${
       name}`);