[JavaScript] 타입별 메서드와 제너레이트

타입별 메서드

숫자형(number)

e의 사용

숫자를 입력할 때 100000000과 같은 큰 수를 입력해야 한다면 0을 치는게 헷갈릴 수 있다. 따라서 e를 쓰고 그 뒤에 0의 개수를 입력하면 된다.

const billion = 1000000000;
const _billion = 1e9

Math 함수

삼각함수

• Math.sin(radian) : 라디안의 사인값을 반환하는 함수이다.
• Math.cos(radian) : 라디안의 코사인값을 반환하는 함수이다.

최대/최소

• Math.max( num ) : 인수들 중 가장 큰 값을 반환하는 함수이다.
• Math.min( num ) : 인수들 중 가장 작은값을 반환하는 함수이다.

문자형 (string)

문자는 Immutable (불변) 이다. 따라서 문자열을 수정하기 위해서는 문자를 슬라이싱해 자른 뒤 원하는 값을 이어 붙히는 형태로 사용해야 한다.

슬라이싱

const str = '자바스크립트';

const result1 = str.substr(0, 2);

// 자바

0번 인덱스부터 2번 인덱스 전까지 자른다.

indexof

해당 문자열이 어느 위치에 있는지 확인한다. 응용하면 사용자의 브라우저를 알 수 있다.

function checkBrowser() {
  const agent = window.navigator.userAgent.toLowerCase();
  let browserName;

  switch (true) {
    case agent.indexOf('edg') > -1:
      browserName = 'MS Edge';
      break;
    case agent.indexOf('chrome') > -1 && !!window.chrome:
      browserName = 'Chrome';
      break;
    case agent.indexOf('safari') > -1:
      browserName = 'Apple Safari';
      break;
    case agent.indexOf('firefox') > -1:
      browserName = 'FireFox';
      break;
    case agent.indexOf('trident') > -1:
      browserName = 'IE';
      break;
    default:
      browserName = '무슨 브라우저에요..?';
  }
  return browserName;
}

배열

데큐(deque) 연산이 가능한 자료구조. 처음이나 끝에 있는 데이터를 넣거나 뺄 수 있다.

큐 (FIFO)

선입선출의 특징을 가진 자료구조. 가장 먼저 들어온 데이터가 가장 먼저 나간다.

배열에서는 다음 메서드를 이용해 사용 가능하다.

• push : 배열의 끝에 값을 추가한다.
• shift : 배열의 앞에있는 값을 반환하면 배열에서는 그 값이 빠진다.

스택 (LIFO)

가장 마지막에 들어온 데이터가 가장 먼저 나가는 자료구조.

• push : 배열의 끝에 값을 추가한다.
• pop : 배열의 마지막에 있는 값을 반환한다.

제너레이트

배열과 유사하게 iterable(반복가능)하다. 특징은 다음과 같다.

• 지연계산
• 무한 시퀀스생성
• 반복된 계산 가능
• …

처음에는 제너레이터를 사용하는 이유를 몰랐지만 성능 측면에서 제너레이터는 매우 유용하다. 배열에 담긴 데이터는 처음부터 모든 배열의 데이터를 메모리에 올려야 한다.

하지만 제너레이트는 하나의 데이터와 다음 데이터가 있는지만 알고있으면 된다. 이런 작동방식은 데이터의 양이 많을수록 성능을 크게 향상시킬 수 있다.

비동기적 지연계산

또한 반복 중 멈출 수 있다는 특징을 가지고 있다. next() 를 호출해 다음으로 이동하지 않으면 함수는 멈춰있게 되고 이로 인한 비동기처리가 가능하다.

예를 들어 API 요청이 순차적으로 오는 상황에서 요청이 온다면 어떤 기능을 실행한다고 가정하자. 처음 요청을 실행하는 도중에는 그 다음 요청이 어떻게 올지 모른다. 따라서 데이터 처리를 할 수 없지만 제너레이트를 이용한다면 가능하다.

try - catch

try문에 에러가 있다면 catch가 잡는 구문. 에러처리를 어떻게 할 지 결정한다. 에러의 유무 관계없이 실행되어야 하는 구문이 있다면 finally 를 이용한다.

try {

  // 코드...

} catch (err) {

  // 에러 핸들링

} finally{

	// 항상 실행되는 문장
	
}

하지만 자바스크립트는 에러를 잘 내지 않는다. 그 예중에 하나가 객체에 없는 값을 호출한다면 에러가 나야하지만 js는 undefined를 반환한다. 이런 경우를 조심하고 try-catch를 사용해야한다.