📁Language/🟨 Javascript

브라우저 렌더링 과정 이해하기 (작성중)

javascript를 공부하면서 내가 아직 브라우저 렌더링 과정에 대해 정확히 알지 못하고 있다는 것을 깨달아서 정리해보기로했다. 사전지식 브라우저 : 웹상에 존재하는 페이지들을 검색 및 열람하기 위한 응용 프로그램의 총칭 ex) chorme, safari, internet explorer, microsoft edge 등 렌더링 : HTML, CSS, JS로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력하는 것 파싱 : 프로그래밍 언어로 작성된 문서의 문자열을 '토큰'으로 분해 -> 토큰으로 트리구조의 자료구조인 '파스트리'를 생성 -> 파스트리를 기반으로 '바이트 코드' 생성하고 실행 브라우저 렌더링 동작 과정 렌더링에 필요한 리소스를 서버에 요청하고 응답 받는다. 서버로부터 응답된 리소스를 파싱하..

[JS] 변수 선언 var, let, const

Javascript는 변수를 선언할때 제일 앞에 변수 선언 키워드를 사용한다. var number = 1; let number = 1; const number = 1; var - var 키워드로 선언한 변수는 중복 선언이 가능 (처음 선언한 변수의 값이 변경됨) var x = 1; console.log(x); //1 var x = 2; console.log(x); //2 - var 키드워로 선언한 변수는 함수의 코드 블록만을 지역 스코프로 인정 => 모두 전역 변수가 됨 var x = 1; if(true) { var x = 2; } console.log(x); //2 - 런타임 이전에 변수 선언, 초기화 둘다 실행 console.log(x); //undefined var x; console.log(x);..

[JS] fetch API 사용하기

초기화면 - fetch_test.html 버튼 누르면 알림창 띄우기 - fetch_test.html - event 파일 제목 내용이다. 버튼 누르면 글 나오게 하기 - fetch_test.html - event 파일 제목 내용이다.

[JS] 기본개념

HTML : 틀, 골격, 사람자체 CSS : 디자인, 옷 Javascript : 움직임, 동작 Javascript - 확장자명 : .js 장점 : 서버의 부하를 줄임(bugs) 단점 : 소스코드가 노출, 보안문제에 취약 - 특징 1) 객체기반 언어, 객체지향 언어 2) 태그 사용 (head, body에서 사용가능) 3) 기본적으로 html문서내에 작성되어 실행된다. 4) 변수의 자료형은 var이다. (생략가능) - Javascript 객체 3종류 1) 사용자 정의 객체 : 정의 - 생성 - 사용 2) 내장 객체 : (정의) - 생성 - 사용 ex) Date d = new Date() 3) 브라우저 객체 : (정의 - 생성) - 사용 ex) window.location = "http://www.tistor..