Javascript 의 "=="는 Equal Operator 이고, "==="는 Strict Equal Operator 이다. ==는 서로 다른 변수 유형이지만 변수 값을 기반으로 유형을 수정하여 비교한다. 즉, ==는 변수 값이 같으면 true를 반환하고, === 는 변수의 유형까지 비교하여 반환한다. == : 서로 다른 유형의 두 변수의 값을 비교 === : 엄격한 비교를 하는것으로 변수의 값 뿐만 아니라 변수의 유형까지 비교한다. == ==는 a == b 라고 했을 때 a 와 b 의 값이 같은지를 비교해서 같으면 true, 다르면 false 라고 한다. 예시) 0 == false // true 2 == "2" //true (변수의 유형을 자동변환) console.log(typeof 2); //num..

옵셔널 체이닝(Optional Chaining)은 ES2020에서 등장한 새로운 연산자로서 '?.' 형태로 쓰인다. 접근하는 데이터가 유효한지 명시적으로 검증하지 않고 연결된 객체 체인 내에 깊숙히 위치한 속성 값을 읽을 수 있는 연산자이다. 참조된 값이 null 혹은 undefined 여도 에러로 뱉지 않고 undefined 값을 리턴한다. 함수 호출시에도 마찬가지로 값이 없다면 undefined를 리턴한다. 옵셔널 체이닝이 필요한 이유) 아래와 같이 user 객체의 info.name에 접근했지만 읽을 수 없는 TypeError가 나타났다. 당연히 존재하지 않는 값에 접근 했기 때문에 에러가 발생한다. const user = {}; console.log(user.info.name); * TypeErro..

비동기 처리(Asynchronous Processing) 하나의 작업의 종료까지 기다리지 않고 다음 작업을 진행하는 비순차적인 처리 방식 자바스크립트는 싱글 스레드 기반의 언어이기 때문에 작업을 처리하는 공간(호출 스택)이 하나이다. 즉, 한번에 하나의 작업만 수행할 수 있다. 따라서 비동기적으로 실행되는 setTimeout, addEventListener 등 포함된 로직은 작성한 순서대로 실행되지 않는다. 아래 예제를 보자 console.log('AAAA'); setTimeout(function(){ console.log('BBBB'); }, 0); console.log('CCCC'); 위의 예상 결과는 1. AAAA 2. BBBB 3.CCCC 라고 생각했지만 그렇지 않았다. 이유는 자바스크립트 엔진의..

defer defer 속성은 위 방법처럼 하게되면 HTML 태그들을 모두 파싱하여 DOM 트리로 구성한 후 태그가 로드된다. 이러한 방법으로 렌더링 지연을 방지할 수 있다. 또 하나의 방법은 위에서 설명했듯이 태그의 defer 속성을 사용하는거다. - defer 속성 사용 HTML 태그들... 위 방법은 HTML 태그를 파싱하기전 script 태그의 속성인 defer 확인하고 자바스크립트 파일을 다운로드 하자고 명령만 시켜놓고 HTML 태그를 파싱하게 됩니다. HTML 태그 파싱이 모두 끝나면 미리 받아놓은 자바스크립트 파일을 로드하게 된다. 파싱하는 동안 필요한 자바스크립트 파일을 받아놓고 HTML 파싱이 완료 후 사용자에게 페이지를 보여준 다음 자바스크립트 파일을 실행하기 때문에 HTML의 파싱 DO..

JavaScript에서 주로 사용하던 변수 키워드는 var이다. 하지만 ES6 문법에서 다양한 변수 선언을 위해 let 과 const를 추가로 만들었다. 그 이유를 알아보자 const testNumber = 10002; //변수명 : testNumber // 해당 변수 값의 메모리 주소 : 123G123X // 변수 값 : 10002 변수에 값을 할당하면 위와 같이 메모리에 저장된다. 자바스크립트는 Managed Language 언어이기 때문에 개발자가 직접 메모리를 제어하지 못한다. 따라서 개발자가 직접 메모리 주소를 통해 값을 저장하고 접근하지 않아도 변수 선언을 통해 안전하게 값을 가져올 수 있다. 여기서 변수명(testNumber)은 값을 기억하는게 아닌 메모리 주소값을 기억하고 있어 호출했을 경..

JSON(Javascript Object Notation) JSON은 JavaScript Object Notation 의 약자로 데이터를 저장하거나 전송하기 위한 경량 DATA 포맷이다. JSON은 DATA 포맷이라는 단어처럼 데이터를 표현하기 위한 방법일 뿐이다. JSON 표현식은 사람과 기계 모두 이해하기 쉬우며 용량이 작아 최근에는 XML을 대신해 JSON이 데이터 전송에 많이 사용한다. XML vs JSON XML(eXtensible Markup Language) HTML과 비슷한 문자 기반의 마크업 언어이다. 사람과 기계 모두 읽기 편한 구조로 되어 있다. 하지만 HTML 처럼 데이터를 보여주는게 목적이 아닌 데이터를 저장하고 전달할 목적으로 만들어졌다. XML의 특징은 태그명을 사용자가 직접 ..