ES 6変数と解構(二)

一、変数の宣言と使用【テスト例はnode環境でテストする必要があり、ブラウザ環境ではES 6コードを完全に互換性がない】ES 6では{}を使用して任意のコードを含むことができ、{}に包まれた内容を1つのコードブロック(ローカル役割ドメイン)letキーワード【音響変数】特性と呼ぶ:1.ブロックレベルの役割ドメイン【宣言コードブロックに局所的に作用する】2.変数宣言は昇格しません【変数が宣言されないまでこの変数は使用できません】3.一時的デッドゾーン【この変数は前の領域を宣言する】4.繰り返し宣言はできません【同じコードブロックで同じ変数を繰り返し宣言することはできません】constキーワード【定数を宣言する(一般的には大文字で定数を表す)】特性:【let宣言変数に従う特性に次の2つの特性を追加する】1、宣言時に初期化【宣言と同時に値を付与しなければならない】2、値を変更できない2、解構1、配列の解构賦値【左が変数、右が値、左が一致値がない场合undefined】完全解构【左右データがちょうど一致】eg:

    let [a,b,c] = [1,2,3];

不完全解构【左右のデータが异なる】a、左のデータが多い场合はその変数のみを宣言し、その値がundefinedb、右のデータの余分な项目はegを无视します:

    let [a, [b], d] = [1, [2, 3], 4];     //a = 1; b = 2; d = 4 

集合解体【拡張演算子の使用...】a、...tailは、現在右側に一致していないすべての値からなる配列egを返します.

    let [head, ...tail] = [1, 2, 3, 4]; //head = 1; tail = [2, 3, 4]
    // 
    let sum = 0;
    function test(...arr){
        //rest 【 , 】 ------> arguments 
        //arr = [1,2,3,4,5]
        for(let i=0;i){
            sum +=arr[i];
        }
    }
    
    test(1,2,3,4,5);

デフォルト値【一致値がundefinedに厳密に等しい場合、デフォルト値は有効】eg:

    let [x, y = 'b'] = ['a']; 　　// x='a', y='b’

デフォルト値は関数注:まず値が一致するかどうかを判断し、マッチング値がundefinedに厳格に等しい場合、デフォルト値の付与演算を行います.それ以外の場合、デフォルト値付与操作ではegは実行されません.

    function test() {
        console.log('test');
        return 2;
    }
    let [x = test()] = [];
    console.log(x);        //test    2

2、オブジェクトの解体賦値【右側に左変数に対応する属性名が存在しない場合、オブジェクトの属性値はundefined、すなわちオブジェクトに宣言されていない属性の値はundefined】オブジェクトの元の構造賦値【変数の名前変更後、最終的に宣言された変数は名前変更の変量】eg:

    let {name:myName,age:myAge} = {name:'nzc',age:18}
    // 【 name name myName ==》 let myName = 'nzc'】
    let myName = 'nzc';
    let myAge = 18;

オブジェクトのプロパティには順序がありません.変数はプロパティと同じ名前でなければ、正しい値を取得できません.【名前を変更しても簡単に書くことができます】eg:

    let {name:name,age:age} = {name:'nzc',age:18}
    // 
    let {name,age} = {name:'nzc',age:18}
    // 
    let name = 'nzc';
    let age = 18;

オブジェクトネスト解構eg:

    let person = { param: [ 'nzc', { age: 18 } ] };
    let { param: [name, { age }] } = person; //name='nzc' age=18
    //    param  [name, { age }], ; param 
    let { param: [name, { age }] } = { param: [ 'nzc', { age: 18 } ] }

デフォルト値(デフォルト値が有効な条件は、オブジェクトのプロパティ値がundefinedに厳密に等しいことです)eg:

    //name='nzchs'->name ;age:myAge=21->myAge 【age myAge 】
    let {name='nzchs',age:myAge=21} = {name:'nzc',age:18}
    let {name='nzchs',age:myAge=21} = {name:'nzc'}  

3、文字列の解構賦値解構の場合、文字列は類似配列のオブジェクトに変換される.eg:

    let [a, b, c] = 'hello'; //a=h;b=e;c=l

length属性解構eg:

    let {length : len} = 'hello'; //len = 5 【 length len 】

 
4、数値およびブール値が賦値解体を解体する場合、等号の右側が数値およびブール値である場合、対応する基本参照データ型オブジェクトegに移行します.

    let {toString: str1} = 123; //  str1 === Number.prototype.toString      true
    let {toString: str2} = true; //  str2 === Boolean.prototype.toString         true

5、関数パラメータの解构賦値基本配列解构賦値伝参eg:

    function add([x, y]){ return x + y; }
    add([1, 2]);   // add 3 

関数パラメータにはデフォルトegがあります.

    function test({x = 0, y = 0}) {
        return [x, y];
    }
    // 
    test({x: 3, y: 8}); //  [3, 8]
    test({x: 3}); //  [3, 0]
    test({}); //  [0, 0]
    test(); //  Cannot destructure property `x` of 'undefined' or 'null'

三、常用用途1、変数値の交換egを解く:

    let x = 1;
    let y = 2;
    [x,y] = [y,x];  
    console.log(x,y); //2 1    

2、関数パラメータの割り当て:eg:

    //[a=0,b=1] = [1]   a=1,b=1
    function test([a=0,b=1]){
        return a+b;
    }
    test([1]);  // 2

3、抽出対象のデータeg:

    let obj= { id: 42, status: "OK", data: [867, 5309] };
    let { id, status, data: number } = obj;  //  

4、入力モジュールの指定方法

    const { SourceMapConsumer, SourceNode } = require("source-map");

5、map構造を遍歴する

    var map = new Map();
    map.set('name', 'nzc');
    map.set('age', 18);
    for (let [key, value] of map) {
        console.log(key + " is " + value);    // name is nzc   age is 18
    }

 
転載先:https://www.cnblogs.com/nzcblogs/p/11348883.html