티스토리 뷰

이선 브라운의 러닝 자바스크립트 책을 학습하고 기억해둘 만 한 부분을 야생학습하여 정리하였습니다.

 

ES6 이전에는 키와 값을 연결하려면 객체를 이용해야 했지만 이럴경우 여러가지 단점이 존재합니다.

프로토타입 체인 때문에 의도치 않은 연결이 생기거나, 키는 반드시 문자열이나 심볼이어야 하므로 객체를 키로 쓸 수 없고 프로퍼티 순서를 보장해주지 않습니다.

 

Map 객체는 결함을 모두 해결했고 키와 값을 연결할 목적에 부합하기 위해 만들어 졌습니다. 아래는 Map을 사용하는 예시입니다.

const u1 = { name: 'Maple"};
const u2 = { name: 'Kale"};
const u3 = { name: 'Hun"};
const u4 = { name: 'James"};

const userRoles = new Map();

userRoles.set(u1, 'User');
userRoles.set(u2, 'User');
userRoles.set(u3, 'Admin');
//u4 James는 역할 X

set() 메서드는 체인으로 연결할 수 있어 간편하게 작성할 수 있습니다.

userRoles
	.set(u1, 'User')
	.set(u2, 'User')
	.set(u3, 'Admin');

혹은 생성자에 배열의 배열을 넘기는 형태로도 사용할 수 있습니다.

 

키를 통해 값을 확인할 때는 get() 메서드를 사용합니다. 맵에 존재하지 않는 키를 호출하면 undefined를 반환하고 이를 대비하기 위한 has() 메서드도 존재합니다.

 

set() 메서드는 존재하는 키를 첫번째 매개변수로, 바꿀 값을 두번째 매개변수로 받아 키의 값을 바꿉니다.

 

size 프로퍼티는 맵의 요소 숫자를 반환합니다.

 

맵의 요소를 지울 때는 delete() 메서드를, 맵의 요소를 모두 지울 때는 clear() 메서드를 활용합니다.

 

keys(), values(), entries() 메서드는 각각 키, 값, 첫번째 요소가 키고 두번째 요소가 값인 배열을 각각 반환합니다.

이들 메서드가 반환하는 것은 모드 이터러블 객체이므로 for...of 루프를 사용할 수 있습니다. 

[...userRoles.values()];

이터러블 객체보다 배열이 필요하다면 확산연산자를 응용할 수도 있습니다.

 

위크맵

WeakMap은 다음 차이점을 제외하고 Map과 동일합니다.

  • 키는 반드시 객체여야 합니다.
  • WeakMap의 키는 가비지 콜렉션에 포함될 수 있습니다.
  • WeakMap은 이터러블이 아니며 clear() 메서드도 없습니다.

자바스크립트는 객체를 참조하는 한 메모리에 계속 유지시키기 때문에 맵의 키인 객체가 있다면 맵이 존재하는 한 메모리에 계속 유지합니다. 이로인해 발생할 수 있는 참조문제를 방지하기 위해 WeakMap이 존재합니다. 같은 논리에 연장선으로 WeakMap이 이터러블이 될 수 없는 이유도 가비지 콜렉션 중인 객체를 노출할 위험이 크기 때문입니다.

 

WeakMap의 특징은 객체 인스턴스의 전용(private) 키를 저장하기에 적합합니다.

const SecretHolder = (function(){
	const secrets = new WeakMap();
    return class {
    setSecret(secret){
    		secrets.set(this, secret);
        }
        getSecret(){
        	return secrets.get

 

셋은 중복을 허용하지 않는 데이터 집합입니다. 

const roles = new Set();

roles.add("User");

roles.add("Admin");

셋의 장점은 추가하려는 것이 셋에 이미 있는지 확인할 필요가 없다는 점입니다. 이미 있다면, 아무 일도 일어나지 않습니다.

 

맵과 마찬가지로 size 프로퍼티와 delete() 메서드가 존재합니다.

위크셋

위크맵과 동일하게 객체만 포함될 수 있으며 이 객체들은 가비지 콜렉션의 대상이 됩니다. 또한 이터러블이 아니기 때문에 사용빈도가 적습니다.

 

 

예외와 에러 처리

예상한 에러와 예상치 못한 에러, 즉 예외를 다루기 위해 자바스크립트에는 Error 객체가 내장되어 있습니다.

Error 인스턴스를 만들면서 에러 메세지를 지정할 수 있습니다.

const err = new Error('invalid email');

 

try/catch와 예외 처리

예외 처리를 위해서 try...catch 문을 사용합니다. 에러가 일어날 수 있는 코드를 try...catch문으로 감싸 예외처리를 구현할 수 있습니다.

const email = null;

try {
	const validatedEmail = validateEmail(email); 
    // validateEmail 함수는 이메일 형식이 아니면 Error 객체를 반환합니다.
    if (validatedEmail instanceof Error) {
    	console.error('Error');
    } else {
    	console.log(`${validatedEmail}`);
    }
catch(err) {
	console.error(`Error: ${err.message}`);
}

 

에러 일으키기

에러가 일어나기만을 기다리지 않고 직접 에러를 일으켜 예외 처리 작업을 시작할 수 있습니다. throw 절로 객체 뿐만 아니라 숫자나 문자열 등 다양한 값을 넘길 수 있지만 Error 객체를 넘길 것을 권장합니다.

function billPay(amount, payee, account) {
	if(amount > accout.balance)
    	throw new Error("insufficient funds");
    
    account.transfer(payee, amount);
}

 

예외 처리와 호출 스택

프로그램이 함수를 호출하고 또 그함수가 다른 함수를 호출하고를 반복될 때 한 함수가 종료되면 이전 함수로 돌아가는, 즉 정상적인 코드 실행 흐름을 위해 자바스크립트 인터프리터는 이런 과정을 모두 추적하고, 완료되지 않은 함수가 쌓이는 것을 호출스택이라고 합니다. 만약 어느 스택에서 에러가 나면 캐치될 때까지 호출스택을 따라 올라갑니다. Error 객체에는 스택을 문자열로 표현한 stack 프로퍼티가 있어 캐치한 후 스택의 전후상황을 이해할 수 있습니다.

 

try...catch...finally

만약 try 블록의 코드가 HTTP 연결이나 파일 같은 자원을 처리할 때면 에러가 있든 없든 어느 시점에서는 자원을 해제해야 합니다. try 블록에서는 코드 어디서든 에러가 일어나 자원을 해제할 기회를 놓칠 수 있고 catch문 또한 에러가 나면 실행되지 않기 때문에 안전하지 않습니다. finally 블록은 에러의 유무와는 별개로 반드시 호출됩니다.

'Running JS 요약' 카테고리의 다른 글

JS - 함수와 추상적 사고  (0) 2021.01.21
JS - 이터레이터와 제너레이터  (0) 2021.01.20
JS - 객체와 객체지향 프로그래밍  (0) 2021.01.11
JS - 배열  (0) 2021.01.06
JS - 스코프  (0) 2021.01.05
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG
more
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함