ALL

📦 JavaScript에서 상속(Inheritance) 구조1. 개요JavaScript는 클래스 기반 상속이 아닌 프로토타입 기반 상속을 사용한다.객체는 자신의 프로퍼티에 없으면 proto 를 따라 부모의 프로퍼티를 탐색한다.함수의 prototype과 인스턴스의 __proto__를 연결함으로써 상속 구조가 형성된다.2. 상속의 목적과 개념공통된 속성 및 메서드를 재사용하여 객체 간 중복 제거하위 객체가 상위 객체의 메서드 및 속성에 접근할 수 있도록 상속 체계를 만든다JavaScript에서는 __proto__ 체인을 통해 메서드를 찾아간다3. 프로토타입 기반 상속의 원리function Person(name) { this.name = name;}Person.prototype.introduce = fun..

📦 JavaScript에서 Prototype과 proto 체계1. 개요자바스크립트는 프로토타입 기반(prototype-based) 언어이다.객체는 proto 링크를 통해 상속 체인을 형성한다.함수(Function)와 객체(Object)는 prototype, proto 체계를 통해 긴밀히 연결된다.함수는 [[Call]]과 [[Construct]] 내부 슬롯을 가지는 특별한 객체이다.2. prototype과 proto의 역할2.1 prototype함수(Function)가 가진 "설계도 객체". (일반 객체는 존재하지 않는다. typeof로 확인하면 undefine)new 키워드로 인스턴스 생성 시, 새 객체의 __proto__가 생성자의 prototype으로 설정된다.즉 prototype은 내 자식에게 물..

𝒇 함수1. js에서 함수란자바스크립트에서 함수는 일급 객체(first-class citizen)로 취급되며, 이는 함수를 변수에 할당하거나, 인자로 전달하거나, 반환값으로 사용할 수 있음을 의미한다.자바스크립트의 함수는 다음과 같은 특징을 가진다:재사용 가능한 코드 블록이다.클로저(Closure)를 형성하여 외부 스코프에 접근할 수 있다.함수 표현식과 함수 선언식을 통해 정의할 수 있다.익명 함수, 화살표 함수, 즉시 실행 함수(IIFE) 등 다양한 형태를 가질 수 있다.function sayHello() { console.log("Hello, World!");}const greet = function() { console.log("Hi!");};const arrowGreet = () =>..

📦 javascript에서 객체란?1. 개요자바스크립트에서 객체(Object)는 여러 값을 key-value 쌍으로 저장하는 데이터 구조동적 언어인 JavaScript의 특성상 객체는 동적으로 프로퍼티를 추가하거나 수정할 수 있는 능력을 가짐객체는 아래와 같이 중괄호 {}를 사용하여 생성할 수 있다let obj = { a: 10, b: 20 }; 위 예제에서 a와 b는 key이고, 10과 20은 value자바스크립트의 객체는 key가 문자열이어야 한다는 점이 특징이며, value는 다양한 데이터 타입이 될 수 있음그럼 JavaScript의 객체가 메모리상에서 어떻게 관리되는지, 그리고 C/C++ 구조체나 클래스와는 어떻게 다른지 궁금했고, 이 문서를 작성하게 된 가장 큰 동기부여가 됐음2. 객체의 메모..

💻 숫자와 문자1. Number자바스크립트에서는 모든 숫자가 Number 타입으로 표현되며, 정수와 실수를 별도로 구분하지 않는다.이는 C++이나 Java와의 가장 큰 차이점 중 하나로, int, float, double과 같은 다양한 숫자 타입이 존재하는 언어들과 달리, 자바스크립트에서는 모든 숫자가 64비트 부동소수점(IEEE 754) 형식으로 저장된다.이로 인해 정확도 문제가 발생할 수 있다.console.log(0.1 + 0.2); // 0.30000000000000004 (부동소수점 오차)2. BigIntBigInt는 매우 큰 정수를 다룰 수 있는 자바스크립트의 자료형으로, Number 타입과는 다르게 정확한 정수 연산이 가능하다.2-1. BigInt의 내부 구조BigInt는 가변 크기 정수를..

🖌️ CSS JS 소개 1. CSS1-1. CSS란?CSS (Cascading Style Sheets)는 HTML 요소의 스타일을 정의하는 스타일 시트 언어이다.색상, 글꼴, 배경, 레이아웃 등을 지정하여 웹페이지를 더 보기 좋게 디자인할 수 있다.코드의 재사용성을 높이고 유지보수를 쉽게 만들기 위해 사용된다. (같은 스타일을 여러 요소에 적용 가능)1-2. CSS inline 방식해당 HTML 요소에 style 속성을 적용하여 스테일을 적용한다.이름은 CSS inline 방식입니다.1-3. CSS style tag 방식HTML 문서 안에 이름은 CSS style tag 방식입니다.2. Javascript2-1. JavaScript란?JavaScript는 웹 페이지에서 동적인 기능을 추가할 수 있도록 ..