一日で簡単にできます.ECMAScript 6.0(ES 6と略称します.)入門

順序
ECMAScript 6.0(以下、ES 6という)はJavaScript言語の次世代規格で、2015年6月に正式に発表されました.JavaScript言語は複雑な大規模なアプリケーションを作成し、企業レベルの開発言語になることを目標としています.
S 6はますます重要になりますので、webフロントエンドの開発者には知識が必要となりました.早く入門できるように、参考学習としての基本的な方法をまとめました.もっと知りたいなら、ゆっくり積み重ねます.
以下の10点が分かります.入門は十分です.深層的なものは個人の造化を見ます.
1.let、constとブロックレベルのスコープ
let
最も簡単で乱暴なやり方は、以前に「var」と宣言した変数を、今は「let」と置き換えてもいいです.
例1:

    var a = 123; //es2015  
    let a = 123; //es6  

例二:

    //es2015
    var fn = function () {
        //handle
    };

    //es6  
    let fn = function () {
        //handle
    };
    //  
    let fn = () => {
        //handle
    }

コンサート
これは定数の声明です.例えば、PI=3.1415のような変更されたくないものはconstを使います.
たとえば:

const PI = 3.141592563

ブロックレベルのスコープ=「{}」
最も簡単で粗暴なES 6ブロッククラスのスコープを区別する方法は、「それぞれの｛｝はブロックレベルのスコープであり、forサイクルの後の大かっこもブロックレベルのスコープである」ということです.
たとえば:

{
    let a = 'apple';
    console.log(a); //apple
    {
        let a = 'aaa';
        console.log(a); //aaa
    }
    {
        console.log(a); //apple
    }
    {
        let a = 'AAA'
        console.log(a); //AAA
    }
    console.log(a); //apple
}

2.変数解構成値
デフォースは本質的には「モードマッチング」に属しています.イコールの両方のモードが同じであれば、左の変数は対応する値を与えられます.
配列分解値
例1:

    let [a, b, o] = ['apple', 'banana', 'orange'];
    console.log(a, b, o); //apple banana orange

例二:

    let [a, [b, c], d] = ['aa', ['bb', 'cc']];
    console.log(a, b, c, d); //aa bb cc undefined

例三:

    let [a, b, ...other] = [1, 2, 3, 4, 5, 6, 7];
    console.log(a, b, other); //1 2 [3, 4, 5, 6, 7]

ある人はこれを思っています.
オブジェクトの割り当て値
例1:

    let { a, b } = { a: 'apple', b: 'banana' };
    console.log(a,b); //apple banana

例二:

    let { a, b } = { a: 'apple', c:'hehehehehe', xx: 'xxxxxx', b: 'banana' };
    console.log(a,b); //apple banana

例三:

    let { a, xx:{ b } } = { a: 'apple', xx: { b: 'boy'}, b: 'banana' };
    console.log(a,b); //apple boy

ミキシングデフォース(この概念は私が自分で作ったものです.)
上の「栗」からも分かるように、S 6のデスティネーションは実は「マッチングモード」ということにこだわっています.つまり、等号の二面モードが一致すると、相応の値を与えられます.マッチングしていないのは...です.では、以下の例は自然に決まります.

    let [a, b, {x: {c}, d}, e] = ['aa', 'bb', {o: 'oo', x: {v: 'vv', c: 'cc'}, d: 'dd'}];
    console.log(a, b, c, d, e); //aa bb cc dd undefined

例二:

    let [arr, [obj]] = [[1, 2, 3], [{ a:'aa', b:'bb' }]];
    console.log(arr, obj); //[1, 2, 3] {a: "aa", b: "bb"}

関数のパラメータ
関数パラメータの解構成値も同じです.本質はすべて「整合モード」です.ここは形参加の実参加間のマッチングです.

{
    //es6    es5+es6  
    function fun([a, b]) {
        return a + b;
    }
    console.log(fun([100, 150])); //250
}
{
    //es6  
    let fun = ([a, b]) => a + b;
    console.log(fun([150, 100])); //250
}

また例えば:

    let fun = ([a, b], { o }) => [a, b, o];
    let fruits = fun(['apple', 'banana'], {g: 'grap', o: 'orange'});
    console.log(fruits); //["apple", "banana", "orange"]

入門としては、以上のようなものを学ぼうとすれば十分です.
3.文字列拡張
S 6は文字列に対して多くのAPIの拡張を行っていますが、初心者の私にとって、一番好きなのはテンプレート文字列機能です.
テンプレート文字列
たとえば:
s 5の書き方

    var name = 'loushengyue',
        age = 30,
        sex = 'man';
    var tpl =
        '<div>' +
        '<span>name: ' + name + 'span>' +
        '<span>age: ' + age + 'span>' +
        '<span>sex: ' + sex + 'span>' +
        'div>'

    console.log(tpl); //<div><span>name: loushengyuespan><span>age: 30span><span>sex: manspan>div>

s 6書き方

    let name = 'loushengyue',
        age = 30,
        sex = 'man';
    let tpl = `<div><span>name: ${name}span><span>age: ${age}span><span>sex: ${sex}span>div>`

    console.log(tpl); //<div><span>name: loushengyuespan><span>age: 30span><span>sex: manspan>div>

その他の拡張子

codePointAt()

String.from CodePoint()

normalize()

includes()、starts With()、endsWith()

レペト()

padStart()、padEnd()

match All()

…

その中で、私はundefinedの方法に興味があります.以下は彼らの簡単な説明です.

includes():ブール値を返します.パラメータ文字列が見つかったかどうかを表します.

starts With():ブール値を返し、パラメータ文字列が元の文字列の先頭にあるかどうかを示します.

endsWith():ブール値を返し、パラメータ文字列が元の文字列の末尾にあるかどうかを示します.

4.正則拡張
RegExpコンストラクタの機能を強化し、includes(), startsWith(), endsWith()、u修繕子を拡張し、y、sticky属性などを追加しました.

test()はbook

に戻ります.

exec()は、類似の配列のセット

を返します.

match()は、類似の配列のセット

を返す.

replace()は、置換後の文字列

を返します.

search()は下付きを返し、マッチングしていない場合は-1

を返します.

split()戻り行列

es 6正則学習参考サイト:http://es6.ruanyifeng.com/#docs/regex
5.数値の拡張
数値の2進数、8進数、16進数表記法

flagsの先頭に0bの数値が続くと、バイナリ

が構成されます.

0-1の先頭に0oが続く数値は、8進数

を構成する.

0-7の先頭に0xの数値が続くか、または0-9の文字が8進数

を構成する.
たとえば:

console.log(0b1001); //9
console.log(0o17); //15
console.log(0x2f); //47

指数演算子
ES 2016に指数演算子が追加されました.例えば、

console.log(2 ** 3); //8
console.log(2 ** 4); //16
//   **=
let num = 2;
num **= 3;
console.log(num); //8

その他の拡張子

Number.isfinite()は、数値が限られているかどうかを判断し、book

に戻る.

Number.isNaN()NaN

であるかどうかを判断する.

Number.parseInt()は、フルサイズ

に変換される.

Number.parseFloat()を浮動小数点型

に変換する.

Number.isInteger()は、一つの数値が整数かどうかを判断し、book

に戻ります.

Number.EPSILONの極小定数、すなわちjsの最小精度

Number.isSafe Integer()は、1つの整数が-2^53から2^53の間にあるかどうかを判断します.

Math.trunc()は小数点以下の部分を除き、整数部分

を返します.

…

6.関数拡張
この節の内容は重点で、完全に把握しなければなりません!!!
矢印関数
例1:

let fn = item => item * 2;
console.log(fn(8)); //8
//   es5 
var fn = function(item){
    return item * 2;
}

例二:

let fn = item => { console.log(item * 2); }
fn(4); //8
//   es5 
var fn = function(item) {
    console.log(item * 2);
}

例三:

let fn = () => 10;
//   es5 
var fn = function() { return 10; }

例四:

let fn = (a, b) => a + b;
//   es5 
var fn = function(a, b) { return a + b; }

関数パラメータのデフォルト値
たとえば:

let fn = (a, b, c =5, d = 'abcd') => [a, b, c, d];
console.log(fn(1, 3)); //[1, 3, 5, 'abcd']
console.log(fn(2, 4, 6)); //[2, 4, 6, 'abcd']

パラメータ
ES 6は、インデックスパラメータ(形式は変数名)を導入し、関数の余分なパラメータを取得するために、argmentsオブジェクトを使用する必要がなくなります.
たとえば:

let sum = (...items) => {
    let total = 0;
    for (let index in items) {
        total += items[index];
    }
    return total;
};
console.log(sum(1, 3, 5)); //9
console.log(sum(1, 3, 5, 4, 6)); //19

もちろん関数の拡張はたくさんありますが、上のいくつかが重要だと思います.
次号に続く