할머니의 콤퓨타 도전기

Objects one of the JavaScript's data types a collection of related data end/ or functionality Nearly all objects in JavaScript are instances of Object object = {key : value}; object는 key와 value의 집합체 Literals and properties const obj1 = {}; // 'object literal' syntax const obj2 = new Object(); // 'object constructor' syntax function print(person) { console.log(person.name); console.log(person.age..

javascript는 Object-Oriented Programming class: template object: instance of a class Javascript classes introduced in ES6 syntactical sugar over prototype-based inheritance 기존에 존재하던 prototype 기반으로 간편하게 쓸 수 있도록 문법만 class가 추가 Class declarations class Person { // constructor constructor(name, age) { //fields this.name = name; this.age = age; } // methods speak() { console.log(`${this.name}: hello!`)..

First-class function functions are treated like any other variable can be assigned as a value to variable can be passed as an argument to other functions can be returned by another function Function expression a function declaration can be called earlier than it is defined. (hoisted) 함수가 선언되기 이전에 호출해도 호출 가능 자바스크립트 엔진이 선언된 것을 제일 위로 올려주기 때문 a function expression is created when the execution reach..

let added in ES6 let name = 'jiwon'; console.log(name); name = 'hello'; console.log(name); var don't ever use this! 선언도 하기 전에 값 할당 가능 값 할당하기 전에도 출력 가능 (undefined) var hoisting move declaration from bottom to top 어디에 선언했냐에 상관없이 항상 제일 위로 선언을 끌어올려줌 has no block scope 블록을 이용해서 변수를 선언해도 어디에서나 볼 수 있음 age = 4; var age; constant 값을 할당한 다음에 다시는 변경 되지 않아야함 read only const daysInWeek = 7; const maxNumber =..

html에서 javascript를 포함할때 어떻게 포함하는게 효율적일까? 1. script를 head에 포함 html을 위에서 부터 쭉 파싱하다가 script 태그가 보이면 main.js를 다운받아야한다고 이해한다. 따라서 html 파싱을 잠시 멈추고 필요한 javascript 파일을 서버에서 다운받아 실행한 다음에 다시 파싱하는 부분으로 넘어간다. 단점 js 파일의 사이즈가 크고 인터넷이 느리다면 사용자가 웹사이트를 보는데 까지 많은 시간이 소요된다. 따라서 script를 head에 포함하는 것은 좋지 않음 2. body 태그 가장 끝 부분에 script 추가 브라우저가 html을 다운받아서 쭉 파싱해서 페이지가 준비가 된 다음 script를 만나서 script를 fetching(서버에서 받아옴)하고 ..

렌더링 엔진 렌더링 엔진의 역할은 요청 받은 내용을 브라우저 화면에 표시하는 일 렌더링 엔진은 HTML 및 XML 문서와 이미지를 표시할 수 있음 플러그인이나 브라우저 확장 기능을 이용해 PDF와 같은 다른 유형도 표시 가능 파이어폭스는 모질라에서 직접 만든 게코(Gecko) 엔진, 사파리와 크롬은 웹킷(Webkit) 엔진 사용 웹킷 최초 리눅스 플랫폼에서 동작하기 위해 제작된 오픈소스 엔진 애플이 맥과 윈도우즈에서 사파리 브라우저를 지원하기 위해 수정함 렌더링 엔진 동작 과정 DOM tree 구축을 위한 HTML parsing, CSS, Javascript parsing: HTML 문서를 파싱한 후, content tree 내부에서 tag(a, div)를 DOM node로 변환. 그 다음 CSS 파일과..