ES6の解体式

ES6発現構文添加解体は、私たちは、特定の構文を介して直接エレガントなアレイまたはオブジェクトまたは複数の値を取得することを可能にします。

配列の伝統的な価値観では、このようなものたちであります

let arr = [1,2,"abc"];
console.log(arr[0]);
console.log(arr[1]);
console.log(arr[2]);

私たちは解体後に式を使用する場合ES6はこれです

let arr = [1,2,"abc"];
let [a,b,c] = arr;
console.log(a,b,c)

それは、よりエレガントな外観ではありません。以上より表現の使用を解体します。

我々は、配列の最初の要素を取得したい場合は、あなただけの1つの要素を入力することができます

let arr = [1,2,"abc"];
let [a] = arr;
console.log(a)

私たちは第二の要素を取得したい場合は、以下のようになることがあります。

let arr = [1,2,"abc"];
let [,a] = arr;
console.log(a)

あるいは、最初の要素以外のすべての要素を取得した後：

let arr = [1,2,"abc"];
let [a,...b] = arr;
console.log(b)

配列要素の値を超えたときにデフォルト値が表示され

let arr = [1,2,"abc"];
let [a,b,c,d] = arr;
console.log(a,b,c,d)

我々はまた、過剰で指定された要素のデフォルト値を指定することができます

let arr = [1,2,"abc"];
let [a,b,c,d="张三"] = arr;
console.log(a,b,c,d)

 

次のようにオブジェクトの構造が使用されている場合：

const person = {
            name: 'Luke',
            age: '24',
            facts: {
                hobby: 'Photo',
                work: 'Software Developer'
            }
        }

 

オブジェクト指定されたパラメータを取得します：

const person = {
            name: 'Luke',
            age: '24',
            facts: {
                hobby: 'Photo',
                work: 'Software Developer'
            }
        }
        let {name,age} = person;
        console.log(name,age)

 

深いネストされたオブジェクトのパラメータを取得します：
 

const person = {
            name: 'Luke',
            age: '24',
            facts: {
                hobby: 'Photo',
                work: 'Software Developer'
            }
        }
        let {facts:{hobby},age} = person;
        console.log(hobby,age)