Frontend

JavaScript Number 객체 JavaScript의 Number 객체는 숫자를 다루는 타입입니다. 변수 또는 객체의 프로퍼티 값이 숫자라면 Number 객체의 프로퍼티와 메서드를 사용할 수 있습니다. 이렇게 별도의 객체 생성없이 프로퍼티와 메서드를 사용할 수 있는 것은 Number 객체가 wrapper 객체이기 때문입니다. * wrapper 객체는 원시 타입이 wrapper 객체의 프로퍼티나 메서드를 호출할 때, 일시적으로 연관된 wrapper 객체로 변환하여 prototype 객체를 공유합니다. JavaScript에서 숫자의 표기는 IEEE 754 형식을 따르고 있고 32비트까지 표현이 가능합니다. IEEE 754 형식은 부동소수점을 표현하는 가장 널리 쓰이는 표준이며 +0, -0, Infini..

JavaScript 동등 연산자와 일치 연산자 JavaScript에서 비교 연산자는 피연산자를 비교하여 boolean 값을 반환합니다. 비교 연산자의 동등 연산자와 일치 연산자가 피연산자 값의 일치 여부를 판별합니다. 동등 연산자와 일치 연산자는 모두 값의 일치 여부를 판별하지만 그 기준에서 차이가 있습니다. 1. 동등 연산자 동등 연산자(==, abstract equality)로 피연산자를 비교할 때는 JavaScript 엔진에 의해 암묵적인 타입 변환이 먼저 이루어집니다. 따라서 좌항과 우항의 타입이 다르더라도 값이 같다면 true를 반환합니다. 1 2 3 4 let a = 10; let b = '10'; console.log(a == b); // true cs 동등 연산자를 사용하면 편리한 경우도 ..

JavaScript null 과 undefined JavaScript에서 null은 값이 없음을 명시하기 위해 사용하고 undefined는 값이 할당되지 않았음을 명시하기 위해 사용합니다. 1. null 과 undefined 의 차이 null 값이 없음을 표현하기 위한 값 의도적으로 값이 없음을 표현하려고할 때 사용 변수에 null을 할당하면 값이 해제됨 undefined 값이 할당되지 않은 상태를 표현하기 위한 값 변수 선언 이후 값이 할당되지 않은 경우에 JavaScript 엔진이 초기화한 값 존재하지 않는 객체 프로퍼티에 접근한 경우 반환되는 값 undefined 값을 갖는 변수는 할당을 통해 값을 갖게 됨 1 2 3 4 5 6 7 8 9 let name; console.log(name); // u..

JavaScript 데이터 타입 데이터 타입(Data Type)은 프로그래밍 언어에서 사용 가능한 데이터의 종류를 의미합니다. JavaScript의 모든 값은 데이터 타입을 갖게 되는데 ECMAScript(ES6) 기준으로 다음과 같이 7개의 데이터 타입이 제공됩니다. 원시 타입(Primitive Type) - number - string - boolean - undefined - null - symbol (ES6) 객체/참조 타입(Object/Reference Type) - object 1. 원시 타입(Primitive Type) 원시 타입의 값은 변경 불가능한 값(Immutable Value)이며, 값에 의한 전달(pass-by-value)이 이루어집니다. 1.1. number JavaScript에서..

JavaScript Date 객체 JavaScript의 Date 객체는 날짜와 시간에 관련된 메서드를 제공하는 빌트인 객체 입니다. Date 생성자로 생성된 Date 객체는 내부적으로 값을 갖는데 이 값에는 유닉스 시간(Unix time)이 사용됩니다. Unix Time Unix Time은 POSIX 시간이나 Epoch 시간이라고 부르기도 합니다. 1970-01-01 00:00:00(UTC) 일시를 기준으로 현재까지의 시간을 나타내는데 JavaScript에서는 밀리초(millisecond) 단위로 나타냅니다. UTC/GMT UTC(Coordinated Universal Time, 세계협정시)는 GMT(Greenwich Mean Time, 그리니치 평균시)에 기반하므로 UTC와 GMT는 초의 소숫점 단위에..

JavaScript String 객체 프로그래밍에서 문자열은 일반적으로 문자 인코딩과 관련된 문자를 대표하는 일련의 값을 저장하는 자료형입니다. 문자열 자료형으로 선언된 변수의 경우, 일반적으로 미리 정의된 메모리에 자료를 할당합니다. 문자열이 소스 코드상에 보이는 경우엔 해당 문자열을 String literal 이라고 합니다. JavaScript의 String 객체는 문자열을 다룰 때 유용한 프로퍼티와 메소드를 제공하는 래퍼(wrapper) 객체입니다. 변수 또는 객체가 문자열을 값으로 가지고 있다면 String 객체의 별도 생성없이 String 객체의 프로퍼티와 메소드를 사용할 수 있습니다. 1. 문자열 1.1. 문자열 선언 JavaScript에서는 문자 하나당 UTF-16 코드 문자가 사용됩니다. ..

TypeScript 제네릭 TypeScript의 제네릭에 대해 알아보겠습니다. 1. 제네릭 TypeScript는 정적 타입 언어이기 때문에 함수 또는 클래스를 선언할 때 매개변수나 반환값의 타입을 정의해야 합니다. 하지만 이렇게 특정 타입을 위해 만들어진 함수나 클래스를 재사용 해야하는 경우가 발생하고 이 때 제네릭을 사용합니다. 2. 제네릭이 필요한 경우 다음은 자료구조 큐(Queue)를 TypeScript로 구현한 예제입니다. 123456789101112131415161718192021class Queue { protected data: any = []; constructor() {} push(item: any): void { this.data.push(item); } pop(): void { ret..

TypeScript 인터페이스 TypeScript의 인터페이스에 대해 알아보겠습니다. 1. 인터페이스 인터페이스(Interface)는 일반적으로 타입 체크를 위해 사용되며 변수, 함수, 클래스에 사용할 수 있습니다. 인터페이스는 여러가지 타입의 프로퍼티로 새로운 타입을 정의하는 것과 유사하며, 정의된 인터페이스는 일관성을 유지하기 위해 내부에 선언된 프로퍼티 또는 메소드의 구현을 강제하는 특징이 있습니다. 인터페이스는 클래스와 유사하지만 인스턴스 생성이 불가능하고 모든 메소드는 추상 메소드로 이루어져 있습니다. 또한 인터페이스의 추상 메소드는 abstract 키워드를 사용하지 않는다는 특징이 있습니다. 또한 ES6에서 지원하지 않고 TypeScript에서만 지원합니다. 2. 인터페이스의 사용 인터페이스는..

TypeScript 클래스 TypeScript의 클래스에 대해 알아보겠습니다. ES(ECMAScript)6에서 도입되었습니다. 클래스는 클래스 기반 언어에 익숙한 개발자가 보다 빠르게 학습할 수 있는 문법을 제시하지만 새로운 객체지향 모델을 제공하는 것은 아닙니다. 클래스도 프로토타입 기반 패턴의 함수를 보다 직관적인 문법으로 보기 쉽게 만든 것입니다. TypeScript에서 지원하는 클래스는 ES6와 유사하지만 몇 가지 다른 고유한 기능이 있습니다. 1. 클래스 ES6의 클래스에서는 클래스 내부에 프로퍼티를 선언할 수가 없어서 생성자 안에서 선언해야 하지만, TypeScript의 클래스는 클래스 내부에 프로퍼티 선언이 가능하고 사용할 프로퍼티를 먼저 선언해줘야 합니다. 123456789101112131..