[ES6] 4. Array, Symbol

Chapter 4. Collection - Array, Map and Symbol

Array

배열의 여러 요소에 접근하기 위해 destructuring을 사용할 수 있다.

ES5>>

let users = [“Sam”, “Tyler”, “Brook”];
 
let a = users[0];
let b = users[1];
let c = users[2];
 
console.log(a,b,c); // Sam Tyler Brook

ES6>>

let users = [“Sam”, “Tyler”, “Brook”];
 
let [a, b, c] = users;
console.log(a,b,c); // Sam Tyler Brook
 
let [a, ,b] = users;
console.log(a, b); // Sam Brook
 
let[ first, …rest] = users;
console.log(first, rest); // Sam [“Tyler”, “Brook”]

배열을 반환하는 함수일 경우 여러 변수를 한번에 할당할 수 있다.

code>>

function activeUsers( ){
     let users = [“Sam”, “Tyler”, “Brook”];
     return users;
}
 
let active = activeUsers( );
console.log(active); // [“Sam”, “Tyler”, “Brook”]
 
let [a, b, c] = activeUsers( );
console.log(a,b,c); // Sam Tyler Brook

for - of statement 도입

let users = [“Sam”, “Tyler”, “Brook”];
 
//ES5>
for(let index in users){
     console.log( users[index]);
}
console> Sam Tyler Brook
 
//ES6>
for(let name of users){
     console.log( name );
}
console> Sam Tyler Brook

for - of statement를 배열 뿐만 아니라 객체에서도 사용하기 위해서 Symbol 이라는 새로운 데이터 타입이 도입되었다. Symbol.iterator라는 특별한 함수를 사용한다.

what is the Symbol?

심볼은 기존의 자바스크립트에서 존재하고 있던 어떠한 데이터타입과도 또 다른 하나이다. 일단 생성되면 그 값이 변경될 수 없고, 어떠한 속성을 부여할 수 없다. 하지만 이 심볼을 어떠한 속성의 이름으로는 사용할 수 있다. 각 심볼은 고유하며 다른 심볼과 구별된다. 

var sym = Symbol( );

이렇게 심볼을 생성할 수 있다.

var cat = Symbol.for(“cat”);

이렇게 하면 cat이라는 이름의 symbol들이 불려진다. 심볼for 메소드는은 심볼 레지스트리라고 불리는 목록을 참조한다. 하나의 웹 페이지에서 하나의 심볼을 공유해야하는 경우에 사용된다.

code>>

let users = [“Sam”, “Tyler”, “Brook”];
console.log(typeof names[Symbol.iterator]); // function
 
for(let name of names){
     console.log( name ); // Sam // Tyler // Brook
}

http://hacks.mozilla.or.kr/2015/09/es6-in-depth-symbols/

Array. find ( _testfunc )

_testfunc를 만족하는 배열의 첫번째 원소를 반환하는 메소드이다.

code>

let users = [
     { login : “Sam”, admin : false },
     { login : “Brook”, admin : true },
     { login : “Tyler”, admin : true }
];
 
let admin = users.find ( (user) => {
     return user.admin; // returns first object for which user.admin is true
});
console.log( admin ); // { “login”:”Brook”, “admin”:true }
 
let admin = users.find(user => user.admin );
console.log ( admin ); // { “login”:”Brook”, “admin”:true } 

chapter 4. end