본문 바로가기

개발59

26. ES6 함수의 추가 기능 함수의 구분 자바스크립트의 함수는 별다른 형식의 구분이 없었다. 일반적인 함수로 호출할 수도 있고, new 연산자와 함께 호출하여 생성자 함수로 호출할 수도 있으며, 객체에 바인딩되어 메서드로서 호출할 수도 있다. ES6 이전의 모든 함수는 callable이면서 constructor다. 이는 유연하지만 실수를 유발할 수 있으며 성능 면에서도 손해다. 생성자 함수로 쓰이지 않는 메서드, 콜백 함수는 constructor와 prototype 객체를 소유할 필요가 없으며, 생성자 함수는 일반함수로 호출되면 의도대로 동작하지 않는다. ES6 이전의 모든 함수는 사용 목적에 따라 명확한 구분이 없으므로 호출 방식에 특별한 제약이 없고 생성자 함수로 호출되지 않아도 프로토타입 객체를 생성한다. 이러한 문제를 해결하.. 2022. 7. 25.
25. 클래스 클래스와 프로토타입 객체 생성 방식의 차이 자바스크립트는 프로토타입 기반 객체지향 언어다. 프로토타입 기반 객체지향 언어는 클래스가 필요 없는 객체지향 프로그래밍 언어다. 자바스크립트에서는 생성자 함수와 프로토타입을 통해 객체지향의 상속을 구현할 수 있다. (생성자 함수의 몸체에서 생성될 인스턴스의 프로퍼티를, 생성자 함수의 프로토타입 객체를 통해 인스턴스가 공유할(상속받을) 프로퍼티를 정의할 수 있다.) 하지만 클래스 기반 언어에 익숙한 프로그래머들은 프로토타입 기반 프로그래밍 방식에 혼란을 느낄 수 있으며, 자바스크립트를 어렵게 느끼게 하는 하나의 장벽처럼 인식되었다. 따라서 ES6에서 클래스라는 클래스 기반 객체지향 프로그래밍 방식과 유사한 객체 생성 매커니즘을 도입했다. 클래스는 기존의 프로토타입.. 2022. 7. 24.
24. 클로저 MDN에 기록된 클로저의 정의를 보면 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이라고 한다. 여기서 렉시컬 환경이란 함수 실행 컨텍스트의 구성 요소인 렉시컬 환경을 의미하고, 함수의 식별자와 스코프를 관리하는 영역이다. 함수가 선언된 렉시컬 환경이란 함수의 외부 함수의 스코프를 의미한다. 위와 같은 정의가 나오게 된 이유는 자바스크립트는 함수를 어디서 호출했는지가 아니라 함수를 어디에 정의했는지에 따라 상위 스코프를 결정하는 렉시컬 스코프(정적 스코프)를 따르기 때문이다. 클로저는 중첩 함수가 상위 스코프와 맺는 관계와 관련이 있다. 렉시컬 스코프란 렉시컬 환경의 '외부 렉시컬 환경에 대한 참조'에 저장할 참조값, 즉 상위 스코프에 대한 참조는 함수 정의가 평가되는 시점에 함수가 정의된 환경.. 2022. 7. 20.
23. 실행 컨텍스트 실행 컨텍스트는 소스 코드의 평가와 실행에 관련된 동작을 아우르는 개념이다. 실행 컨텍스트를 통해 전역 코드와 함수 코드 등 모든 소스 코드의 스코프, 동작 순서, 비동기 처리 등이 관리된다. 소스코드의 타입 자바스크립트는 소스코드를 4가지 타입으로 구분한다. 4가지 타입의 소스코드는 실행 컨텍스트를 생성한다. 소스코드의 타입 설명 실행 컨텍스트 생성 과정 전역 코드 전역에 존재하는 소스코드를 말한다. 전역에 정의된 함수, 클래스 등의 내부 코드는 포함되지 않는다. 전역 변수를 관리하기 위해 최상위 스코프인 전역 스코프를 생성해야 한다. 전역 객체와 연결된다. 전역 코드가 평가되면 전역 실행 컨텍스트가 생성된다. 함수 코드 함수 내부에 존재하는 소스코드를 말한다. 함수 내부에 중첩된 함수, 클래스 등의 .. 2022. 7. 19.
22. this this 키워드 생성자 함수는 인스턴스를 생성하는데 목적이 있다. 생성자 함수 내부에 정의한 메서드는 인스턴스의 메서드가 된다. 그런데 생각해 볼 점은, 생성자 함수를 정의하는 시점에는 인스턴스가 아직 생성되지 않았다. 따라서 메서드에서 인스턴스의 프로퍼티에 접근할 필요가 있을때, 아직 생성되기 전인 인스턴스를 참조할 수 있는 식별자가 필요하다. 이를 위해 자바스크립트는 this라는 특수한 식별자를 제공한다. this는 자신이 속한 객체 또는 자신이 생성할 인스턴스를 가리키는 자기 참조 변수다. this를 통해 자신이 속한 객체 또는 자신이 생성할 인스턴스의 프로퍼티나 메서드를 참조할 수 있다. 함수를 호출하면 arguments 객체와 this가 암묵적으로 함수 내부에 전달된다. this는 지역 변수처.. 2022. 7. 18.
21. 빌트인 객체 객체의 분류 표준 빌트인 객체: ECMAScript 사양에 정의된 객체로, 애플리케이션 전역의 공통 기능을 제공한다. 자바스크립트 실행 환경에 상관없이 언제나 사용할 수 있다. 표준 빌트인 객체는 전역 객체의 프로퍼티로 제공된다. 따라서 별도의 선언 없이 전역 변수처럼 참조할 수 있다. 호스트 객체: 자바스크립트 실행 환경(Node.js, 브라우저)에서 제공하는 객체이다. 브라우저 환경에서는 DOM, BOM, Canvas, XMLHttpRequest, fetch, requestAnimationFrame, SVG, Web Storage, Web Component, Web Worker와 같은 클라이언트 사이드 Web API를 제공한다. Node.js 환경에서는 Node.js 고유의 API를 호스트 객체로 제.. 2022. 7. 18.

티스토리툴바