ES6 할당 해제, 확장 연산 자 / 확장 연산 자

5120 단어 js/javascript
할당 해제
 ES6 는 일정한 패턴 에 따라 배열 과 대상 에서 값 을 추출 하고 변 수 를 할당 할 수 있 는데 이 를 해체 라 고 한다.
1. 할당 해제: 기본 용법, 이름 바 꾸 기, 기본 값 해제
    :   ,  ,           ,        
    let json = ["  ", 20, " "]    
    let [name,age,sex] = json;
    console.log(name,age,sex);      //     20  
       //  :              ,      ,     , :let ["name","age","sex"] = ["  ", 20, " "];         。
       //          :
    name="  "             //   "  "   "  " 

----------------------------------------------------
     :        key ,     
    let json = {
        name:"  ",
        age:20,
        sex:" "
    }
    let { name,age:a,sex:b } = json;
    console.log(name,a,b);      //     20  

----------------------------------------------------
     :               
    let json = ["  ", 20, " "]    
    let [name,age,sex,love="  "] = json;
    console.log(name,age,sex,love);      //     20     

  :           :           ,        null  ,            ,   null 。
         undefiend ,           。  :

    let [name,age,sex,love="  "] = ["  ", 20, " ",undefiend];
    console.log(name,age,sex,love);      //     20     

    let [name,age,sex,love="  "] = ["  ", 20, " ",null];
    console.log(name,age,sex,love);      //     20   null

  두 수의 위 치 를 교환 하 다.
let a = 10;
let b = 20;
[a,b] = [b,a]
console.log(a,b)  // 20 10

 2. 대상 재 구성 할당:
    //    :
    let {name,age,sex} = {name:"  ", age:"20", sex:" "} ;
    console.log(name);      //    
    console.log(age);       //  20
    console.log(sex);       //    

    //    :
    let {name,age, sex, friend} = {name:"  ", age:"20", sex:" ", friend:["  ", "  "]} ;
    console.log(name);      //    
    console.log(age);       //  20
    console.log(sex);       //    
    console.log(friend);    //  ["  ", "  "]

    //    :
    let {name,age, sex, friend, pet} = {name:"  ", age:"20", sex:" ", friend:["  ", "  "], pet:{name:"  " ,age:"2"}} ;
    console.log(name);      //    
    console.log(age);       //  20
    console.log(sex);       //    
    console.log(friend);    //  ["  ", "  "]
    console.log(pet);       //  {name:"  " ,age:"2"}
  //  :       ,key        ,    key          ,     undefined, 。
    let {name:str} = {name:"  "};
    console.log(name);      //        
    console.log(str);       //    
    //  ,           ,     key     ;

대상 에 대해 먼저 변 수 를 정의 한 다음 에 할당 문 제 를 분석 합 니 다. :{} 앞 에 let 와 같은 변수 성명 자가 없 으 면 브 라 우 저 는 {} 을 블록 급 역할 영역 으로 보고 문법 오 류 를 보고 합 니 다.
      ,     ,     ,       
let a;
{ a } = { a:"123", b:12}
----------------------------------------------------------
             ,          , ()   
let a;
({ a } = { a:"123", b:12})

3. 배열 구성 해제 할당:  
    let [arr1, [arr2, arr3, [arr4, arr5]]] = [1, [2, 3, [4, 5]]];
    concole.log(arr1,arr2,arr3,arr4,arr5)   //  1, 2, 3, 4, 5
  //  :               ,                  

  //            undefiend
    let [arr] = [];
    console.log(arr)         // undefiend 

    let [a, b, c] = [1, 2, 3];
    console.log(a)          // 1
    console.log(b)          // 2
    console.log(c)          // 3

  //                       :
    let [a, , , c] = [1, 2, 3];
    console.log(a)          // 1
    console.log(c)          // undefined

4. 기본 유형의 해체 할당: (개발 중 멀미 가 적 습 니 다. 알 면 됩 니 다) 
  //String       ,    。
    let [a, b, c, d, e] = "     ";
    console.log(a)          //  
    console.log(b)          //  
    console.log(c)          //  
    console.log(d)          //  
    console.log(e)          //  
  //Number         ,    。
    let [a, b, c, d, e] = 12306;
    console.log(a)          //     
    console.log(b)          //     
    console.log(c)          //     
    console.log(d)          //     
    console.log(e)          //     

확장 연산 자
문법 은 세 가지 점 입 니 다.  
     :     
let arr = ["red","blue",green]
console.log(...arr)  // red blue green

-------------------------------------------------------
     :     ,       
function show(...a){
    console.log(arguments) //       [1,2,3,4,5,6]
    console.log(a)  // [1,2,3,4,5,6]
}
show(1,2,3,4,5,6)

-------------------------------------------------------
       :             
function show(a,b,...c){
    console.log(a)  // 1
    console.log(b)  // 2
    console.log(c)  // [3,4,5,6]
}
show(1,2,3,4,5,6)
  :              ,         
function show(a,...b,c){
    //         
}
show(1,2,3,4,5,6)

복사 배열, 대상: 얕 은 복사
let arr = [1,2,3,4];
//let arr2 = Array.from(arr) //      
let arr2 = [...arr]
console.log(arr2)  // [1,2,3,4]


let arr = {name:"a",age:12};
let arr2 = {...arr}
console.log(arr2)  // {name:"a",age:12}

좋은 웹페이지 즐겨찾기