- [ Frontend/TypeScript ][TypeScript] TypeScript 공부일지: 열거형 타입(enumerable type)(enum) [5/29 study]2024-05-29 14:06:15TypeScript 공부일지: 열거형 타입(enumerable type)(enum) ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 열거형 타입 (enumerable type)(enum)// enum 타입// 여러가지 값들에 각각 이름을 부여해 열거해두고 사용하는 타입// enum은 특별하게 컴파일 결과 사라지지 않음// 0이 관리자인지 일반유저인지 헷갈리는 경우가 있음 이럴때 enum type 사용enum Role { ADMIN = 0, USER = 1, GUEST = 2,}// 0,1,2 지정안해도 위에서부터 자동으로 0,1,2 순으로 지정됨// 만약에 ADMIN을 10으로 할당하면 자동으로 아래로 +1 씩 증가되면서 숫자 지정됨const uset1 = { ..
- [ Frontend/TypeScript ][TypeScript] TypeScript 공부일지: 타입 별칭, 인덱스 시그니쳐 [5/29 study]2024-05-29 14:02:20TypeScript 공부일지: 타입 별칭, 인덱스 시그니쳐 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 타입별칭// 타입 별칭 - 타입을 마치 변수처럼 정의해서 사용할 수 있음// 이러한 user가 많아질수록 타입 지정 코드 또한 많아짐type User = { id: number; name: string; nickname: string; birth: string; bio: string; location: string;};let user1: User = { id: 1, name: "은동혁", nickname: "동동이", birth: "1999.04.10", bio: "안녕하세요", location: "한국",};let user2: User = ..
- [ Frontend/TypeScript ][TypeScript] TypeScript 공부일지: 객체 [5/29 study]2024-05-29 13:52:29TypeScript 공부일지: 객체 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 객체// object// 객체 리터럴 타입let user: { id?: number; name: string;} = { id: 1, name: "은동혁",};let dog: { name: string; color: string;} = { name: "돌돌이", color: "gray",};let config: { readonly apiKey: string;} = { apiKey: "MY API KEY",}; ❗️ 마무리객체 리터럴 타입을 배웠는데 변수마다 이런식으로 지정하면 코드가 길어질 것 같고 뒤로가서 더 공부할수록 가독성이 좋은 코드를 만들 수 있을것같다. 오늘..
- [ Frontend/TypeScript ][TypeScript] TypeScript 공부일지: 배열과 튜플 [5/27 study]2024-05-27 14:46:09TypeScript 공부일지: 배열과 튜플 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 ❗️ 배열let numArr: number[] = [1, 2, 3];let strArr: string[] = ["hello", "im", "winter"];let boolArr: Array = [true, false, true];// 배열에 들어가는 요소들의 타입이 다양할 경우let multiArr: (string | number)[] = [1, "hello"];// 다차원 배열의 타입을 정의하는 방법let doubleArr: number[][] = [ [1, 2, 3], [4, 5],]; ❗️ 튜플 // 길이와 타입이 고정된 배열let tup1: [number, number] = ..
- [ Frontend/TypeScript ][TypeScript] TypeScript 공부일지: 원시타입 [5/27 study]2024-05-27 14:41:50TypeScript 공부일지: 원시타입 ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 오늘부터는 내가 공부한 내용을 vscode에 작성해보고 포스팅 해보려고 한다 ❗️numberlet num1: number = 123;let num2: number = -123;let num3: number = 0.123;let num4: number = -0.123;let num5: number = Infinity;let num6: number = -Infinity;let num7: number = NaN; ❗️stringlet str1: string = "hello";let str2: string = "hello";let str3: string = `hello`;let str4: str..
- [ Frontend/TypeScript ][TypeScript] TypeScript 접근제한자(public, protected, private, readonly) [5/26 study]2024-05-25 15:23:46TypeScript 접근제한자(public, protected, private, readonly) 타입스크립트에는 접근 제한자(Access modifier)인 public, protected, private를 지원하며, 이를 통해 외부에서 특정 메서드나 프로퍼티에 접근 범위를 지정할 수 있다. ❗️publicpublic은 어디에서나 접근할 수 있으며 생략 가능한 default 값이다.class Greeter { public greet() { console.log("hi!"); }}const g = new Greeter();g.greet(); ❗️protectedprotected는 해당 클래스 혹은 서브클래스의 인스턴스에서만 접근이 가능하다.class Greeter { public greet..
- [ Frontend/TypeScript ][TypeScript] TypeScript의 동작 원리 [5/25 study]2024-05-25 00:17:37TypeScript의 동작 원리 프로그래밍 언어의 실행대부분의 프로그래밍 언어는 컴퓨터 보다는 인간에게 더 친화적이고 영어에 가깝습니다. 그러므로 0과 1밖에 모르는 프로그램 코드를 컴퓨터가 해석하기 쉽게 변환해 주어야 합니다. 이런 작업을 ‘컴파일(Compile)’ 이라고 부릅니다. 코드를 컴파일 하여 컴퓨터가 이해하기 쉬운 형태로 바꿔주는 역할을 하는 프로그램을 ‘컴파일러’ 라고 부릅니다. 컴파일러는 우리가 작성한 코드를 AST(Abstract Syntax Tree, 추상 문법 트리)로 변환합니다. AST는 1차적으로 코드를 컴퓨터가 더 해석하기 쉽게 변경한 것 인데요. 공백이나 주석 탭 등 코드의 실행에 관계없는 요소들은 모두 제거하고 트리 형태의 자료구조에 코드를 분석해 저장한 형태를 말합니다...
- [ Frontend/TypeScript ][TypeScript] JavaScript만 사용하는 것과 비교해 TypeScript를 사용하는 이유 [5/25 study]2024-05-25 00:06:47JavaScript만 사용하는 것과 비교해 TypeScript를 사용하는 이유 ❗️타입 시스템타입 시스템이란 언어에서 사용하는 여러가지 값들을 묶어서 어떤 타입으로 정할지 결정하고 또 언제 어떻게 타입을 검사할지 등 우리가 프로그래밍 언어를 사용할때 타입과 관련해서 지켜야 하는 규칙들을 모아둔 체계입니다. 타입 시스템은 크게 두가지로 나눌 수 있는데 하나는 코드 실행 전에 모든 변수의 타입을 고정적으로 결정하는 정적 타입 시스템이있습니다. 다른 하나는 코드 실행 전에는 타입을 결정하지 않고 코드 실행하면서 유동적으로 변수의 타입을 결정하는 동적 타입 시스템이 있습니다. 정적 타입 시스템을 사용하는 언어에는 C나 Java 같은 엄격한 문법을 가진 언어들이 있습니다. 동적 타입 시스템을 사용하는 언어에는..
- [ Frontend/JavaScript ][JavaScript] 자바스크립트 내장함수(메서드) 정리 [5/23 study]2024-05-23 13:52:31자바스크립트 내장함수(메서드) 정리 내장 함수1) 타이머 함수setTimeout(function, millisecond) : 지정된 시간 후 함수를 한 번 실행(밀리초 단위)setInterval(function, millisecond) : 지정된 시간마다 함수를 반복 실행*위 두 함수는 타이머 id를 리턴값으로 가짐 -> id를 변수에 저장해둬야 중지 가능clearTimeout(id) : setTimeout 함수 중지clearInterval(id) : setInterval 함수 중지 2) 인코딩과 디코딩 함수escape(), unescape()영문 알파벳과 숫자, 일부 특수문자(@ * - _ + . /)를 제외하고 인코딩1바이트 문자는 %XX, 2바이트 문자는 %uXXXX 형태로 변환encodeURI..