웹 애플리케이션들은 굉장히 크고, 대부분 자바스크립트로 만들어진 것이다. HTTP Archive가 보여준 자바스크립트의 평균 전송 크기는(https://httparchive.org/reports/state-of-javascript?view=list!\[](ht
심볼(symbol) 값은 ES6에서 도입된 새로운 원시 자료형(primitive type)입니다. 심볼은 고유하고 수정 불가능한 값을 나타내며, 객체의 속성 이름으로 사용될 수 있습니다.심볼 값은 Symbol() 생성자 함수나 Symbol.for() 정적 메서드를 사용
get 접근자와 set 접근자는 객체의 속성에 접근하는 방법 중 하나입니다. get 접근자는 속성을 읽을 때, set 접근자는 속성을 설정할 때 사용됩니다.get 접근자는 속성을 읽을 때 호출되는 함수를 정의하며, set 접근자는 속성을 설정할 때 호출되는 함수를 정의
웹팩은 모듈 번들러이다. 모듈 번들러가 하는 일은 다양한 유형의 파일(javascript, css, 이미지 등)을 하나의 번들 파일로 결합하는 일이다.번들파일은 일반적으로 javascript로 구성되어 있다.번들 파일(Bundle File)은 모듈 번들러가 여러 모듈
자바스크립트의 Array 객체에는 다양한 메서드(method)가 있습니다. 이 중에서 대표적인 메서드들을 정리해보겠습니다.push() : 배열의 끝에 요소를 추가합니다.pop() : 배열의 끝에 있는 요소를 제거하고 반환합니다.shift() : 배열의 맨 앞 요소를 제
오름차순 정렬 내림차순 정렬 객체 배열의 속성 값으로 정렬 객체 배열의 여러 속성으로 정렬 객체 배열의 속성 값에 따라 정렬 방식 변경
Set, Map, Array는 모두 자바스크립트에서 데이터를 저장하고 관리하기 위한 자료구조입니다. 그러나 각각의 특징과 사용 용도에는 몇 가지 차이점이 있습니다. Array (배열): 순서가 있는 데이터의 집합을 저장하는 자료구조입니다. 인덱스를 사용하여
자바스크립트에서 객체를 생성하는 방법에는 다양한 방법이 있습니다. 대표적인 방법들은 다음과 같습니다.객체 리터럴생성자 함수Object.create() 메서드클래스(class)하나씩 살펴보도록 합시다!중괄호({})를 사용하여 객체를 생성합니다. 간단하고 빠르게 객체를 생
Property : 자바스크립트 객체(object)에서 속성을 정의하는 것으로, 이름(key)과 값(value)의 쌍으로 구성Property attribute : 위에서 설명한 Property의 속성(특징)을 정의하는 것, 역시 이름(key)과 값(value)의 쌍으로
자바스크립트는 프로토타입 기반 객체지향 언어 이기 때문에 ES6이전에는 클래스가 필요 없는 객체 지향 프로그래밍 언어였다. ES6에서 클래스가 등장했고 마치 문법적 설탕 처럼 보일 수 있다. 그렇지만 프로토타입과 클래스는 유사하게 동작하지만 분명 차이점이 있기 때문에
정규식은 문자열에서 특정 패턴을 찾거나 검색하기 위해 사용되는 표현식입니다. 문자열을 다루는데 매우 강력한 도구로, 특정 패턴을 일치시키기 위한 규칙을 정의하는 데 사용됩니다. JavaScript에서는 정규식을 표현하기 위해 /패턴/플래그 형태의 리터럴 표기법을 사용합
removeEventListener(): 이 메서드는 이전에 addEventListener()를 사용하여 연결한 이벤트 리스너를 제거합니다. 아래의 예제는 버튼 클릭 시 이벤트 리스너를 추가하고 제거하는 방법을 보여줍니다.querySelectorAll(): 이 메서드는
innerHTML: 요소의 내부 HTML 콘텐츠를 가져오거나 설정합니다.element.innerHTML: 해당 요소의 내부 HTML을 가져옵니다.element.innerHTML = '새로운 HTML 내용';: 해당 요소의 내부 HTML을 변경합니다.innerText:
e.currentTarget를 사용하여 이벤트 대상의 클래스를 가져온 다음 다양한 방법으로 활용할 수 있습니다. 아래는 e.currentTarget.classList를 사용하는 몇 가지 예시입니다.클래스 추가 및 제거:클래스 토글:클래스 존재 확인:클래스 대체:클래스