본문 바로가기

js22

[JS] DOM(Document Object Model) DOM(Document Object Model) 객체 HTML 문서의 계층적 구조와 정보를 표현하여 이를 제어할 수 있는 API 즉, 프로퍼티(속성)와 메소드를 제공하는 트리 자료 구조 DOM생성과정 바이트 → 문자 → 토큰 → DOM객체 문서노드 DOM 트리의 최상위에 존재하는 루트 노드 document 객체를 가리킨다. window.document 혹은 document로 참조하며 요소, 어트리뷰트(속성), 텍스트노드 접근시 문서 노드를 통해야합니다. 요소노드 HTML 요소를 가리키는 객체로 부자관계를 가진다(부모노드와 연결) 문서의 구조를 표현합니다. 어트리뷰트 노드 const $inputEle = document.getElementById('ksmart'); console.log({ $inputEl.. 2022. 11. 1.
[JS] 브라우저 객체 브라우저 객체 웹 브라우저와 관련된 객체의 집합입니다. - 최상위 객체는 window 객체이다. - window 하위 객체 - document(문서영역) - location(주소창) - history(방문기록, 페이지이동) - navigator(사용자의 브라우저 정보, 운영체제의 정보) - screen(사용자 디바이스 정보) - window 식별자는 생략이 가능하다. window 메서드 1. open(), close() - open('새창 주소', '새창 제목', '새창 옵션') : 새창 - close() : 창 닫기 let popup = open( "https://www.naver.com", "팝업", "width=500; height=500; top=100; left=100; scrollbar=yes.. 2022. 11. 1.
[Web] 브라우저 렌더링 브라우저 렌더링 파싱 프로그래밍 언어의 문법에 맞게 작성된 텍스트 문서를 읽어 들여 실행하기 위해 텍스트 문자을 토큰으로 분해(어휘 분석)하고, 토큰에 문법적 의미와 구조를 반영하여 파스 트리를 생성하는 일련의 과정입니다. (프로그램 런타임 환경에서 실제로 실행할 수 있는 내부 포맷으로 분석하고 변환하는 것을 의미) 파서 파싱을 하는 프로세서, 구문분석(파싱)을 행하는 프로그램 렌더링 HTML, CSS, 자바스크립트로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력 URI(Uniform Resource Identifier, 통합 자원 식별자) 인터넷에 있는 자원을 나타내는 유일한 주소로 인터넷에 존재하는 각종 정보들의 유일한 이름이나 위치를 표시하는 식별자이다. . URL(Uniform Resource.. 2022. 11. 1.
[JS] 예외처리 예외처리 실수, 예상치 못한 사용자 입력,잘못된 서버 응답 등의 이유 발생시 스크립트가 죽는 걸 방지하기위한 처리 try catch문법 스크립트 에러가 발생해도 catch에서 에러를 처리하기 때문에 스크립트가 죽지 않습니다. try { console.log(name); let name = "홍길동"; } catch (error) { console.log(error.name); console.log(error.message); console.log(error.stack); } 동작 순서 1. 먼저 try {} 안의 코드 실행 2. 에러가 없다면, try 안의 마지막 줄까지 실행, catch 블록은 건너뜀 3. 에러가 있다면, try 안의 코드의 실행이 중단되고, catch(err) 블록 안 코드 실행 er.. 2022. 11. 1.
[JS] 함수 함수 메모리에 코드를 저장 할 수 있는 수단으로 function이라는 키워드를 사용하여 선언이 가능하다. 함수는 선언 후에 호출이 되어야 저장된 코드가 실행되며 일반함수와 익명함수가 존재한다. 함수 선언 function를 활용하여 선언한다. 함수 선언 시 중괄호를 유효범위 혹은 스코프라고 하며 전역변수와 지역변수 구분이 확실하다. (함수 스코프: var, 블록 스코프 : let, const) 일반함수 구문: function 함수명 ( ) { } → 호이스팅 기술을 지원한다. 익명함수 구문 : function ( ) { } → 변수에 대입이 가능하다. ※ 익명함수 호출 시에는 익명함수가 호출부 위에 선언이 되어 있어야한다. ※ 호이스팅이란? → 변수의 선언과 초기화를 분리한 후, 선언만 코드의 최상단으로 .. 2022. 10. 20.
[JS] 배열 배열 하나의 저장소에 여러 데이터 타입을 저장할 수 있는 방법 (객체), 공간을 쪼개서 저장할 수 있다. ※ index : 배열 공간에 생성되는 주소로 시작 주소는 0번부터 시작한다. index를 활용하여 배열에 접근이 가능하며, 접근이 되었다면 값을 저장하거나 값을 가져올 수 있다. (JavaScript의 경우 모든 자료형과 객체를 담을 수 있다.) 배열 선언 /* 배열 선언 방법 */ var arr = []; var arr2 = new Array(); /* 값을 저장하면서 배열 선언 하는 방법 */ var arrV = ['홍길동', '이순신', '고길동']; var arrV2 = new Array('홍길동', '이순신', '고길동'); /* 선언된 배열에 인덱스를 활용하여 값을 저장하기 - 변수명[인.. 2022. 10. 13.