영벨롭 개발 일지

[ 원시 타입 primitive type & 객체 타입 reference type ] 자바스크립트가 제공하는 7가지 데이터 타입은 Number, String, Boolean, null, undefined, Symbol, 객체 타입(Object, Array, function)이 있습니다. 이 데이터 타입은 크게 원시 타입(primitive type)과 객체 타입(reference type)으로 구분할 수 있습니다. 원시 타입 객체 타입 원시 값은 변경 불가능한 값(immutable value) 객체는 변경 가능한 값(mutable value) 값에 의한 전달(pass by value) 참조에 의한 전달(pass by reference) 원시 값을 변수에 할당하면 변수에는 실제 값이 저장됨 객체를 변수에 할..

[ 파싱 & 렌더링 ] 브라우저의 렌더링 과정을 살펴보기 앞서 파싱과 렌더링이 무엇인지 살펴보겠습니다. ★ 파싱 parsing 파싱은 구문분석이라고도 할 수 있습니다. 프로그래밍 언어로 작성된 텍스트 문서를 읽어 들여 실행하기 위해, 이 텍스트 문서의 문자열을 토큰으로 분해하고 토큰에 문법적 의미와 구조를 반영하여 파스 트리를 생성하는 과정을 파싱이라고 합니다. 여기서 토큰(token)은 문법적 의미를 갖는 코드의 최소 단위입니다. ★ 렌더링 rendering 렌더링은 HTML, CSS, JavaScript 로 작성된 문서를 파싱하여 브라우저에 시각적으로 출력하는 것입니다. [ 브라우저의 렌더링 과정 ] 1. 요청과 응답 렌더링에 필요한 리소스(html, css, js, img, 폰트 파일 등)는 모두 ..

[ 자바스크립트의 배열 ] const arr = ["apple", "banana", "orange"]; 배열은 여러 개의 값을 순차적으로 나열한 자료구조입니다. 배열이 가지고 있는 각각의 값을 '요소 element' 라고 부르며, 자바스크립트의 모든 값(원시값, 객체, 배열, 함수 등)은 배열의 요소가 될 수 있습니다. 배열의 인덱스는 다른 프로그래밍 언어들과 같이 zero based 인덱스로, 0부터 시작합니다. 사실, 자바스크립트에 배열이라는 타입은 존재하지 않습니다! 배열은 객체 타입이지만, 일반 객체와는 구별되는 특징이 있습니다. 배열은 객체와 달리 값의 순서와 length 프로퍼티를 갖고 있기 때문에 순차적으로 요소를 접근할 수 있다는 장점이 있습니다. 객체 배열 구조 프로퍼티 키와 프로퍼티 값..

[ 타입 변환이란? ] 자바스크립트의 모든 값은 number, string, boolean 등과 같이 타입을 가지고 있습니다. 자바스크립트의 타입 변환에는 개발자가 의도적으로 값의 타입을 변환하는 명시적 타입 변환(explicit coercion, 타입 캐스팅)과, 개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 변환되는 암묵적 타입 변환(implicit coercion, 타입 강제 변환)이 있습니다. 명시적 타입 변환이나 암묵적 타입 변환이 기존 원시 값을 직접 변경하는 것은 아닙니다. 원시 값은 변경 불가능한 immutable한 값이기 때문이죠. 즉 타입 변환은 기존 원시 값을 사용해 다른 타입의 새로운 원시 값을 생성하는 것입니다. let x = 10; // 명시적 타입 변환 ..

[ 웹 스토리지 Storage ] 웹 개발을 하다보면 사용자 정보나 게시글 정보와 같이 영구적으로 지속되어야 하는 데이터들은 서버의 데이터베이스(DB) 또는 클라우드 플랫폼에 저장해야합니다. 하지만 저장해야할 데이터가 그다지 중요하지 않거나 유실되도 무방한 데이터라면 클라이언트 측인 브라우저 상에서 데이터를 저장할 수 있는데, 이때 사용되는 기술이 바로 웹 스토리지입니다. 웹 스토리지는 localStorage와 sessionStorage로 구분할 수 있습니다. sessionStorage에 저장된 데이터는 웹 페이지의 세션이 끝나면, 즉 웹 페이지의 탭이나 창을 닫으면 소멸됩니다. 반면 localStorage에 저장된 데이터는 웹 페이지의 세션이 끝나도 소멸되지 않고 남게됩니다. 다만, 동일한 컴퓨터와 동..

[ JSON 이란? ] JSON(JavaScript Object Notation)은 자바스크립트의 데이터를 표현하는 텍스트 기반의 데이터 포맷입니다. .json 파일에서 데이터를 작성할 때는 자바스크립트의 객체 표기법과 유사합니다. 이때 데이터형은 undefined를 제외한 string, number, boolean, null, 객체(object), 배열(array)이 가능합니다. 이때 string은 큰 따옴표(" ")만을 사용하여 표기합니다. [ 자바스크립트에서의 JSON ] json 파일은 하나의 문자 데이터로 단순하게 하나의 메모리에 저장되어 있는 큰 덩어리라고 생각할 수 있습니다. 자바스크립트에서 이 json 파일은 자동으로 문자 데이터가 아닌 객체 데이터처럼 사용됩니다. //main.js imp..