웹 개발자 도전기

자바스크립트 표준 내장 객체자바스크립트 언어에는 개발 편의를 위한 수많은 객체(생성자 함수) 들이 미리 만들어져 있는데 이를 표준 내장 객체라 한다.표준 내장 객체는 대문자로 시작하는 생성자 함수를 말하며 스코프에 상관없이 모든 영역에서 사용할 수 있다. 1. String 객체문자열을 다루기 위한 다양한 메서드와 프로퍼티를 제공합니다.주요 프로퍼티length : 문자열의 길이를 반환합니다.주요 메서드charAt(index) : 지정한 인덱스의 문자를 반환합니다.charCodeAt(index) : 지정한 인덱스에 있는 문자의 유니코드 값을 반환합니다.concat(...strings) : 둘 이상의 문자열을 연결합니다.indexOf(searchString) : 문자열에서 특정 문자(열)의 인덱스를 반환합니다..

배열이란? 배열은 여러 데이터를 순차적으로 저장하는 자료구조 입니다. 자바스크립트에서 배열은 객체의 특별한 형태로 다양한 타입의 요소를 포함할 수 있고 동적으로 크기가 조절됩니다. 1. 배열 생성 배열을 생성하는 두 가지 주요 방법이 있습니다. 배열 리터럴 대괄호를 사용하면 간단하게 배열 생성 가능const number = [1 , 2 , 3];Array() 생성자new Array() 구문을 사용하여 배열을 생성할 수 있습니다. 요소들을 전달하거나 숫자를 전달하여 빈 배열을 생성할 수 있습니다.const number = new Array(1,2,3,4,5);const numberlength = new Array(5);2. 배열 요소 접근 및 수정 배열의 요소에 접근하거나 수정할 때는 인덱스를 사용합니다...

1. 호이스팅 이란? 호이스팅은 자바스크립트에서 변수와 함수 선언이 그들이 속한 스코프의 최상단으로 끌어 올려지는 것처럼 동작하는 특성을 말합니다. 실제로 코드가 물리적으로 이동하는 것은 아니고 자바스크립트 엔진이 코드를 실행하기 전에 변수와 함수 선언을 먼저 메모리에 저장 하는 방식으로 작동합니다. 2. 변수 호이스팅 2-1 var 키워드var 키워드로 선언된 변수는 호이스팅 시 undefined로 초기화됩니다. 2-2 let 과 const 키워드let 과 const 로 선언된 변수도 호이스팅되지만 초기화되기 전까지 접근할 수 없는 일시적 사각지대(Temporal Dead Zone)에 놓이게됩니다.  3. 함수 호이스팅 3-1 함수 선언문함수 선언문은 전체가 호이스팅됩니다. 따라서 함수를 선언하기 전에..

1. 실행 컨텍스트란?실행 컨텍스트는 자바스크립트 코드가 실행되는 환경을 추상화한 객체입니다. 코드가 실행될때 필요한 환경 정보들을 모아 놓은 객체라고 할 수 있습니다.  2. 실행 컨텍스트의 역할스코프 관리 : 변수 , 함수 등의 식별자를 저장하고 관리합니다.실행 순서 관리 : 실행 컨텍스트 스택(콜 스택)을 통해 코드의 실행 순서를 제어합니다.3. 실행 컨텍스트의 종류전역 실행 컨텍스트 : 코드가 처음 실행될 때 생성되는 컨텍스트함수 실행 컨텍스트 : 함수가 호출될 때 마다 생성되는 컨텍스트eval 실행 컨텍스트 : eval 함수 내에서 실행되는 코드의 컨텍스트4. 실행 컨텍스트의 구조 실행 컨텍스트는 다음 세 가지 주요 컴포넌트로 구성됩니다.Lexical Environment(렉시컬 환경)Varia..

1. 지역 변수 (Local Variable) 정의 :함수 또는 메서드 내에서 선언된 변수입니다.해당 함수가 실행될 때 생성되고 함수가 종료되면 소멸됩니다.특징 : 함수 내에서만 접근 가능하며 함수 외부에서는 접근할 수 없습니다.메모리 사용이 효율적입니다. 함수 호출 시에만 메모리를 사용하고 함수가 종료되면 메모리가 해제됩니다. 2. 전역 변수 (Global Variable) 정의 :함수 외부에서 선언된 변수입니다.프로그램이 종료될 때까지 메모리에 존재합니다.특징 : 프로그램의 모든 함수에서 접근 가능합니다.전역 변수의 사용은 메모리 사용량이 증가할 수 있고 변수명이 충돌할 위험이 있으므로 최소화 하는 것이 좋습니다.  3. 블록 변수 (Block Variable) 정의 : {} 중괄호로 묶인 블록 내에..

생성자 함수 (상속)자바스크립트에서 생성자 함수와프로토타입을 사용하여 상속을 구현하는 것은 객체 지향 프로그래밍의 기본적인 방식 중 하나 이다. 이를 통해 코드를 재사용하고 객체 간의 관계를 명확히 할 수 있습니다. 1. 생성자 함수 정의 및 상속의 개념생성자 함수 정의 : 생성자 함수는 객체를 생성하고 초기화하는 역활을 합니다.상속 : 자식 생성자 함수가 부모 생성자 함수의 프로퍼티와 메소드를 상속받아 재사용하는 것을 의미합니다.2. 생성자 함수 상속의 이점재사용성 : 부모 생성자 함수의 코드를 재사용하여 중복을 줄입니다.확장성 : 부모 생성자에 없는 새로운 프로퍼티나 메소드를 자식 생성자에서 추가할 수 있습니다.유지보수성 : 필요에 따라 부모 생성자의 프로퍼티나 메소드를 재정의할 수 있습니다.3. 생..

프로토타입과 상속자바스크립트는 프로토타입(prototype) 기반 상속을 지원하는 객체 지향 프로그래밍 언어입니다.자바와 같은 클래스 기반 언어와는 달리 자바스크립트는 모든 객체가 다른 객체를 상속받을 수 있는 프로토타입 체인(prototype chain)을 사용합니다. 프로토타입 객체란?프로토타입 객체는 생성자 함수로 생성된 모든 인스턴스에 상속하려는 속성과 메서드를 정의하기 위한 부모 객체입니다.생성자 함수를 정의하면 자바스크립트 엔진은 생성 단계에서 생성자 함수와 연결된 프로토타입 객체를 자동으로 생성합니다. 프로토타입 체인모든 자바스크립트 객체의 최상위 부모 객체는 Object 프로토타입 객체입니다. _proto_ 와 prototype 프로퍼티_proto_ 프로퍼티는 생성된 인스턴스의 부모(프로토..

모듈은 코드의 재사용성과 유지보수성을 높여주는 중요한 개념입니다.자바스크립트에서는 주로 CommonJS와 ECMAScript6(ES6) 모듈 형식을 사용합니다. 모듈(Module) 이란 ?모듈의 정의 : 특정 기능을 수행하는 함수나 변수들의 코드 집합.재사용성 : 모듈은 자체로 하나의 프로그램이면서 다른 프로그램의 부품으로 사용할 수 있습니다.코드 관리 : 파일 단위로 모듈을 작성하면 여러 프로그램에서 재사용할 수 있어 관리하기 편리합니다.구조화 : 애플리케이션의 규모가 커지면 기능별로 모듈화하여 개발하는 것이 중요합니다.구성 요소 : 모듈은 특정 목적을 가진 여러 개의 함수 , 생성자 함수 또는 객체로 구성된 하나의 파일로 이루어집니다. 노드(Node.js)에서의 모듈 형식Node.js 에서는 두 가지..

자바스크립트 객체의 종류 1. 사용자 정의 객체개발자가 직접 정의한 객체로 이름: 값 쌍으로 구성된 프로퍼티와 메서드를 가질 수 있습니다. 프로퍼티 이름은 문자열, 숫자, 심벌만 사용할 수 있으며 각 프로퍼티는 쉼표(,)로 구분합니다. 2. 내장 객체 (Built-in Object)자바스크립트 언어에 미리 정의된 객체로 프로그램 개발 시 자주 사용하는 요소들을 포함합니다. 대표적인 예로 Number, Boolean, Date, Math, Array 등이 있습니다. 3. 문서 객체 모델 (DOM: Document Object Model)웹 문서의 요소들은 메모리 상에 객체로 생성되어 있는데 이를 DOM이라 한다. 예를 들어 document 객체는 웹 문서 자체를 image 객체는 이미지 요소를 의미한다. ..

객체 지향 프로그래밍 개요 객체 지향 프로그래밍 (Object-Oriented Programming)객체 지향 프로그래밍은 '객체' 간의 상호작용을 중심으로 데이터를 처리하는 프로그래밍 개발 방법이다.현실 세계가 다양한 객체들의 상호작용으로 운영되듯이 프로그램도 여러 개의 독립된 단위인 '객체' 들의 모임으로 파악하고자 하는 프로그래밍 방식이다.객체 지향 프로그래밍은 현실 세계를 모방한 것이다.객체 (Object)실생활에 존재하는 명사형의 모든 실체(사람,사물,개념 등)를 말한다.예 : 자동차, 도서, 학생, 학과, 성적, 수강, 회원, 상품, 장바구니, 주문, 은행계좌 등객체의 특징 :식별 가능한 이름이 있으며 관련된 상태정보(속성)와 행위를 가진다.속성 : 예를 들어, 학생의 이름, 학과 , 학번 등..