본문 바로가기
반응형

JavaScript71

[JavaScript] 프로미스(Promise) * 프로미스(Promise)란? 자바스크립트에서 프로미스(Promise)는 비동기 작업의 결과를 나타내는 객체입니다. 비동기 작업은 일반적으로 서버에서 데이터를 가져오거나 파일을 읽는 등 시간이 걸리는 작업을 말합니다. 프로미스는 이러한 비동기 작업의 성공 또는 실패와 그 결과 값을 처리하기 위해 사용됩니다. 프로미스는 세 가지 상태를 갖습니다: 대기(pending): 비동기 작업이 아직 완료되지 않은 상태입니다. 이행(fulfilled): 비동기 작업이 성공적으로 완료되어 결과 값을 반환한 상태입니다. 거부(rejected): 비동기 작업이 실패한 상태입니다. 기본 예시 const myPromise = new Promise((resolve, reject) => { // 비동기 작업 수행 // 작업이 성.. 2024. 2. 7.
[JavaScript] 호이스팅(Hoisting) 1. 호이스팅(Hoisting) 호이스팅(Hoisting)은 자바스크립트에서 변수 선언과 함수 선언이 해당 스코프의 맨 위로 "끌어올려지는" 동작을 말합니다. 이는 코드 실행 전에 변수와 함수가 메모리에 할당되는 것처럼 동작하여, 변수와 함수를 선언하기 전에도 사용할 수 있는 특징을 갖고 있습니다. 1-1. 변수 호이스팅 변수 선언은 실제 코드의 위치와 상관없이 해당 스코프의 맨 위로 끌어올려집니다. 즉, 변수를 선언하기 전에도 변수를 사용할 수 있습니다. 그러나 변수의 초기화는 원래 코드의 위치에 따라 이루어지므로, 선언 전에 변수에 접근하면 undefined가 할당됩니다. 1-2. 함수 호이스팅 함수 선언도 변수 선언과 마찬가지로 해당 스코프의 맨 위로 끌어올려집니다. 함수 선언문은 변수에 할당된 함.. 2024. 2. 7.
[JavaScript] 이벤트 버블링(Event Bubbling)과 이벤트캡쳐(Event Capturing) 자바스크립트에서 이벤트 버블링(Event Bubbling)과 이벤트 캡처(Event Capturing)은 이벤트가 여러 개의 요소에 영향을 미치는 방식을 설명하는 용어입니다. 1. 이벤트 버블링(Event Bubbling) 이벤트 버블링은 특정 요소에서 이벤트가 발생했을 때, 해당 요소가 포함된 부모 요소로 이벤트가 전파되는 현상 즉, 이벤트가 가장 깊은 자식 요소에서 시작하여 부모 요소를 거슬러 올라가면서 처리되는 것을 의미합니다. 이벤트 버블링은 DOM 트리 구조를 따라 이벤트가 전파되기 때문에, 최상위 부모 요소까지 이벤트가 전달될 수 있습니다. 이러한 특성을 활용하면 이벤트 위임(Event Delegation)이라는 패턴을 사용하여 여러 요소에 대한 이벤트 핸들링을 효율적으로 처리할 수 있습니다... 2024. 2. 7.
[JavaScript] 프로토타입(Prototype), 상속(Inheritance) 1. 프로토타입(Prototype) 프로토타입(Prototype)은 객체 지향 프로그래밍에서 상속과 관련된 개념입니다. 프로토타입은 객체 간의 상속을 구현하고, 객체가 다른 객체의 속성과 메서드를 공유할 수 있도록 도와줍니다. 모든 객체는 프로토타입을 가지고 있으며, 객체의 프로토타입은 해당 객체를 생성한 생성자 함수의 프로토타입 객체를 가리킵니다. 프로토타입 객체에는 해당 생성자 함수로부터 생성된 모든 객체에서 공유할 수 있는 속성과 메서드가 포함됩니다. 2. 상속(Inheritance) 상속은 한 객체가 다른 객체의 속성과 메서드를 상속받아 사용하는 것을 말합니다. 자바스크립트에서는 프로토타입 체인(Prototype Chain)을 통해 상속을 구현합니다. 객체에서 속성 또는 메서드에 접근할 때, 해당.. 2024. 2. 6.
[JavaScript] 데이터타입, 클로저(Closure) 1. 데이터타입 자바스크립트의 데이터 타입은 크게 두 가지로 나뉩니다. 1. 기본 데이터 타입(Primitive Data Types) 숫자(Number): 정수와 실수를 포함한 모든 숫자 값을 나타냅니다. 문자열(String): 문자들의 시퀀스로 이루어진 데이터를 나타냅니다. 불리언(Boolean): true(참) 또는 false(거짓) 값을 나타냅니다. undefined: 값이 할당되지 않은 변수를 나타냅니다. null: 값이 없음을 나타냅니다. 심볼(Symbol): 유일하고 변경 불가능한 기본 데이터 타입입니다. 2. 객체(Object) 객체는 키(key)와 값(value)의 쌍으로 이루어진 속성(property)의 집합입니다. 배열(Array), 함수(Function), 정규 표현식(RegExp) .. 2024. 2. 6.
[JavaScript] 화살표 함수 (Arrow Function) 1. 화살표 함수(Arrow Function) 란? 자바스크립트의 화살표 함수(arrow function)는 ES6에서 도입된 함수 표현식의 간단한 형태입니다. 화살표 함수는 function 키워드 대신 화살표(=>)를 사용하여 함수를 선언합니다. 이를 통해 함수를 더 간결하게 작성할 수 있습니다. 화살표 함수의 구문 예시 1. 기본구문 const 함수명 = (매개변수) => { // 함수의 내용 }; 2. 매개변수가 하나인 경우 const square = x => x * x; console.log(square(5)); // 출력: 25 3. 매개변수가 여러개인 경우 const sum = (a, b) => a + b; console.log(sum(3, 4)); // 출력: 7 4. 함수내용이 한줄인 경우.. 2024. 2. 2.
반응형

티스토리툴바