Javascript - Deep Dive

\*destructuring assignment(구조분해할당) : 배열,객체의 각 요소를 한번에 개별 변수로 담을 수 있음.

:메모리 공간에 저장된 값을 재사용 할 수 있도록, 메모리 공간에 이름을 붙인것단계1 - 변수 선언 : 변수를 생성하는 것. : 변수 이름을 등록하고 값을 저장하기 위한 메모리 공간을 확보하는 것.단계2 - 값의 할당(초기화) : 변수가 선언된 이후 최초로 값을 할당하

값: 식이 평가되어 생성된 결과리터럴: 사람이 이해할 수 있도록 약속된 기호를 사용해 값을 표기하는 방법ex) 0x000000F2 -> 리터럴로 표시하면 3이 됨.표현식: 값으로 평가될 수 있는 문문과 식의 구별법 : 변수에 할당할 수 있으면 식이고, 아니면 문임함수

방법1: 삼항 연산자방법2: or 활용방법3: 전개연산자를 이용해 객체를 수정방법4 - 아예 함수의 정의 자체를 수정(객체의 속성을 꺼내서 객체에 할당)

:생성자 함수를 사용하면 프로퍼티 구조가 동일한 객체를 간편하게 반복하여 생성할 수 있음.new 연산자와 함께 생성자 함수를 호출하면 < 런타임 이전에 >1.암묵적으로 인스턴스를 생성함 :암묵적으로 빈 객체(인스턴스)가 생성 됨.2.this바인딩 됨 :생성자 함

:자신이 속한 객체나 자신이 생성할 인스턴스를 가리킬 수 있기 위해서.:this와 this가 가리킬 객체를 연결하는 것this에 바인딩될 객체는 호출 시점에 결정됨.일반함수호출메서드 내에서 정의한 중첩함수도 일반함수로 호출되면 중첩함수 내부의 this는 window임

:생성자 함수를 사용하면 프로퍼티 구조가 동일한 객체를 간편하게 반복하여 생성할 수 있음.new 연산자와 함께 생성자 함수를 호출하면 < 런타임 이전에 >1.암묵적으로 인스턴스를 생성함 :암묵적으로 빈 객체(인스턴스)가 생성 됨.2.this바인딩 됨 :생성자 함

< Map > : 객체와 유사함\*객체와 차이 1) 객체 : 이터러블x / Map객체 : 이터러블ㅇ 2) 객체 : 프로퍼티명(키값)에 문자,심벌값만 가능 / Map객체 : 프로퍼티명에 객체를 포함한 모든 값 가능Map 객체의 생성이터러블을 인수로 전달받아 Map객

파라미터에 ...를 이용해서 받으면 나머지 인자를 받아 하나의 "배열"로 만들어 사용하게 됨.( "배열"이기 때문에 배열의 메소드 사용가능함.)rest 파라미터는 항상 마지막에 있어야 함.함수를 호출할때 입력한 모든 인자가 담겨있음.rest는 배열, arguments는

: 여러개 자바스크립트 파일은 결국 하나의 자바스크립트 파일 내에 있는 것처럼 동작함.: type="module"을 붙이면 모듈로서 동작함.: 모듈은 자신만의 파일 스코프(모듈 스코프)를 갖는다.: 따라서 모듈 내에서 선언한 식별자는 모듈 외부 파일에서 접근할 수 없음

🔶요소에 접근하는 법 | |left |center|right |----|:----|:----:|----: |row1|l1 | c1 | r1 |row2|l2 | c2 | r2 |row3|l3 | c3 | r3

어떤 요소를 클릭하면 특정 요소로 이동하고 싶을 때 유용하게 쓰임.기능 사용 페이지 https://jihyun-jeon.github.io/introduce_myself/behavior - 이동시 보여지는 애니메이션 동작을 정의.1) auto(기본값) : 바로

싱글 스레드 : 한 번에 하나의 태스크만 실행할 수 있는 것을 뜻함.자바스크립트 엔진은 단 하나의 실행 컨텍스트 스택을 갖는다.이는 동시에 2개 이상의 함수를 동시에 실행 할 수 없다는 말임. 그러나 비동기 처리 처럼 현재 실행 중인 태스크가 종료되지 않은 상태라도 다

스코프는 '변수'와 '함수' 단위로 생김즉, 스코프는 변수와 함수의 유효한 범위를 뜻함.(정확히 말하자면 변수와 함수의 식별자(이름)의 유효범위) 스코프 내에서 변수나 함수의 식별자(이름) 유일해야 함.그러나 다른 스코프에서는 같은 식별자(이름)을 사용할 수 있다.아래

이벤트 전파는 3단계로 구분할 수 있음.캡쳐링 단계(propagate up): 이벤트 객체가 상위 요소에서 하위 요소 방향으로 전파타깃 단계 : 이벤트 객체가 이벤트 타깃에 도달함.버블링 단계(propagate down) : 이벤트 객체가 하위 요소에서 상위 요소 방향

여러 개의 하위 DOM 요소에 각각 이벤트를 등록하는게 아니라, 하나의 상위 DOM요소에 이벤트를 등록하는 방법작동 원리 : 버블링을 통해 이벤트 타켓(이벤트를 발생시킨 DOM요소)에서 부터 상위 요소로 올라가면서 이벤트를 캐치하게 됨.만약 하위 요소에 각각 이벤트 핸

: 다양한 타입의 값을 하나의 변수에 저장할 수 있도록 해주는 데이터 형식임: 프로퍼티 값에 모든 자료형이 저장되므로 다양한 타입의 값을 한번에 관리할 수 있음.: 각각의 변수에 값을 일일이 저장하는 대신, 하나의 단위로 구조화 할 수 있어 유용함.각각의 변수로 데이

참고 사이트 : https://ko.javascript.info/array의미 : 배열의 끝에 하나 이상의 요소를 추가반환값 : 호출한 배열의 새로운 length값.사용의미: 배열에서 마지막 요소를 제거함반환값 : "제거된 요소를 반환"합니다.사용의미: 새로운

🔶 function : 하나의 함수는, 하나의 return문만 갖을 수 있다. : return이 없다면 undifined를 반환한다. 🔶 함수선언문, 함수표현식 - (deep dive 165p 참조) 함수는 크게 "함수 선언문"과 "함수 표현식"으로 만들 수 있

참고사이트 : https://dev.to/sanchithasr/7-ways-to-convert-a-string-to-number-in-javascript-4l: 문자열이나 다른 값을 Number 타입으로 변환함. : 만약 만약 인수를 숫자로 변환할 수 없으면

🔶 수학 연산자 1. 원칙 : 대부분의 산술 연산자는 오직 숫자형의 피연산자만 다루고, 피연산자가 숫자형이 아닌 경우에 그 형을 숫자형으로 바꿈. 2.예외 : 그러나 덧셈 연산자(+)는 좀 특이함. 🔆 특이1 덧셈 연산자(+)는 문자열 연결과 변환이라는 특

primitive type(원시형)1) number : infinity, NaN도 number type임!2) string3) boolean4) undefined : 변수를 선언하고 초기화하지 않았을 때 나옴. ex) let number;5) null : 변수에 값이

1.keydown, keypress, keyup 이벤트 정의 keydown: 키보드를 누를 때 실행. 키를 누르고 있을 때 단 한번만 실행 keypress: 키보드를 누를 때 실행. 키를 누르고 있을 때 계속 실행 keyup: 누른 키에서 손을 뗄 때 실행 2

※ 사전지식\- 변수명(식별자) : 변수 값이 저장되는 ‘메모리 공간’을 지칭하기 위해 붙인 이름이고\- 변수의 값은 : 변수에 저장된 ‘데이터 자체’이다.🔆 1. 원시값을 변수에 할당하면? - 값을 저장함.코드 생성과정 1)새로운 메모리 주소에 공간을 만들고 2)

https://ko.javascript.info/event-delegationhttps://developer.mozilla.org/ko/docs/Web/API/Element/closest클릭 이벤트 발생히 currentTarget요소의 value값을

https://reactjs.org/docs/dom-elements.htmlhttps://betterprogramming.pub/what-is-dangerouslysetinnerhtml-6d6a98cbc187dangerouslySetInnerHTML은