[자바스크립트] 55

[JavaScript/DeepDive]22.this

[22.1] this 키워드 객체는 상태를 나타내는 프로퍼티와 동작을 나타내는 메서드를 하나의 논리적인 단위로 묶은 복합적인 자료구조다. 동작을 나타내는 메서드는 자신이 속한 객체의 상태, 즉 프로퍼티를 참조하고 변경할 수 있어야 한다. 이때 메서드가 자신이 속한 객체의 프로퍼티를 참조하려면 먼저 자신이 속한 객체를 가리키는 식별자를 참조할 수 있어야 한다. this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. this가 가리키는 값, 즉 this 바인딩은 함수 호출 방식에 의해 동적으로 결정된다. // 객체 리터럴 const circle = { radius: 5, ge..

[JavaScript/Node]HTTP 요청 메서드

HTTP 요청 메서드 GET 서버 자원을 가져오고자 할 때 사용합니다. 요청의 본문에 데이터를 넣지 않습니다. 데이터를 서버로 보내야 한다면 쿼리스트링을 사용합니다. POST 서버의 자원을 요청에 들어 있는 자원으로 치환하고자 할 때 사용합니다. 요청의 본문에 치환할 데이터를 넣어 보냅니다. PATCH 서버 자원의 일부만 수정하고자 할 때 사용합니다. 요청의 본문에 일부 수정할 데이터를 넣어 보냅니다. DELETE 서버의 자원을 삭제하고자 할 때 사용합니다. 요청의 본문에 일부 수정할 데이터를 넣어 보냅니다. OPTIONS 요청을 하기전에 통신 옵션을 설명하기 위해 사용합니다. 출처: Node.js 교과서 개정2판

[JavaScript/Node]HTTP 상태 코드

HTTP 상태 코드 2XX 성공을 알리는 상태 코드입니다. 대표적으로 200(성공), 201(작성됨)이 많이 사용됩니다. 3XX 리다이렉션(다른 페이지로 이동)을 알리는 상태 코드입니다. 어떤 주소를 입력했는데 다른 주소의 페이지로 넘어갈 때 이 코드가 사용됩니다. 대표적으로 301(영구 이동), 302(임시 이동)가 있습니다. 304(수정되지 않음)는 요청의 응답으로 캐시를 사용했다는 뜻입니다. 4XX 요청 오류를 나타냅니다. 요청 자체에 오류가 있을 때 표시됩니다. 대표적으로 400(잘못된 요청), 401(권한 없음), 403(금지됨), 404(찾을 수 없음)가 있습니다. 5XX 서버 오류를 나타냅니다. 요청은 제대로 왔지만 서버에 오류가 생겼을 때 발생합니다. 이 오류가 뜨지 않게 주의해서 프로그래..

[JavaScript/DeepDive]21.빌트인 객체

[21.1] 자바스크립트 객체의 분류 표준 빌트인 객체 호스트 객체 사용자 정의 객체 [21.2] 표준 빌트인 객체 자바스크립트는 Object, String, Number, Boolean, Symbol, Date, Math, RegExp, Array, Map/Set, WeakMap/WeakSet, Function, Promise, Reflect, Proxy, JSON, Error 등 40여 개의 표준 빌트인 객체를 생성한다. Math, Reflect, JSON을 제외한 표준 빌트인 객체는 모두 인스턴스를 생성할 수 있는 생성자 함수 객체다. 생성자 함수 객체인 표준 빌트인 객체는 프로토타입 메서드와 정적 메서드를 제공하고 생성자 함수 객체가 아닌 표준 빌트인 객체는 정적 메서드만 제공한다. 생성자 함수인..

[JavaScript/Deepdive]20.strict mode

[20.1] strict mode란? strict mode는 자바스크립트 언어의 문법을 좀 더 엄격히 적용하여 오류를 발생시킬 가능성이 높거나 자바스크립트 엔진의 최적화 작업에 문제를 일으킬 수 있는 코드에 대해 명시적인 에러를 발생시킨다. [20.2] strict mode의 적용 strict mode를 적용하려면 전역의 선두 또는 함수 몸체의 선두에 'use strict';를 추가한다. 전역의 선두에 추가하면 스크립트 전체에 strict mode가 적용된다. 함수 몸체의 선두에 추가하면 해당 함수와 중첩 함수에 strict mode가 적용된다. 코드의 선두에 'use strict';를 위치시키지 않으면 strict mode가 제대로 동작하지 않는다. [20.3] 전역에 strict mode를 적용하는 ..

[JavaScript/DeepDive]19.프로토타입(3)

[19.9] 프로토타입의 교체 프로토타입은 임의의 다른 객체로 변경할 수 있다. 부모 객체인 프로토타입을 동적으로 변경할 수 있다는 것을 의미한다. 이러한 특징을 활용하여 객체 간의 상속 관계를 동적으로 변경할 수 있다. 프로토타입은 생성자 함수 또는 인스턴스에 의해 교체할 수 있다. 생성자 함수에 의한 프로토타입의 교체 프로토타입을 교체하면 constructor 프로퍼티와 생성자 함수 간의 연결이 파괴된다. 프로토타입으로 교체한 객체 리터럴에 constructor 프로퍼티를 추가하여 프로토타입의 constructor 프로퍼티를 되살린다. 인스턴스에 의한 프로토타입의 교체 프로토타입은 생성자 함수의 prototype 프로퍼티뿐만 아니라 인스턴스의 __proto__ 접근자 프로퍼티(또는 Object.get..

[JavaScript/DeepDive]19.프로토타입(2)

[19.4] 리터럴 표기법에 의해 생성된 객체의 생성자 함수와 프로토타입 생성자 함수에 의해 생성된 인스턴스는 프로토타입의 constructor 프로퍼티에 의해 생성자 함수와 연결된다. 이때 constructor 프로퍼티가 가리키는 생성자 함수는 인스턴스를 생성한 생성자 함수다. // obj 객체를 생성한 생성자 함수는 Object다. const obj = new Object( ); console.log(obj.constructor === Object) // true // add 함수 객체를 생성한 생성자 함수는 Function이다. const add =new Function('a', 'b', 'return a + b'); console.log(add.constructor === Function); //..

[JavaScript/DeepDive]19.프로토타입(1)

자바스크립트는 명령형, 함수형, 프로토타입 기반 객체지향 프로그램잉을 지원하는 멀티 패러다임 프로그래밍 언어다. 자바스크립트는 객체 기반의 프로그래밍 언어이며 자바스크립트를 이루고 있는 거의 "모든 것"이 객체다. 원시 타입의 값을 제외한 나머지 값들(함수, 배열, 정규 표현식 등)은 모두 객체다. [19.1] 객체지향 프로그래밍 객체지향 프로그래밍은 프로그램을 명령어 또는 함수의 목록으로 보는 전통적인 명령형 프로그래밍의 절차지향적 관점에서 벗어나 여러 개의 독립적 단위, 즉 객체의 집합으로 프로그램을 표현하려는 프로그래밍 패러다임을 말한다. 객체지향 프로그래밍은 실세계의 실체(사물이나 개념)를 인식하는 철학적 사고를 프로그래밍에 접목하려는 시도에서 시작한다. 실체는 특징이나 성질을 나타내는 속성을 가..

[JavaScript/DeepDive]18.함수와 일급 객체

[18.1] 일급 객체 다음과 같은 조건을 만족하는 객체를 일급 객체라 한다. 무명의 리터럴로 생성할 수 있다. 즉, 런타임에 생성이 가능하다. 변수나 자료구조(객체, 배열)에 저장할 수 있다. 함수의 매개변수에 전달할 수 있다. 함수의 반환값으로 사용할 수 있다. 자바스크립트의 함수는 다음 예제와 같이 위의 조건을 모두 만족하므로 일급 객체다. // 1. 함수는 무명의 리터럴로 생성할 수 있다. // 2. 함수는 변수에 저장할 수 있다. // 런타임(할당 단계)에 함수 리터럴이 평가되어 함수 객체가 생성되고 변수에 할당된다. const increase = function (num) { return ++num; }; const decrease = function (num) { return --num; }..

[JavaScript/DeepDive]17.생성자 함수에 의한 객체 생성

[17.1] Object 생성자 함수 new 연산자와 함께 Object 생성자 함수를 호출하면 빈 객체를 생성하여 반환한다. 빈 객체를 생성한 이후 프로퍼티 또는 메서드를 추가하여 객체를 완성할 수 있다. // 빈 객체의 생성 const person = new Object( ); // 프로퍼티 추가 person.name = 'Lee'; person.sayHello = function( ){ console.log('Hi! My name is ' + this.name); }; console.log(person); // {name: "Lee", sayHello: f} person.sayHello( ); // Hi! My name is Lee 생성자 함수에 의해 생성된 객체를 인스턴스라 한다. [17.2] 생성..