개인공부/JavaScript22 Map 과 Set Map 자바스크립트의 Map은 Object와 비슷한 점을 갖고 있습니다. Key와 Value의 형태로 데이터를 저장한다는 점이 비슷한 점입니다. 다만 Map의 Key값에 넣을 수 있는 자료형에 제약이 없습니다. 그래서 반복문을 사용할 수 있고 Key, Value만 따로 객체로 반환할 수 있다는 장점이 있습니다. let map = new Map([ [key1, value1], [key2, value2], [key3, value3], ]) // Map {"key1" => "value1", "key2" => "value2", "key3" => "value3"} 참고로 키값은 중복되면 나중에 등록된 key value 쌍으로 대체된다. 위 처럼 직접 키 값 쌍을 추가할 수도 있지만 여러 매서드들이 존재한다. ma.. 2022. 6. 15. 이벤트 루프 이벤트 루프 공부하면서 자바스크립트는 싱글 스레드 기반의 언어라서 한 번에 하나의 기능을 수행한다고 했습니다. 어려운 말로는 콜 스택(Call Stack)이라고 합니다. 예를 들면, 크롬에서 alert 라는 경고창이 나오면 닫기 전까지 어떠한 작업도 수행을 할 수 없습니다. 그 이유는 현재 실행되고 있는 함수가 있을 경우 다음 함수는 블락이 되어서 진행이 되질 않습니다. 만약, 시간이 많이 소요되는 함수가 있다고 가정을 하면 우리는 그 함수가 끝나기 전까지 어떠한 작업도 수행을 할 수 없습니다. 자바스크립트는 싱글 스레드 기반의 언어라 함수가 끝날 때 까지는 브라우저에서 어떠한 작업도 수행이 불가능 합니다. 이 때 사용하는 것이 비동기 콜백입니다. Memory Heap 데이터를 임시 저장하는 곳으로, 함.. 2022. 5. 26. DOM DOM(Document Object Model)이란? 문서 객체 모델(DOM)은 HTML, XML 문서의 프로그래밍 인터페이스입니다. DOM은 문서의 구조화된 표현을 제공하며 프로그래밍 언어가 DOM 구조에 접근 할 수 있는 방법을 제공하여 그들이 문서 구조, 스타일, 내용 등을 변경할 수 있게 도와주는 역할입니다. DOM은 '노드 트리' 로 문서를 표현합니다. 하나의 부모 줄기로 부터 여러개의 노드들이 트리모양을 하고있기 때문입니다. DOM의 정말 간략한 모습입니다. DOM은 언뜻봐서 HTML 문서로부터 생성되지만 항상 같지는 않습니다. HTML에서는 생략이 가능한 부분이 있지만 DOM에서는 '노드 트리' 형식을 지키고 있기때문에 생략된 부분이 수정되어서 나타나게됩니다. 또한, 자바스크립트를 통해 DO.. 2022. 5. 24. 간단하게 공부한 재귀함수 ## 재귀함수 함수가 자신을 호출하는 구조로 이루어진 함수입니다. 재귀함수에는 종료조건이 존재해야하며 종료조건이 없으면 무한루프에 빠지게되어 Stackoverflow에 빠지게 됩니다. 재귀 함수로 작성되는 코드는 반복문으로도 작성이 가능합니다. function sum(x){ if (x == 0) return 0 // 종료조건 작성 else { return x + sum(x-1) // 조건 } } console.log(sum(3)) //(3 + (2 + (1))) = 6 function fact(x){ if (x == 0) return 1 else{ return x * fact(x-1) } } console.log(fact(4)) // (4 * (3 * (2 * (1)))) =24 기존에 사용했던 for,.. 2022. 4. 20. 호이스팅 ## 호이스팅(Hoisting) 둘리의 호의가 계속되면 권리가 아닌 호이스팅입니다.... 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. var를 선언한 변수의 경우 호이스팅 시 undefined로 변수를 초기화 시킵니다. 하지만 let 이나 const경우 호으스팅 시 변수를 초기화 시키지 않습니다. 호이스팅을 설명 할 때에는 코드에 선언된 변수 또는 함수를 유효한 범위의 코드 상단에 끌어 올리는 작업이라고 합니다. function catName (name) { console.log(`우리집 고양이 이름은 ${name}입니다.`); } catName("담비"); // "우리집 고양이 이름은 담비입니다." 로 출력 JavaScript는 함수의 코드를 실행하기 전에 함수 .. 2022. 4. 19. Array 요소 추가/삭제 Array 추가 공부를 해봤습니다. # 추가, 삭제 push, pop / unshift, shift 배열 추가/삭제 하는 방법입니다. push와 pop은 배열의 마지막 부분을 추가 삭제하는 방식이며 let array = [] array.push(element) array.pop() 이런식으로 사용 가능합니다. 반대로 unshift와 shift는 배열의 가장 첫 번째 부분을 추가 삭제하는 방식이며 let array = [] array.unshift(element) array.shift() 이렇게 사용됩니다. # splice splice는 원하는 부분을 삭제할 수도 추가 할 수도 있습니다. delete를 사용했을때 element를 삭제 시킬 순 있지만 element가 있었던 공간 자체는 삭제를 못합니다. 분.. 2022. 4. 11. 이전 1 2 3 4 다음
