sharingStorage

구굴의 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경인 Node.js의 등장으로 자바스크립트는 웹르바우저를 벗어나 서버사이드 애플리케이션 개발에도 사용할 수 있는 범용 개발 언어가 되었다. 대부분의 프로그래밍 언어는 운영체제나 가상머신 위에서 실행되지만 웹 어플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS 와 함께 실행된다. 이를 위해 브라우저가 HTML, CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱(해석)하여 브라우저에 렌더링하는지 살펴보자 브라우저는 다음과 같은 과정을 거쳐 렌더링을 수행한다 브라우저는 HTML, CSS, 자바스크립트, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버로부터 응답받는다. 브라우저의 렌더링 엔진은 서버로부터..

37.1 Set Set 객체는 중복되지 않는 유일한 값들의 집합이다. Set 객체는 배열과 유사하지만 다음과 같은 차이가 있다. Set객체는 동일한 값을 중복하여 포함할 수 없다. 요소 순서에 의미가 없다. 인덱스 요소에 접근할 수 없다. Set 객체의 특성은 수학적 집합의 특성과 일치한다. Set은 수학적 집합을 구현하기 위한 자료구조이며 Set을 통해 교집합, 합집합, 차집합, 여집합 등을 구현할 수 있다. 37.1.1 Set 객체의 생성 Set 생성자 함수는 이터러블을 인수로 전달받아 Set 객체를 생성한다. 이때 이터러블의 중복된 값은 Set 객체에 요소로 저장되지 않는다. 중복을 허용하지 않는 Set 객체 특성을 활용하여 배열의 중복된 요소를 제거할 수 있다. 37.1.2 요소 개수 확인 Set..

25. 클래스 ES6에서 도입된 클래스는 객체지향 프로그래머가 더욱 빠르게 학습할 수 있도록 클래스 기반 객체지향 프로그래밍 언어와 매우 흡사한 새로운 객체 생성 메커니즘을 제시한다. 클래스와 생성자 함수는 모두 프로토 타입 기반의 인스턴스를 생성하지만 정확하게 동일하게 동작하는 것은 아니다. 클래스는 생성자 함수보다 엄격하며 다음과 같이 몇 가지 차이가 있다. 클래스를 new 연산자 없이 호출하면 에러가 발생한다. 하지만 생성자 함수를 new 연산자 없이 호출하면 일반함수로서 호출된다. 클래스는 상속을 지원하는 extends와 super 키워드를 제공한다 클래스는 호이스팅으 발생하지 않는 것처럼 동작한다. 하지만 함수 선언문으로 정의된 생성자 함수는 함수 호이스팅이, 함수 표현식으로 정의된 생성자 함수..

15.1 var 키워드로 선언한 변수의 문제점 15.1.1 변수 중복 선언 허용 var키워드로 선언한 변수는 중복 선언이 가능하다. var x=1; var y=2; var x=100; var y; console.log(x); //100 위와 같이 동일한 이름의 변수가 이미 선언되어 있는 것을 모르고 변수를 중복 선언하면서 값을 할당하면 의도하지 않게 변수의 값이 변경되는 부작용이 발생한다. 15.1.2 함수 레벨 스코프 var 키워드로 선언한 변수는 오로지 함수의 코드 블록만을 지역 스코프로 인정한다. 따라서 함수 외부에서 var 키워드로 선언한 변수는 코드 블록 내에서 선언해도 모두 전역 변수가 된다. var x=1; if(true){ var x=10; } console.log(x); //10 15.1..

스코프란? 스코프(유효범위)는 자바스크립트를 포함한 모든 프로그래밍 언어의 기본적이며 중요한 개념이다. var 키워드로 선언한 변수와 let, const로 선언한 변수의 스코프도 다르게 동작한다. 스코프 내에서 식별자는 유일해야하지만 다른 스코프에는 같은 이름의 식별자를 사용할 수 있다. 즉 식별자는 네임스페이스다. function foo(){ var x =1; var x=2; // var 키워드로 선언된 변수는 같은 스코프 내에서 중복 선언을 허용 // 따라서 아래 변수 선언문은 js엔진에 의해 var 키워드가 없는 것처럼 동작 console.log(x); //2 } foo(); function bar(){ let x=1; //let이나 const로 선언된 변수는 같은 스코프 내에서 중복 선언을 허용하..

12장 함수 12.4.1 함수 선언문 함수는 함수 이름으로 호출하는 것이 아니라 함수 객체를 가리키는 식별자로 호출한다. var add1 = function add2 (x,y) { return x + y; }; console.log(add1(1,2)); // 3 식별자인 add1으로 함수를 호출한다. 12.4.3 함수 생성 시점과 함수 호이스팅 console.log(add(2,4)); // 6 console.log(sub(3,1)); // TypeError: sub is not a function //함수 선언문 function add (x,y){ return x+y; } //함수 표현식 var sub = function(x,y){ return x-y; } 위 예제와 같이 함수 선언문으로 정의한 함수는 ..

11장 원시 값과 객체의 비교 자바스크립트가 제공하는 7가지 데이터 타입은 크게 원시 타입과 객체 타입으로 구분할 수 있다. 이번 장을 시작하기 앞서 원시 타입과 객체 타입의 차이점을 비교해보도록 하겠다. 원시 타입 객체 타입 값의 유형 변경 불가능한 값(immutable) 변경 가능한 값(mutable) 변수에 저장되는 값 변수에 실제 값이 저장됨 변수에 참조 값이 저장됨 복사되어 전달되는 방식 원시 값이 복사되어 전달 (값에 의한 전달) pass by value 참조값이 복사되어 전달 (참조에 의한 전달) pass by reference 11.1 원시 값 원시 값은 변경 불가능 하므로 값을 선언한 후 값의 할당, 재할당할 때의 변수가 참조하는 메모리 공간의 주소가 변경된다. 11.1.1 문자열과 불변..

10장 객체리터럴 자바스크립트는 객체 기반의 프로그래밍 언어이며 자바스크립트를 구성하는 것중 원시값을 제외한 나머지 값(함수, 배열, 정규표현식 등)은 모두 객체이다. 객체타입은 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조이며 원시 값은 immutable한 값이지만 객체는 mutable(변경가능)한 값이다. 객체는 0개 이상의 프로퍼티로 이루어져 있으며 프로퍼티는 프로퍼티 키와 프로퍼티 값으로 나뉜다. 함수도 프로퍼티 값이 될 수 있으며 이때 함수를 메서드(method)라고 부른다. var counter= { num=0; //프로퍼티 increase: function() { // 메서드 this.num++; } } 위처럼 객체는 프로퍼티와 메서드로 구성된 집합체이다. 10.2 객체 리터럴에..