모던 자바스크립트 Deep Dive

[JS][Deep Dive] 10장. 객체 리터럴

객체 란? 🌈 자바스크립트는 객체 기반의 프로그래밍 언어 ⚠ 원시 값을 제외한 나머지 값( 배열, 함수, 정규 표현식 등)은 모두 객체다 원시 타입은 단 하나의 값만 나타냄 객체 타입은 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조 즉, 원시 타입 = 변경 불가능 한 값, 객체 타입 = 변경 가능한 값 📚 객체는 0 개이상의 프로퍼티로 구성된 집합이며, 프로퍼티는 키와 값으로 구성됨 ❗ 자바스크립트에서 사용할 수 있는 모든 값은 프로퍼티 값이 될 수 있음 ❗ 자바스크립트의 함수는 일급 객체이므로 값으로 취급할 수 있음 ⇒ 함수도 프로퍼티 값으로 사용할 수 있음 🔥 이때 프로퍼티의 값이 함수면 함수를 메서드라고 부른다. (일반함수와 비교하기 위해서) ✔ 프로퍼티 : 객체의 상태를 나타내는 값(..

모던 자바스크립트 Deep Dive

[JS][DeepDive] 9장. 타입 변환과 단축 평가

타입 변환이란? 명시적 타입 변환( 타입 캐스팅 ) 자바스크립트의 모든 값에는 타입이 있음 📚타입은 개발자가 의도적으로 다른 타입으로 변환할 수 있음 암묵적 타입 변환 ( 타입 강제 변환 ) 📚 개발자의 의도와 관련 없이 타입이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되는 것 특징 기존 변수 값을 재할당하여 변경하는 것이 아님 피연산자의 값을 암묵적 타입 변환해서 새로운 타입으로 만들어내고 단 한 번 사용하고 버린다. 공통 특징 기존 원시값을 직접 변경하지 않음 🔥 원시 값은 변경 불가능한 값이므로 변경할 수 없음. 따라서, 타입 변환은 기존 원시값을 사용해 다른 타입의 새로운 원시값을 생성하는 것 그래서 어떻게 코딩을 하라고? 자신이 작성한 코드에서 암묵적 타입 변환이 발생하는지, 발생한다..

모던 자바스크립트 Deep Dive

[JS][Deep Dive] strict mode

strict mode란? ES5부터 strict mode(엄격 모드)가 추가되었습니다. strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킵니다. ES6에 도입된 클래스와 모듈은 기본적으로 strict mode가 적용됩니다. ESLint 같은 린트 도구를 사용해서 strict mode와 유사한 효과를 얻을 수 있습니다. 린트 도구는 정적 분석(Static Analysis) 기능을 통해 소스코드를 실행하기 전에 소스코드를 스캔하여 문법적 오류만이 아니라 잠재적 오류까지 찾아내고 오류의 원인을 리포팅해주는 유용한 도구입니다. 린트 도구는 strict mode가 제..

모던 자바스크립트 Deep Dive

[JS][Deep Dive] this

객체는 상태(State)를 나타내는 프로퍼티와 동작(Behvior)을 나타내는 메서드를 하나의 논리적인 단위로 묶은 복합적인 자료구조입니다. 동작을 나타내는 메서드는 자신이 속한 객체의 프로퍼티를 참조하려면 먼저 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야 합니다. 생성자 함수를 정의하는 시점에서 아직 인스턴스를 생성하기 이전이므로 생성자 함수가 생성할 인스턴스를 가리키는 식별자를 알 수 없습니다. 따라서 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 특수한 식별자가 필요합니다. 이를 위해 자바스크립트는 this라는 특수한 식별자를 제공합니다. this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수(Self-Referencing Variable)입니다. ..

모던 자바스크립트 Deep Dive

[JS][Deep Dive] 자바스크립트 개발 환경과 실행방법

자바스크립트 실행 환경 모든 브라우저, Node.js는 자바스크립트 엔진 내장 (JS 해석 & 실행) NODE.JS (목적) 브라우저 외부에서 자바스크립트 실행 환경을 제공하는 것 파일을 생성하고 수정할 수 있는 파일 시스템 제공 ECMAScript와 NODE.JS 고유의 API를 지원함 브라우저 (목적) HTML, CSS, JS를 실행해 웹 페이지를 브라우저 화면에 렌더링 DOM API(파싱된 HTML 요소를 선택하거나 조작하는 기능의 집합) 제공 보안상의 이유로 파일 시스템 미제공 ECMAScript, DOM, BOM, XMLHttpRequest,fetch, requestAnimation Frame, SVG, Web Storage, Web Component, Web Worker 같은 클라이언트 사이드..

모던 자바스크립트 Deep Dive

[JS][Deep Dive] 자바스크립트 특징

특징 HTML, CSS와 함께 웹을 구성하는 요소 중 하나로 웹 브라우저에서 동작하는 유일한 프로그래밍 언어 기본 문법은 C, 자바와 유사하고 셀프(Self)에서는 프로토타입 기반 상속을, 스킴(Scheme)에서는 일급함수의 개념을 차용 개발자가 별도의 컴파일 작업을 수행하지 않는 인터프리터 언어 인터프리터와 컴파일러의 장점을 결합해 비교적 처리 속도가 느린 인터프리터의 단점 해결 인터프리터 : 소스코드를 즉시 실행하고 컴파일러 : 빠르게 동작하는 머신 코드를 생성하고 최적화함 이를 통해 컴파일 단계에서 추가적인 시간이 필요함에도 빠르게 코드 실행함 명령형, 함수형, 프로토타입 기반, 객체지향 프로그래밍을 지원하는 멀티 패러다임 프로그래밍 언어 강력한 객체지향 프로그래밍 능력을 가지고 있음 → 자바스크립..

모던 자바스크립트 Deep Dive

[JS][Deep Dive] 자바스크립트와 ECMAScript

ECMAScript란 👉🏻 프로그래밍 언어의 값, 타입, 객체와 프로퍼티, 함수, 표준 빌트인 객체 등 핵심 문법을 규정함. 각 브라우저 제조사는 ECMAScript사양을 준수해서 브라우저에 내자오디는 자바스크립트 엔진을 구현함. 자바스크립트란 👉🏻 프로그래밍 언어로 기본 뼈대를 이루는 ECMAScript와 브라우저가 별도 지원하는 클라이언트 사이드 Web APl, 즉 DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame,SVG,Web Storage, Web Component, Web Worker 등을 아우르는 개념 ECMAScript는 스크립팅 언어를 어떻게 만들어야 하는지를 설명하는 일종의 설명서라고 생각하면 되고, JavaScript는 EC..

모던 자바스크립트 Deep Dive

[JS][Deep Dive] 자바스크립트의 역사, 탄생

🔎 자바스크립트 탄생 1. 1995년 자바스크립트탄생 : 넷스케이프 커뮤니케이션즈에서 웹페이지의 보조적인 기능을 수행하기 위해 웹에서 동작하는 프로그래밍 언어 도입 2. 1996년 모카로 이름 변경 → 라이브스크립트로 이름변경 → 자바스크립트로 이름 변경 📜 자바스크립트 표준화 1. 1996년 마이크로소프트에서 자바스크립트 파생ver인 Jscript 도입 문제는 Jscript와 자바스크립트가 표준화 되지 못하고 적당히 호환됨 서로 시장 점유율 높이려고 자사 브라우저에서만 동작하는 기능을 경쟁적으로 추가 따라서!!!!!!! 크로스 브라우징 이슈 발생 2. 넷스케이프 커뮤니케이션즈에서 컴퓨터 시스템의 표준을 관리하는 ECMA인터내셔널에 자바스크립트의 표준화를 요청 3. 1997년 자바스크립트 초판사양이 완성..

놀이터주인장
'모던 자바스크립트 Deep Dive' 카테고리의 글 목록