> 웹 프론트엔드 > JS 튜토리얼 > ES6의 구조분해 할당에 대한 자세한 설명

ES6의 구조분해 할당에 대한 자세한 설명

php中世界最好的语言
풀어 주다: 2018-05-19 15:40:48
원래의
1846명이 탐색했습니다.

이번에는 ES6의 구조분해 할당에 대한 자세한 설명을 가져왔습니다. ES6의 구조분해 할당을 사용할 때 주의할 점은 무엇인가요? 실제 사례를 살펴보겠습니다.  @1 배열의 구조 분해 할당;

let [a,b,c]=[1,2,3];
console.log(a,b,c)            //1 2 3
----------------------------------------------------------------
let [a=true]=[];
console.log(a)                //a=true;
----------------------------------------------------------------
let[a=true]=[undefined];
let[b=true]=[null]
console.log(a,b)             //a=true,b=null
로그인 후 복사

사실, 정의되지 않은 것과 null의 차이점을 이해하는 것은 매우 간단합니다. 비록 undefine==null;

하더라도 여전히 구별 가능하다는 점은 null이라고 나와 있습니다. 빈

object

pointer

1. 배열에 존재하지 않는 항목에 액세스;

2. 정의되지 않은 변수 var 메소드;

그래서 다음 두 가지는 동일합니다.

let[a=true]=[undefined];
let[a=true]=[ ];
로그인 후 복사

이유를 이해하는 것은 어렵지 않습니다. ;

@2 객체의 구조 분해 할당;

배열과 달리 객체의 구조 분해 할당은 인덱스가 아닌 키를 기반으로 합니다.

let {foo,bar}={bar:"liuhf",foo:true};    //跟键的顺序没有关系;
로그인 후 복사

  @3

문자열의 구조 분해 할당

const [a,b,c,d,e,f]="liuhee";
console.log(a,b,c,d,e,f);        // l i u h e e
로그인 후 복사
구조 분해 할당, 왼쪽과 오른쪽이 일치해야 합니다.

  <다음은 객체/배열의 구조 분해 할당 함수입니다. 다시 확인합니다... 확장

operator

는 "값"만 취합니다>

let json = {
        a: &#39;对&#39;,
        b: &#39;象&#39;
    }
    //对象的函数解构;
function fun({ a, b = &#39;jspang&#39; }) {
    console.log(a, b);
}
fun(json);
//数组的函数解构;
let arr = ["liu", "hai"]
function fun1([a, b]) {
    console.log(a, b);
}
fun1(arr);
console.log("------------");
//或者;
function fun2(a, b) {
    console.log(a, b);
}
fun2(...arr);
로그인 후 복사
믿습니다. 이 기사의 사례를 읽은 후 방법을 익혔습니다. 더 흥미로운 내용을 보려면 온라인에서 PHP 중국어 관련 기사를 주목하세요! 관련 읽기:

webpack3의 항목, 출력, 모듈 분석

.

위 내용은 ES6의 구조분해 할당에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿