191120(수) TIL-1. Solution9-10, ES6기능

[CODESTATES im16] Solution9-10, ES6 기능

1. Solution9-10

1-1. Deep copy & Shallow copy

1) Deep copy

• 원시 타입(primitive type)
• String, Boolean, Number 등 구조가 비교적 단순한 타입
• 복사가 일어날 때 독립적이고 새로운 메모리 공간을 확보하여 값을 저장.

2) Shallow copy

참조타입이 독립적인 값을 저장하지 않는 이유: 비효율을 방지하기 위해서

• 참조 타입(reference type)
• Object, Array, Function 등 구조가 비교적 복잡한 타입
• 복사가 일어날 때, 메모리 어딘가에 객체 그 자체가 아닌 객체의 위치 값을 저장

2. ES6 기능(개인적으로 알아봄)

2-1. ES6: 추가된 원시타입 symbol

[Poiemaweb] 7번째 타입 심볼(symbol)

[MDN] Symbol

변경 불가능한 원시 타입!

주로 이름의 충돌 위험이 없는 유일한 객체의 프로퍼티 키(property key)를 만들기 위해 사용함.

const symbol1 = Symbol();
const symbol2 = Symbol(42);
const symbol3 = Symbol('foo');

console.log(typeof symbol1);
// expected output: "symbol"

console.log(symbol3.toString());
// expected output: "Symbol(foo)"

console.log(Symbol('foo') === Symbol('foo'));
// expected output: false

신기하다~

 

2-2. ES6: 계산된 프로퍼티명(Computed Property Names)

YOU DON'T KONW JS (this와 객체 프로토타입, 비동기와 성능) - 카일 심슨 [한빛미디어] 70p

ES6부터 계산된 프로퍼티명(Computed Property Names)이라는 기능이 추가되었으며 Symbol에서 많이 사용할 수 있을 것!

var prefix = "foo";
var myObject = {
    //prefix + "bar": "hello",
    //위와 같이 사용하면 예상하지 못한 '+'라며 SyntaxError가 뜬다.
    [prefix + "bar"]: "hello",
    //하지만 위와 같이 []로 계산식을 묶어주면 Error가 뜨지 않는다!!!
    [prefix + "baz"]: "world"
};

myObject["foobar"]; //hello
myObject["foobaz"]; //world

이제 object의 key값을 넣을 때 에도 계산을 할 수 있다!!!