Node.js 디자인패턴을 읽으며 요약/정리한 내용입니다.
"use strict"
문을 추가하여 쉽게 적용 가능// var 사용 예
if (false) {
var x = "hello";
}
console.log(x); // undefined
//------------------------------------
// let 사용 예
if (false) {
let x = "hello";
}
console.log(x); // ReferenceError: x is not defined
X -> {}, {}.name -> "John"
이고, 객체가 변경되는 것은 아님// Error
const x = 'This will never change';
x = '...'; // TypeError: Assignment to constant variable
//------------------------------------
// Not Error
const x = {}
x.name = 'John';
const numbers = [2, 6, 7, 8, 1];
// 생략 가능 예
const even = numbers.filter(x => x%2 === 0);
// 생략 불가능 예
const even = numbers.filter(x => {
if (x%2 === 0) {
console.log(x + ' is even!');
return true;
}
});
어휘 범위는 다른 서적에서는 Lexical Environment라고 표현하기도 하며, 화살표 함수를 사용하여 함수를 호출할 경우 this 값을 부모 블록의 값과 같은 것으로 바인딩하는 것이 아닌 this 자체를 바인딩 하지 않기 때문에 스코프 체인을 통해 부모 블록의 this를 참조하는 것
class Person {
constructor (name, surname, age) {
this.name = name;
this.surname = surname;
this.age = age;
}
getFullname () {
return this.name + ' ' + this.surname;
}
static older (person1, person2) {
return (person1.age >= person2.age) ? person1 : person2;
}
}
class PersonWithMiddlename extends Person {
constructor (name, middlename, surname, age) {
super(name, surname, age);
this.middlename = middlename;
}
getFullName() {
return this.name + '' + this.middlename + '' + this.surname;
}
}
클래스 구문을 통해 생성된 인스턴스는 과거의 방식과 실제 생성된 인스턴스가 다름
클래스 인스턴스는 클래스 객체로 표현되며, prototype 속성과__proto__
속성이 null로 표현됨
또한,#field
형식으로 private 필드, 메소드를 설정할 수 있음(ES2020부터 지원)
const namespace = '-webkit-';
const style = {
[namespace + 'box-sizing'] : 'border-box',
[namespace + 'box-shadow'] : '10px10px5px #888888'
};
const person = {
name: 'George',
surname: 'Boole',
get fullname () {
return this.name + '' + this.surname;
}
set fullname (fullname) {
let parts = fullname.split('');
this.name = parts[0];
this.surname = parts[1];
}
};
console.log(person.fullname); // George Boole
console.log(person.fullname = 'Alan Turing');
console.log(person.name); // Alan
// Map
const profiles = new Map();
profiles.set('twitter', '@adalovelace');
profiles.set('facebook', 'adalovelace');
profiles.set('googleplus', 'ada');
profiles.size; // 3
profiles.has('twitter'); // true
profiles.get('twitter'); // "@adalovelace"
profiles.has('youtube'); // false
profiles.delete('facebook');
profiles.has('facebook'); // false
profiles.get('facebook'); // undefined
for (const entry of profiles) {
console.log(entry);
}
// Set
const s = new Set([0, 1, 2, 3]);
s.add(3);
s.size; // 4
s.delete(0);
s.has(0); //false
for (const entry of s) {
console.log(entry);
}
// WeakMap
let obj = {};
const map = new WeakMap();
map.set(obj, {key: "some_value"});
console.log(map.get(obj)); // {key: "som_value"}
obj = undefined; // 다음 가비지 컬렉트 사이클에서 맴에 관련된 객체와 데이터가 정리됨
// WeakSet
let obj1 = {key: "val1"};
let obj2 = {key: "val2"};
const set = new WeakSet([obj1, obj2]);
console.log(set.has(obj1)); // true
obj1 = undefined; // obj1이 set에서 제거됨
console.log(set.has(obj1)); // false
${expression}
의 형식으로 사용하여 변수 또는 표현식을 삽입할 수 있음const name = "Leonardo";
const interests = ["arts", "architecture", "science", "music", "mathematics"];
const birth = { year: 1452, place: "Florence" };
const text = `${name} was an Italian polymath interested in many topics such as ${interests.join(', ')}. He was born in ${birth.year} in ${birth.place}`
console.log(text);