본문 바로가기

WEB/Javascript6

DOM 이란 #. DOM (Document Object Model)이란? - 컴퓨터가 문서를 잘 처리할 수 있도록 문서에 대한 구조를 약속한 것 - Tree 형태 특징이 있다. - 각각의 노드에 하나의 부모가 있고 여러개의 자식이 있는 구조(태그가 중첩되는 것과 일맥상통하다.) - firstElementChild : 첫 자식 엘리먼트 - lastElementChild : 마지막 자식 엘리먼트 - nextElementSibling : 같은 레벨의 형제 엘리먼트에 접근하는 방법 - previousElementSibling : ''' - 등 속성으로 원하는 노드에 접근하여 속성을 줄 수 있다. = 단일 Element 선택 - Document API - document.getElementBy~ : 단일 엘리먼트를 선택하는 .. 2022. 8. 29.
Javascript(렉시컬 환경, 클로저) - 렉시컬 환경 - * 어휘적 환경, Lexical-Environement * 스크립트 전체, 실행중인 함수, 코드블록 등의 자신만의 렉시컬 환경을 갖는다 * 환경레코드 1. 렉시컬 환경에서 모든 지역변수를 프로퍼티로 저장하고 있는 객체이다 2. this, 함수일 경우 매개변수도 포함 * 외부 렉시컬 환경 1. 현재 렉시컬 환경보다 더 상위의 렉시컬 환경이다 2. 스크립트는 최상위 렉시컬 환경 3. 스크립트 내에 호출된 함수나 코드블록은 외부렉시컬 환경으로 스크립트 렉시컬 환경을 참조 * 외부 렉시컬 환경을 참조하는 과정 1. 렉시컬 환경이 만들어질 때 Environment라는 숨김 프로퍼티가 만들어짐 2. 프로퍼티에는 외부렉시컬 환경이 저장 3. 지역내에서 참조할 값이 없을 경우 프로퍼티에 접근하여 외.. 2022. 4. 25.
Javascript(구조 분해 할당, 나머지 매개변수, 전개 구문) - 구조 분해 할당 - " 구조 분해 할당(Destructuring assignment) 구문은 배열이나 객체의 속성을 분해해서 그 값을 변수에 담을 수 있게 하는 표현식 " * 배열 구조 분해 1. 해당하는 값이 없으면 undefined가 들어가게 된다 ex) let [a, b, c] = [1, 2]; // a = 1, b = 2, c = undefined let [a=3, b=4, c=5] = [1, 2]; // undefined가 안나오게 하기 위하여 각 인덱스에 기본값을 정해준 모습 2. 일부 반환값 무시 : 공백이나 선언되지 않을경우 무시하게 된다 ex) let [user1, , user2] = ['Mike', 'Tom', 'Jane', 'Tony']; // user1 = 'Mike', user.. 2022. 4. 17.
Javascript(호이스팅, 생성자) - 변수(심화) - "let, const" VS "var" * var 는 한번 선언된 변수를 다시 선언할 수 있다 ex) var name = 'Mike'; // Mike let name = 'Mike'; // Mike var name = 'Jane'; // Jane let name = 'Jane'; // error! * var 는 선언하기 전에 사용할 수 있다(호이스팅 hoisting) ex) console.log(name); // undefined 선언은 호이스팅 되지만 할당은 되지 않는다 var name = 'Mike'; 코드가 실제로 이동하진 않지만 최상위로 끌어올려진 것 처럼 동작한다 호이스팅 : 스코프 내부 어디서든 변수 선언은 최상위에 선언된 것 처럼 행동 TDZ(Temporal Dead Zo.. 2022. 4. 4.