Javascript - Array Destructuring

 

인프런 자바스크립트 입문 수업을 듣고 중요한 내용을 정리했습니다.
개인 공부 후 자료를 남기기 위한 목적이므로 내용 상에 오류가 있을 수 있습니다.

 

Array Destructuring

 

• Array Destructuring 이란?

배열에서 원하는 element만을 얻고자 할 경우에 사용하는 기능이다.

<기본 개념>

//Array Destructuring을 사용하지 않는 일반적인 경우

function getScores( ) {

	return [70,80,90];

 }

var scores = getScores( );

console.log(scores);		//배열 전체를 얻고자 할 경우

// 결과 : 
//0: 70
//1: 80
//2: 90

console.log(scores[0]);		//배열의 첫번째 element만을 얻고자 할 경우

// 결과 : 70

console.log(scores[1]);		//배열의 두번째 element만을 얻고자 할 경우

// 결과 : 80



//Array Destructuring을 사용하여 원하는 element만을 얻고자 할 경우

function getScores( ) {

	return [70,80,90];
    
 }

var [x, y, z] = getScores( );

//이 경우에 x에는 첫번째, y에는 두번째, z에는 세번째 element가 각각 들어간다.

console.log(x);			// 결과 : 70

console.log(y);			// 결과 : 80

console.log(z);			// 결과 : 90

<활용 예시>

function getLocation( ){

	return [123.12, 56.231];        
 }

var [latitude, longitude] = getLocation( );

console.log(latitude);			// 결과 : 123.12(위도)

console.log(longitude);			// 결과 : 56.231(경도)
        
        
//위도와 경도의 정보를 제공하는 자바스크립트의 라이브러리들은
//대부분 배열의 형태로 정보를 제공하기 때문에, 이러한 경우 배열에서 원하는 
//element만을 얻기 위한 목적으로 Array Destructuring의 기능을 사용하면 편리하다.