728x90
[마스터 개념] 6 | 모듈1 variable 변수2 operator 연산자3 function 함수4 object 객체5 class 클래스7 built-in 빌트인 객체8 array 배열9 iterator 이터러블10 map11 more-operators 유용한 연산자들12> module 모듈13 promise 프로미스14 scope 스코프15 prototype 프로토타입16 closure 클로져17 this 12 module 모듈Comments 주석 // TODO (대상) : 해야 할 일 작성 이런 식으로 한 줄짜리 주석을 작성할 때 쓴다. /*** 코드 자체를 설명 X, WHY 와 HOW 를 설명하는 것 (정말 필요한 경우만 사용)*/ /** * 주어진 두 인자를 더한 값을 반환함 * @param {..
[마스터 개념] 5 | map, 유용한 연산자들1 variable 변수2 operator 연산자3 function 함수4 object 객체5 class 클래스7 built-in 빌트인 객체8 array 배열9 iterator 이터러블10> map11> more-operators 유용한 연산자들12 module 모듈13 promise 프로미스14 scope 스코프15 prototype 프로토타입16 closure 클로져17 this 10 mapSet 중복 X, 집합체이다. // 생성const set = new Set([1, 2, 3]);console.log(set); // Set(3) { 1, 2, 3 }// 사이즈 확인console.log(set.size); // 3// 존재하는지 확인conso..
[마스터 개념] 4 | 이터러블1 variable 변수2 operator 연산자3 function 함수4 object 객체5 class 클래스7 built-in 빌트인 객체8 array 배열9> iterator 이터러블10 map11 more-operators 유용한 연산자들12 module 모듈13 promise 프로미스14 scope 스코프15 prototype 프로토타입16 closure 클로져17 this 9 iterator 이터러블[Symbol.iterator]( ) : Iterator{ next( ) : {value, done}}; Iterable 은 순회가 가능하다. Iterable 은 객체가 [Symbol.iterator]( )를 가지고 있어야 하며, 호출했을 때 Iterator 를 반환..
[마스터 개념] 3 | 배열1 variable 변수2 operator 연산자3 function 함수4 object 객체5 class 클래스7 built-in 빌트인 객체8> array 배열9 iterator 이터러블10 map11 more-operators 유용한 연산자들12 module 모듈13 promise 프로미스14 scope 스코프15 prototype 프로토타입16 closure 클로져17 this 8 array 배열 일반적인 배열은 동일한 메모리 크기, 연속적, 자바스크립트의 배열은 동일한 메모리 크기를 가지지 않고, 연속적으로 이어져 있지 않다. 오브젝트와 유사하며 일반적인 배열의 동작을 흉내 낸 특수한 객체이다. 자바스크립트 배열은 다른 타입의 데이터를 넣을 수 있으므로 타입이 정해져..
[마스터 개념] 2 | 객체, 클래스, 빌트인 객체1 variable 변수2 operator 연산자3 function 함수4> object 객체5> class 클래스7> built-in 빌트인 객체8 array 배열9 iterator 이터러블10 map11 more-operators 유용한 연산자들12 module 모듈13 promise 프로미스14 scope 스코프15 prototype 프로토타입16 closure 클로져17 this 4 object 객체key : 문자, 숫자, 문자열, 심볼value : 원시값, 객체, 함수 속성, 데이터에 접근 // 마침표 표기법 dot notationconsole.log(apple.name);// 대괄호 표기법 bracket notation ('-'가 있을 때 사용..
[마스터 개념] 1 | 변수, 연산자, 함수1> variable 변수2> operator 연산자3> function 함수4 object 객체5 class 클래스7 built-in 빌트인 객체8 array 배열9 iterator 이터러블10 map11 more-operators 유용한 연산자들12 module 모듈13 promise 프로미스14 scope 스코프15 prototype 프로토타입16 closure 클로져17 this 1 variable 변수변수 이름 규칙 1. 라틴문자 (0 ~ 9, a ~ z, A ~ Z), _, $2. 대소문자 구분함3. camelCase4. 한국어, 예약어, 숫자로 시작, 특수문자( _, $ 제외) => 사용불가변수 이름은 최대한 의미 있게, 구체적으로 작성하는 것이 좋..
[정리] 3 | DOM 트리, 접근하기 & 새로운 요소 추가, 노드 삭제 정리DOM 트리의 노드요소 노드 : 모든 HTML 태그 의미텍스트 노드 : 태그의 텍스트 내용속성 노드 : 태그의 속성주석 노드 : 주석DOM 에 접근하기getElementById(id) : id 명으로 접근getElementsByClassName(class) : class 명으로 접근, 배열 형태로 저장getElementsByTagName(tag) : 태그명으로 접근, 배열 형태로 저장querySelector() : id 명이나 선택자를 사용하여 접근querySelectorAll() : 클래스명이나 태그명의 선택자를 사용해 접근, 노드 리스트 형태로 저장- 속성 가져오기 및 수정하기getAttribute(속성) // 태그..
[기본 개념] 3 | (1.3) DOM 에서 노드 추가, 삭제하기1 문서 객체 모델 (DOM)2 DOM 요소에 접근, 속성 가져오기3 DOM 에서 이벤트 처리하기4> DOM 에서 노드 추가, 삭제하기4 DOM 에서 노드 추가, 삭제하기노드 리스트란? DOM 에서 새로운 노드를 만들어 추가하거나 삭제하려면 노드 리스트를 사용해야 하는데, querySelectorAll( ) 메서드를 사용하여 노드를 여러 개 가져올 때 이 노드 정보를 여러 개 저장한 데이터 형식이 노드 리스트이다. 노드 리스트는 배열은 아니지만 배열과 비슷해서 인덱스 번호로 특정 노드에 접근할 수 있다. (ex. li 노드 리스트 중 두 번째 노드 가져오기) document.querySelectorAll("li")[1] 새로운 노드를 ..
내 블로그 - 관리자 홈 전환 |
Q
Q
|
---|---|
새 글 쓰기 |
W
W
|
글 수정 (권한 있는 경우) |
E
E
|
---|---|
댓글 영역으로 이동 |
C
C
|
이 페이지의 URL 복사 |
S
S
|
---|---|
맨 위로 이동 |
T
T
|
티스토리 홈 이동 |
H
H
|
단축키 안내 |
Shift + /
⇧ + /
|
* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.