本文小編為大家詳細(xì)介紹“es6解構(gòu)賦值的作用是什么”，內(nèi)容詳細(xì)，步驟清晰，細(xì)節(jié)處理妥當(dāng)，希望這篇“es6解構(gòu)賦值的作用是什么”文章能幫助大家解決疑惑，下面跟著小編的思路慢慢深入，一起來學(xué)習(xí)新知識(shí)吧。

成都創(chuàng)新互聯(lián)公司是一家專注于成都網(wǎng)站設(shè)計(jì)、成都做網(wǎng)站、外貿(mào)網(wǎng)站建設(shè)與策劃設(shè)計(jì),龍山網(wǎng)站建設(shè)哪家好?成都創(chuàng)新互聯(lián)公司做網(wǎng)站,專注于網(wǎng)站建設(shè)十多年,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:龍山等地區(qū)。龍山做網(wǎng)站價(jià)格咨詢:13518219792

作用：1、交換兩變量的值，語法“[x,y] = [y,x];”；2、分解字符串，將字符傳入變量，語法“[變量列表]=字符串”；3、從函數(shù)中返回多個(gè)值，語法“[變量列表]=函數(shù)”；4、提取json數(shù)據(jù)，語法“{變量列表}=json變量”等等。

本教程操作環(huán)境：windows7系統(tǒng)、ECMAScript 6版、Dell G3電腦。

es6解構(gòu)賦值

es6允許按照一定的模式，從數(shù)組或?qū)ο笾刑崛≈担o變量進(jìn)行賦值，稱為解構(gòu)賦值。

解構(gòu)賦值在代碼書寫上簡單易懂，語義清晰明了，方便對(duì)復(fù)雜對(duì)象中數(shù)據(jù)字段的獲取。

解構(gòu)模型

在解構(gòu)中，解構(gòu)的源，位于解構(gòu)賦值表達(dá)式的右邊，而解構(gòu)的目標(biāo)，在解構(gòu)表達(dá)式的左邊。

解構(gòu)賦值的作用

1、交換x,y變量的值

利用解構(gòu)賦值可以不借助第三個(gè)變量的交換兩變量的值

    let x = 1;
    let y = 2;
    console.log('x:'+x, 'y:'+y);   //x:1 y:2
    //結(jié)構(gòu)賦值  
    [x,y] = [y,x];
    console.log('x:'+x, 'y:'+y);   //x:2 y:1

2、分解字符串，將字符傳入變量

var [a,b,c,d,e] = "hello";
console.log(a); // h
console.log(b); // e
console.log(c); // l
console.log(d); // l
console.log(e); // o

3、從函數(shù)返回多個(gè)值

//函數(shù)只能返回一個(gè)值，如果要返回多個(gè)值，要將他們放在數(shù)組或者對(duì)象里返回。

  function example(){
        //返回一個(gè)數(shù)組
        return [1,2,3]
    }
    let [a,b,c]= example();
    console.log('a:'+a,'b:'+b,'c:'+c);  //a:1 b:2 c:3
    
    
    function example2(){
        //返回一個(gè)對(duì)象
        return {
            name:'kang+',
            age:20
        }
    }
    let {name,age} = example2();
    console.log('name:'+name,'age:'+age);  //name:kang+ age:20

4、函數(shù)參數(shù)的定義

 //參數(shù)是一組有次序的值
         function f([x,y,z]){
             console.log('x:'+x);
             console.log('y:'+y);
             console.log('z:'+z);
         }

         f([1,2,3]);


        //參數(shù)是一組沒有次序的值
         function f({x,y,z}){
             console.log('x:'+x);
             console.log('y:'+y);
             console.log('z:'+z);
         }
         f({z:3, x:2, y:1});

5、提取json數(shù)據(jù)(項(xiàng)目開發(fā)中一定用的到的)

    let jsonData = {
        number:01,
        status:'200',
         data:[{person:'kang+',age:20}]

     }
    // 獲取json數(shù)據(jù)

     let {number,status,data,data:[{person,age}]} = jsonData;
     console.log('number:'+number);   //number:1
     console.log('status:'+status);   //status:200 
     console.log(data)                // [{…}]
     console.log('person:'+person);   //person:kang+
     console.log('age:'+age);         //age:20

6、函數(shù)參數(shù)的默認(rèn)值 (這個(gè)個(gè)人認(rèn)為作用不大)

   function Person(name,age,school = 'xiyou'){
         this.name = name;
         this.age = age;
        this.school = school;
     }
     var son = new Person('kang+',20);
     console.log(son)   // {name: "kang+", age: 20, school: "xiyou"}

7、遍歷map結(jié)構(gòu)

 Map 結(jié)構(gòu)原生支持 Iterator接口，配合變量的解構(gòu)賦值獲取鍵名和鍵值就非常方便。    var map = new Map();
    map.set('name','kang+');
    map.set('age','20');

    for(let [key, value] of map){
        console.log(key + ' is ' + value);
    }
    name is kang+
    age is 20

    獲取鍵名    var map = new Map();
    map.set('name','kang+');
    map.set('age','20');
    for(let [key] of map){
        console.log(key);    //name   age
    }

    // 獲取鍵值
    var map = new Map();
    map.set('name','kang+');
    map.set('age','20');
    for(let [,value] of map){
        console.log(value);   // kang+    20
    }

讀到這里，這篇“es6解構(gòu)賦值的作用是什么”文章已經(jīng)介紹完畢，想要掌握這篇文章的知識(shí)點(diǎn)還需要大家自己動(dòng)手實(shí)踐使用過才能領(lǐng)會(huì)，如果想了解更多相關(guān)內(nèi)容的文章，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

當(dāng)前題目：es6解構(gòu)賦值的作用是什么
轉(zhuǎn)載來源：http://chinadenli.net/article32/geoopc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供域名注冊(cè)、做網(wǎng)站、網(wǎng)站維護(hù)、標(biāo)簽優(yōu)化、企業(yè)建站、網(wǎng)站策劃

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)