교육 (Today I Learned)/Hanaro

[Hanaro] 14일차 / JavaScript (객체 지향 프로그램, iterator&generator, map&set, Number&Math&Date)

Bay Im 2024. 2. 2. 09:03

JavaScript - 객체 지향 프로그램

  • 정적 필드 / 메소드 - Class(Static) Field / Method
    • 특정 인스턴스와 무관하고 Class에 존재하는 함수(method)
    • static 영역에 생성
    • 인스턴스 프로퍼티를 참조할 수 없다.
    • JavaScript는 public, private 만 있다! proctected 없음
  • Singleton Pattern
    • 싱글톤 패턴 클래스 가져올 때 new 사용하지 말고 const 변수 = 클래스.getInstance(); 형식으로 가져온다.
      • getInstance()
      static getInstace() {
      	return this.#_instance || new this();
      }
      
  • Overriding
    • 부모(super)의 함수(method)를 재정의
  • Accessor Property
    • 특정 인스턴스와 무관하고 class에 존재하는 함수(method)
  • Proxy object(functions) - Reflect, AOP
    • 객체의 특정 동작을 가로채기(hooking)해서 추가 동작 수행
    • 용도
      • 객체의 작업에 대한 로깅(기록)
      • 잘못된 접근에 오류 일으키기(validation check)
      • 기능 제어(읽기 전용 등)
      • 객체의 정보 숨기기
    • const proxyObj = new Proxy(targetObject, handler);
  • property 정의
    • Object.defineProperties(클래스이름.prototype, {…})
  • 상속(extends) - SuperClass & SubClass
    • prototype chain을 통한 모든 데이터와 기능을 상속
  • OOP - 상속과 다형성
    • Class - Interface - Absttact
    • 상속(inheritance)
      • 부모의 구현체를 부여받는다.
    • 구현(implements)
      • 인터페이스에 정의된 함수 구햔한다.
    • 추상 클래스(abstract class)
  • 다중 상속(Multiple Inheritance)
    • 충돌 위험

 

JavaScript - 이터레이터와 제너레이터

  • 이터레이터 (iterator)
    • iterator은 pointer! 현재 어디에 있고 다음엔 어디로 가는지 value, done, next()를 이용하여 더 쓸모있는 동작이 가능한 객체를 만든다.
    • Sysmbol.iterator 구현 → 실행하면 iterator literal 반환
  • 제너레이터 (generator)
    • function*(제너레이터 함수)의 실행을 제어하는 함수
    • generator를 호출하면 iterator를 얻는다.
    • function* ~ yield - iterator를 return하고 일시정지한 상태로 시작

 

JavaScript - map과 set

  • 맵(map)
    • new Map(), new Map([ [key1, value1], [key2, value2] ]) - 키: 값, 키는 객체도 가능
    • 문자열이나 Symbol만 키로 가능하다. 객체나 비문자형은 키가 될 수 없다.
    • 프로퍼티 순서 보장안된다.
    • length랑 size 없다.
    • iterator 반환하는 keys, values, entries 함수 없다.
    • has, set, get, delete, clear 메소드도 없다.
  • 위크맵(WeakMap)
    • new WeakMap(), new WeakMap([ [key1, value1], [key2, value2] ]) - 키: 값, 키는 객체만 가능
    • key는 Object만 가능하다.
    • iterator 안된다. keys, values, entries 메소드 없다.
    • size, clear 메소드 없다.
  • 셋(Set)
    • 중복을 허용하지 않는 데이터 집합
    • new Set(), new Set([value1, value2, value3, …])
    • has(k), add(k, v), delete(k), keys(), values(), entries(), size
  • 위크셋(WeakSet)
    • new WeakSet(), new WeakSet([hong, Kim, …]) - 값(객체만 가능)
    • value는 object만 가능하다.
    • size, clear 메소드 없다.
    • add, has, delete 메소드만 있다.
    • 해당 객체가 존재하는지 판단하는 용도로 주로 사용

 

JavaScript - Number, Math, Date

  • Number
    • new Number(n), Number(n)
      • new Number()은 [[NumberData]]에 0 할당
  • Number.NaN / Number.EPSILON
    • Number.Nan
      • 숫자가 아니다.
    • Number.EPSILON
      • 부동 소수점 문제 해결
      • 1과 1보다 큰 숫자 중 가장 작은 차이 값
  • Number.isFinite() / Number.isSafeInteger()
    • Number.isFinite()
      • isFinite()는 인수를 암묵적 숫자 형변환
    • Number.isSafeInteger()
  • Number.prototype.
    • Number.prototype.toExponential()
    • Number.prototype.toFixed()
      • 소수점 자리 지정: string
    • Number.prototype.toPrecision()
      • 전체 자릿수 지정: string
    • Number.prototype.toString()
  • Math
    • 수학 관련 상수와 함수 제공
    • Math Constant Value (Number.*)
      • Math.PI (3.1415…)
      • Math.E (2.7182…)
    • Number Static Method (Number.*)
      • abs(): 절대값
      • round(): 반올림
      • ceil(): 올림
      • floor(): 내림
      • sqrt(): 제곱근
      • random(): 0 이상 1 미만 실수 난수
        • Math.floor( (Math.random() * 10) + 1): 1~10 사이의 난수
      • pow(): 지수
      • max(), min(): 최대값, 최소값
  • BigInt (큰 정수)
    • 2^53 보다 큰 정수, 10억 비트까지 표현
  • 날짜와 시간 Date
    • new Date(), Date()
      • ex) 1970년 1월 1일 0시 0분 0초(UTC)