TypeScript 공부일지: 원시타입  ❗️주의지극히 개인 공부한 내용을 올린 거기 때문에 이해하지 못할 수도 있음 오늘부터는 내가 공부한 내용을 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..

TypeScript 접근제한자(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..

TypeScript의 동작 원리  프로그래밍 언어의 실행대부분의 프로그래밍 언어는 컴퓨터 보다는 인간에게 더 친화적이고 영어에 가깝습니다. 그러므로 0과 1밖에 모르는 프로그램 코드를 컴퓨터가 해석하기 쉽게 변환해 주어야 합니다. 이런 작업을 ‘컴파일(Compile)’ 이라고 부릅니다. 코드를 컴파일 하여 컴퓨터가 이해하기 쉬운 형태로 바꿔주는 역할을 하는 프로그램을 ‘컴파일러’ 라고 부릅니다. 컴파일러는 우리가 작성한 코드를 AST(Abstract Syntax Tree, 추상 문법 트리)로 변환합니다. AST는 1차적으로 코드를 컴퓨터가 더 해석하기 쉽게 변경한 것 인데요. 공백이나 주석 탭 등 코드의 실행에 관계없는 요소들은 모두 제거하고 트리 형태의 자료구조에 코드를 분석해 저장한 형태를 말합니다...

JavaScript만 사용하는 것과 비교해 TypeScript를 사용하는 이유   ❗️타입 시스템타입 시스템이란 언어에서 사용하는 여러가지 값들을 묶어서 어떤 타입으로 정할지 결정하고 또 언제 어떻게 타입을 검사할지 등 우리가 프로그래밍 언어를 사용할때 타입과 관련해서 지켜야 하는 규칙들을 모아둔 체계입니다. 타입 시스템은 크게 두가지로 나눌 수 있는데 하나는 코드 실행 전에 모든 변수의 타입을 고정적으로 결정하는 정적 타입 시스템이있습니다. 다른 하나는 코드 실행 전에는 타입을 결정하지 않고 코드 실행하면서 유동적으로 변수의 타입을 결정하는 동적 타입 시스템이 있습니다. 정적 타입 시스템을 사용하는 언어에는 C나 Java 같은 엄격한 문법을 가진 언어들이 있습니다. 동적 타입 시스템을 사용하는 언어에는..

자바스크립트 내장함수(메서드) 정리   내장 함수1) 타이머 함수setTimeout(function, millisecond) : 지정된 시간 후 함수를 한 번 실행(밀리초 단위)setInterval(function, millisecond) : 지정된 시간마다 함수를 반복 실행*위 두 함수는 타이머 id를 리턴값으로 가짐 -> id를 변수에 저장해둬야 중지 가능clearTimeout(id) : setTimeout 함수 중지clearInterval(id) : setInterval 함수 중지 2) 인코딩과 디코딩 함수escape(), unescape()영문 알파벳과 숫자, 일부 특수문자(@ * - _ + . /)를 제외하고 인코딩1바이트 문자는 %XX, 2바이트 문자는 %uXXXX 형태로 변환encodeURI..

HTML 특수문자 사용하기     페이지 넘길때 사용하는 , >>등 이러한 특수문자를 어떻게 사용하는지 서치 해보았다.나같은 경우 span 태그안에 ex) ‹ 이렇게 작성하면 해당 문자의 특수문자가 나온다 ❗️사이트 공유https://www.digitalmediaminute.com/reference/entity/index.php HTML EntitiesThis page contains the 252 allowed entities in HTML 4 and XHTML 1.0, as outlined in section 24 of the official HTML 4 specifications, published by the W3C. If you find it helpful we'd really a..

HTML input 태그 readonly 속성    정의 및 특징 태그의 readonly 속성은 요소의 입력 필드가 읽기 전용임을 명시합니다. 읽기 전용으로 설정된 입력 필드는 사용자가 수정할 수는 없지만, 해당 내용을 하이라이트하거나 복사할 수는 있습니다.따라서 이 속성을 사용하면 특정 조건이 충족될 때까지 사용자가 입력 필드의 내용을 수정할 수 없도록 설정하고, 특정 조건이 충족되면 자바스크립트 등으로 readonly 속성값을 삭제하여 사용자가 입력 필드를 수정할 수 있도록 조절할 수 있습니다. disabled 속성이 명시된 입력 필드의 값은 서버로 제출되지 않지만, readonly 속성이 명시된 입력 필드의 값은 서버로 제출됩니다. readonly 속성은 불리언(boolean) 속성입니다.불리언 ..

JavaScript 현재 페이지 새로고침하는 방법     ❗️location 객체에서 제공하는 reload() 메서드를 사용하는 것입니다.location은 전역 객체인 window의 프로퍼티이므로 아래 두 가지 방법으로 reload() 메서드를 호출할 수 있습니다.location.reload();window.location.reload(); 매개변수 존재하지 않습니다.반환 결과 존재하지 않습니다. 참고로 reload()대신 replace()를 사용하고 가로안에 위치를 지정해주면 해당위치로 이동한다.   🔥참고자료https://developer.mozilla.org/ko/docs/Web/API/Location/reload Location.reload() - Web API | MDNLocation.relo..

CSS 미디어 쿼리 문법    only | not의 위치에는 말 그대로 only 키워드 또는 not 키워드가 들어가게 되는데  only 키워드는 뒤의 조건 만 , not 키워드는 뒤의 조건을 제외한 조건을 뜻 합니다. 미디어 쿼리를 지원하지 않는 브라우저는 only 키워드가 쿼리 안의 내용이 무시되어 실행 되지 않습니다. only 키워드는 큰 의미는 없지만 미디어 쿼리를 지원하는 브라우저를 대상으로 할 경우 적어주는 것이 좋습니다. ❗️미디어 타입의 종류 ( 많지만 자주 쓰이는 것만 적어 봤습니다.)- all : 모든 미디어 타입- print : 인쇄 용도- screen : 컴퓨터 스크린 ❗️미디어 쿼리문의 속성과 속성 값 - width: 웹페이지의 가로 길이를 판단합니다.- height: 웹페이지의 세..