핵심 차이 요약구분JavaScriptTypeScript타입동적 타입(실행 시 결정)정적 타입(컴파일 시 결정)타입 표기없음: 타입명 사용(: string, : number 등)파일 확장자.js.ts(React → .tsx)컴파일브라우저에서 직접 실행TypeScript → JavaScript 로 변환 필요(tsc)장점빠르게 작성 가능, 유연함타입 안정성, 에러 조기 발견, 유지보수 용이 변수 선언 비교변수의 타입 지정// JavaScriptlet name = "한화"let age = 25 : string, : number → 타입을 명시(컴파일 시에만 사용, JS에서는 사라짐)타입을 생략하면 타입 추론으로 자동 판별let name = "한화" // TypeScript 가 자동으로 string 타입으로 ..

Javascript 와 TypeScript 문법 비교

핵심 차이 요약구분JavaScriptTypeScript타입동적 타입(실행 시 결정)정적 타입(컴파일 시 결정)타입 표기없음: 타입명 사용(: string, : number 등)파일 확장자.js.ts(React → .tsx)컴파일브라우저에서 직접 실행TypeScript → JavaScript 로 변환 필요(tsc)장점빠르게 작성 가능, 유연함타입 안정성, 에러 조기 발견, 유지보수 용이 변수 선언 비교변수의 타입 지정// JavaScriptlet name = "한화"let age = 25 : string, : number → 타입을 명시(컴파일 시에만 사용, JS에서는 사라짐)타입을 생략하면 타입 추론으로 자동 판별let name = "한화" // TypeScript 가 자동으로 string 타입으로 ..

14:41:53

에러 내용은 아래와 같다.Modal 창을 제어하다가 Modal 창을 닫을 때 숨겨질 영역안의 버튼이나 input에 포커스가 남아 있으면, 보조기술 입장에서는포커스는 거기에 있는데 그 역역은 숨겨져 있는 모순 상태가 된다. 즉, 본인은 Modal 창을 닫을 때 닫기 버튼에 대한 포커싱이 남아있어서 브라우저 콘솔창에 경고가 찍혔다. 원인은 Bootstrap 의 modal 속성에 aria-hidden="true" 를 적용하자 브라우저가 "포커스된 요소를 숨기면 안된다" 고경고를 띄운것이다.Blocked aria-hidden on an element because its descendant retained focus. The focus must not be hidden from assistive technolo..

new Promise 로 return 을 하는 함수가 있다.Promise 함수 내부에서 jquery 의 ajax 를 통해 api 요청을 한 후 count 값이 0일 경우 "return;" 을 사용했더니promise 를 await 로 호출한 부분 이후의 로직이 실행되지 않았다. 이유는 new Promise 가 resolve 또는 reject 를 줄 때 까지 await 는 계속 대기하고 있기 때문에이후 로직이 실행되지 않는다. new Promise 함수 예시function checkData() { return new Promise((resolve, reject) => { $.ajax({ url: '/api/data', success: (response..

브라우저가 클라이언트로부터 요청을 받고 서버로부터 리소스를 받아 처리하는 과정이다. 🌐 1. 클라이언트가 서버에 접근 (HTTP Request) 사용자가 URL 을 입력하거나 링크를 클릭하면 브라우저는 다음을 수행한다.DNS 조회 → IP 주소 획득서버와 TCP 연결HTTPS 면 SSL/TLS 핸드셰이크서버에 HTTP 요청 전송(GET /index.html) 📦 2. 서버가 HTML, CSS, JS 등 리소스를 응답 서버는 요청된 HTML 문서를 먼저 보내고,HTML 에 링크된 CSS/JS/이미지 파일들을 동시에 추가 요청하게 된다. 🧩 3. HTML 파싱 → DOM 트리(DOM Tree) 생성 HTML 문서는 문자열이므로 이를 분석해 DOM(Document Object Model) 트리를 만..

🧠 프로토타입이란?프로토타입은 Javascript 에서 객체들이 서로 메서드나 속성을 공유하도록 하는 메커니즘이다.모든 객체는 자신의 부모 역할을 하는 또 다른 객체를 참조하고, 그 부모 객체를 통해 공통 기능을 상속받는 구조이다. 이 구조를 프로토타입 체인(prototype chain) 이라고 한다. 🧩 함수와 프로토타입의 관계Javascript 에서 모든 함수(Function) 는 기본적으로 하나의 prototype 객체를 자동으로 가지고 있다.함수 생성 시 자동으로 prototype 객체가 생긴다. 1. Obo 라는 함수 생성Obo 함수 생성 시 prototype 객체가 자동으로 생성 2. Obo 프로토 타입 객체의 constructor 멤버변수Obo 함수의 프로토타입 객체는 construc..

선택적 체이닝(Optional Chaining)중첩된 객체의 프로퍼티나 메서드에 접근할 때, 중간에 null 또는 undefined 가 있을 경우 에러 없이undefined 를 반환문법 : 객체 접근 시 "?." 를 사용null 이나 undefined 일 경우 접근을 중단하고 즉시 undefined 반환 예시const person = { name: "John", address: { city: "New York", zipCode: "10001" }};// 기존 방식 (에러 발생 위험)console.log(person.address.zipCode); // "10001"console.log(person.contact.phone); // 오류: cannot read property 'phone'..