# Javascript Destructuring_assignment( 비구조화 할당 )
# Javascript Destructuring_assignment( 비구조화 할당 )
by jihoon kim
HTML
<h1>Javascript Destructuring_assignment( 비구조화 할당 )</h1>
<script>
function autolink(id) {
var container = document.getElementById(id);
var doc = container.innerHTML;
var regURL = new RegExp("(http|https|ftp|telnet|news|irc)://([-/.a-zA-Z0-9_~#%$?&=:200-377()]+)","gi");
var regEmail = new RegExp("([xA1-xFEa-z0-9_-]+@[xA1-xFEa-z0-9-]+\.[a-z0-9-]+)","gi");
return doc.replace(regURL,"<a href='$1://$2' target='_blank'>$1://$2</a>").replace(regEmail,"<a href='mailto:$1'>$1</a>");
}
window.onload = function () {
var container = document.getElementById("contents");
container.innerHTML = autolink("contents");
}
</script>
<pre id="contents">
■ 참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
비구조화 할당(destructuring assignment) 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 자바스크립트 표현식(expression)입니다.
■ 구문
var a, b, rest;
[a, b] = [10, 20];
console.log(a); // 10
console.log(b); // 20
[a, b, ...rest] = [10, 20, 30, 40, 50];
console.log(a); // 10
console.log(b); // 20
console.log(rest); // [30, 40, 50]
({ a, b } = { a: 10, b: 20 });
console.log(a); // 10
console.log(b); // 20
// 제안 3단계(stage 3 proposal)
({a, b, ...rest} = {a: 10, b: 20, c: 30, d: 40});
console.log(a); // 10
console.log(b); // 20
console.log(rest); //{c: 30, d: 40}
■ 설명
객체 및 배열 리터럴 식은 즉석에서 쉽게 데이터 패키지를 만들 수 있도록 합니다.
var x = [1, 2, 3, 4, 5];
비구조화 할당은 이와 비슷한 구문이지만, 할당문의 좌변에 원래 변수에서 어떤 값들을 해체할지 정의합니다.
var x = [1, 2, 3, 4, 5];
var [y, z] = x;
console.log(y); // 1
console.log(z); // 2
이 기능은 Perl이나 Python 같은 언어에 존재하는 것과 비슷합니다.
■ 배열 비구조화
: 기본 변수 할당
var foo = ["one", "two", "three"];
var [one, two, three] = foo;
console.log(one); // "one"
console.log(two); // "two"
console.log(three); // "three"
: 선언에서 분리한 할당
비구조화를 통해 변수의 선언과 분리하여 값을 할당할 수 있습니다.
var a, b;
[a, b] = [1,...