fullstack-study

Set , Map , yield # Set  Set은 JavaScript의 내장 객체 중 하나로, 중복되지 않은 값을 저장할 수 있는 자료구조입니다. Set 객체는 배열과 비슷하지만, 배열과 달리 동일한 값을 중복해서 가질 수 없습니다. 따라서, Set을 사용하면 중복된 값을 자동으로 제거할 수 있습니다.Set의 주요 특징중복 허용하지 않음: Set에 동일한 값을 추가하려고 하면, 자동으로 무시됩니다.순서가 있음: Set에 추가된 값들은 삽입된 순서대로 저장됩니다.유일한 값: Set은 원시 값 또는 객체 참조를 유일하게 저장합니다.  설명mdnSet Set 객체는 값의 컬렉션입니다. Set의 값은 한 번만 나타날 수 있으며, Set의 컬렉션에서는 고유한 값 mdn add(value) 같은 값인 요소가 ..

스코프  , 호이스팅( hoisting)  , TDZ  스코프( Scope )호이스팅( hoisting )TDZ(Temporal Dead Zone)  1.  스코프(Scope)   스코프(Scope)는 변수 및 함수의 유효 범위를 나타냅니다. 스코프는 코드에서 변수 및 함수에 접근할 수 있는 범위를 결정 하고 변수 및 함수의 충돌을 방지하고 코드의 가독성과 유지 보수성을 향상합니다. 주요한 스코프 유형에는 전역 스코프(Global Scope)와 지역 스코프(Local Scope)가 있습니다. 전역 스코프(Global Scope):전역 스코프는 코드의 어느 곳에서든 접근할 수 있는 스코프입니다.전역 스코프에서 선언된 변수 및 함수는 스크립트의 어디서든 사용할 수 있습니다.전역 스코프에서 선언된 변수는 전역..

예외처리, 비동기, Promise, async/await try ~ catch ~ finally 동기 / 비동기 비동기 콜백 Promise async/await fetch axios 명령어 mdn 예외처리 try ~ catch mdn 동기 / 비동기 mdn promise mdn try ~ catch mdn throw mdn ajax mdn , mdn XMLHttpRequest mdn mdn jQuery.ajax() jquery Element.insertAdjacentHTML() mdn fetch mdn axios axios 1. try ~ catch ~ finally try 블록: 예외가 발생할 수 있는 코드를 포함하는 블록입니다. 예외가 발생할 가능성이 있는 코드를 이 블록에 넣습니다. catch 블록..

Browser Object Model (BOM) JavaScript의 Browser Object Model (BOM)은 웹 브라우저와의 상호작용을 담당하는 객체와 메서드를 제공합니다. 이것은 Document Object Model (DOM)과는 다르며, DOM이 HTML 문서의 구조와 콘텐츠를 다룬다면, BOM은 브라우저와의 상호작용을 다룹니다. window: 전역 window 객체는 브라우저 창을 나타내며, BOM의 루트 역할을 합니다. 브라우저 창을 조작하고, 탐색을 제어하며, 대화상자를 관리하기 위한 속성과 메서드를 제공합니다. navigator: navigator 객체는 브라우저에 관한 정보를 제공합니다. 브라우저의 이름, 버전, 플랫폼 등을 확인하는 데 사용되며, 주로 브라우저의 기능과 기능성을..

form 요소웹 개발에서 사용되는 다양한 HTML 폼 요소들이 있습니다. 이러한 요소들은 사용자로부터 정보를 입력하거나 선택할 수 있도록 합니다. 주요 폼 요소들은 다음과 같습니다텍스트 입력 필드 (Text Input Fields):: 한 줄짜리 텍스트를 입력할 수 있는 상자를 생성합니다. : 비밀번호를 입력받을 때 사용되며, 입력한 문자를 마스킹하여 표시합니다. : 이메일 주소를 입력받을 때 사용됩니다.: 숫자 값을 입력받을 때 사용됩니다. : 전화번호를 입력받을 때 사용됩니다. , , : 각각 날짜, 시간, 날짜와 시간을 입력받을 때 사용됩니다.텍스트 여러줄:: 여러 줄의 텍스트를 입력할 수 있는 상자를 생성합니다.선택 입력 필드 (Select Fields):: 드롭다운 목록을 생성합니다.  요소를 ..

정규표현식 ( 정규식 ) 정규 표현식(regular expression)이란?정규 표현식(Regular Expression)은 문자열을 검색하거나 편집하는 데 사용되는 특수한 문자열 패턴입니다. 이것은 주어진 텍스트에서 원하는 패턴을 찾는 데 도움이 됩니다. 정규 표현식은 다양한 프로그래밍 언어와 텍스트 편집기에서 지원되며, 각 언어 및 편집기에서 약간의 차이가 있을 수 있지만 기본적인 패턴 매칭 및 문자열 검색에 대한 기능은 비슷합니다. 정규 표현식은 일반 문자와 특수 문자를 조합하여 표현되는데, 이들은 다음과 같은 역할을 합니다  일반 문자: 일반적인 문자열을 나타냅니다.메타 문자: 패턴 매칭을 위해 특별히 사용되는 문자입니다. 예를 들어, "."은 어떤 문자와도 일치하고, "*"는 앞선 문자가 0번..

window.localStorage localStorage 읽기 전용 속성을 사용하면 Document 출처의 Storage 객체에 접근할 수 있습니다.저장한 데이터는 브라우저 세션 간에 공유됩니다.localStorage는 sessionStorage와 비슷하지만, localStorage의 데이터는 만료되지 않고 sessionStorage의 데이터는 페이지 세션이 끝날 때, 즉 페이지를 닫을 때 사라지는 점이 다릅니다. ("사생활 보호 모드" 중 생성한 localStorage 데이터는 마지막 "사생활 보호" 탭이 닫힐 때 지워집니다.)  https://developer.mozilla.org/ko/docs/Web/API/Window/localStorage Window.localStorage - Web API ..

모듈 module import 혹은 export 구문을 사용 엄격 모드(strict mode)로 동작 export는 변수, 함수 및 클래스를 내보내려면 문을 사용 import문을 사용하여 다른 모듈에서 변수, 함수 및 클래스를 가져오기 type="module" 웹 브라우저에 JavaScript 파일을 모듈로 로드하도록 지시하려면 script 태그에 사용 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/import import - JavaScript | MDN 정적 import 문은 다른 모듈에서 내보낸 바인딩을 가져올 때 사용합니다. developer.mozilla.org https://developer.mozilla.o..

생성자함수와 클래스 프로토타입 생성자함수생성자함수 상속클래스클래스 상속 클래스 오버라이딩클래스 get/set  1. Prototype  프로토타입  자바스크립트의 프로토타입(Prototype)은 모든 객체가 상속받는 속성과 메서드를 정의한 객체입니다. 모든 JavaScript 객체는 내부적으로 프로토타입을 가지고 있습니다. 프로토타입은 객체 간의 상속 관계를 정의하고, 객체가 원시적인 값을 가지지 않고 다른 객체를 기반으로 하도록 합니다. 프로토타입은 객체 지향 프로그래밍에서 중요한 개념이며, 상속, 코드 재사용, 객체 지향 디자인 패턴 등을 구현하는 데에 널리 사용됩니다. 상속 (Inheritance): 모든 JavaScript 객체는 다른 객체로부터 상속된 속성과 메서드를 가질 수 있습니다. 객체가 ..

# 비구조화 할당 ( 구조분해 ) 문법 비구조화 할당 문법은 객체 안에 있는 값을 추출해서 변수 혹은 상수로 바로 선언할 수 있습니다. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment 구조 분해 할당 - JavaScript | MDN 구조 분해 할당 구문은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 담을 수 있게 하는 JavaScript 표현식입니다. developer.mozilla.org 비구조화 할당 ex1) const array = [10, 20]; const [a, b] = array; console.log(a); console.log(b); ex2) const..