메바동 서식지

러닝 리액트(Learning React)를 따라 하던 중 XMLHttpRequest를 사용하려니 ReferenceError: XMLHttpRequest is not defined 에러가 발생하였다. XMLHttpRequest (XHR) 객체는 서버와 상호작용할 때 사용하는 객체로, XHR을 사용하면 페이지의 새로고침 없이도 URL에서 데이터를 가져올 수 있다. 하지만 XHR은 브라우저에서만 제공되기 때문에 NodeJS 환경에서는 사용할 수 없는 것이 당연하다. axios나 fetch를 사용하여 NodeJS 환경에서 http 요청을 사용할 수 있는데, 책에서 나온 내용을 그대로 따라 하기 위해 XMLHttpRequest를 사용하려면 다음과 같이 하면 된다. // npm npm install xhr2 // ..

Do not access Object.prototype method 'hasOwnProperty' from target object. 대상 오브젝트에서 Object.prototype 메서드 'hasOwnProperty'에 액세스 하지 마세요. eslint를 사용할 경우 no-prototype-builtins라는 규칙에 위배되어 오류가 나타나게 된다. 해당 항목을 읽어보니 ECMAScript 5.1에서 지정된 [[Prototype]]을 가진 객체를 생성할 수 있는 Object.create 함수가 추가되었는데, Object.create(null)을 사용하여 객체를 생성할 경우 Object.prototype을 상속받지 않아 오류를 일으킬 수 있기 때문에 Object.prototype 메서드를 직접 호출하지 못..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 전략 패턴(Strategy Pattern) 전략 패턴은 객체 지향 디자인 패턴 중 하나로, 유사한 동작을 수행하는 알고리즘 집합을 정의하고, 이를 동적으로 선택하여 사용하는 방식으로 구현된다. 이 패턴을 사용하면, 알고리즘이 사용하는 행동들을 인터페이스를 통해 분리함으로써, 런타임에 객체가 다른 알고리즘을 선택할 수 있다. 전략 패턴은 대게 한 객체에서 알고리즘을 다른 객체로 전환하는 것이다. Strategy 객체는 다른 객체에서 호출될 수 있는 동일한 메서드..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 커맨드 패턴(Command Pattern) 커맨드 패턴은 요청이나 동작을 객체로 캡슐화하여 전달하고 조작하기 쉽게 만드는 행동 디자인 패턴이다. JavaScript에서 커맨드 패턴은 동작 요청자와 동작을 수행하는 객체를 분리하는 데 사용되어 코드의 유연성과 재사용성을 향상한다. JavaScript에서 커맨드 패턴은 다음 컴포넌트를 사용하여 구현할 수 있다. Command: 모든 명령에 대한 계약을 정의하는 인터페이스이다. 일반적으로 단일 실행 메서드를 포함한다..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 퍼사드 패턴(Facade Pattern) 퍼사드 패턴은 클래스, 인터페이스 및 하위 시스템으로 구성된 복잡한 시스템에 단순화된 인터페이스를 제공하는 구조 디자인 패턴이다. 클라이언트는 단일 인터페이스를 통해 시스템과 상호 작용할 수 있으며, 시스템 내 개별 구성 요소의 복잡성과 상호 작용을 숨길 수 있다. JavaScript에서 퍼사드 패턴은 일반적으로 복잡한 API, 라이브러리 또는 프레임워크와의 상호작용을 단순화하는 데 사용된다. 이 패턴은 컴포넌트 간의 ..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 어댑터 패턴(Adapter Pattern) 어댑터 패턴은 호환되지 않는 두 인터페이스가 함께 작동할 수 있도록 하는 디자인 패턴이다. 호환되지 않는 두 클래스 사이의 다리 역할을 하며 두 클래스의 소스 코드를 수정하지 않고도 함께 작업할 수 있도록 한다. 어댑터 패턴은 기존 클래스가 새로운 클래스 또는 인터페이스와 함께 작동해야 하지만 두 클래스의 인터페이스가 호환되지 않을 때 유용하다. JavaScritp에서 어댑터 패턴은 일반적으로 타사 라이브러리 또는 A..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 데코레이터 패턴(Decorator Pattern) 데코레이터 패턴은 개발자가 객체를 데코레이터 클래스의 객체로 감싸서 런타임에 새로운 기능을 동적으로 추가할 수 있도록 하는 구조 패턴이다. 데코레이터 패턴을 사용하면 개발자는 객체의 원래 구현을 변경하지 않고도 새로운 동작을 추가하여 객체의 기능을 확장할 수 있다. 데코레이터 패턴은 Component interface, Concrete component, Decorator abstract class, Concr..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 옵저버 패턴(Observer Pattern) 옵저버 패턴은 주체(Subject)로 불리는 객체가 옵저버라고 하는 종속 객체의 목록을 유지 관리하고, 일반적으로 메서드 중 하나를 호출하여 상태 변경을 자동으로 알리는 디자인 패턴이다. 옵저버 패턴은 객체 간의 느슨한 결합을 허용하여 서로의 구현에 대해 세부 사항을 알 필요 없이 상호 작용할 수 있다. 옵저버 패턴은 주체와 주체의 옵저버 간의 일대다 관계를 정의한다. 주체가 변경되면 모든 옵저버에게 알림이 전달되고..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 팩토리 패턴(Factory Pattern) 팩토리 패턴은 생성할 객체의 정확한 클래스나 생성자 함수를 지정하지 않고도 객체를 생성할 수 있는 방법을 제공하는 생성 패턴이다. 팩토리 패턴은 객체를 생성하기 위한 일반 인터페이스를 제공하고 하위 클래스가 생성될 객체의 유형을 변경할 수 있도록 한다. 팩토리 패턴은 다음과 같은 이점을 제공한다. 캡슐화: 객체 생성이 애플리케이션의 로직과 분리되어 보다 모듈화 되고 유지 관리가 용이한 아키텍처를 제공한다. 유연성: 팩..

"JavaScript Design Pattern" 포스팅은 ChatGPT에게 "Essential design patterns for JavaScript developers to learn"로 질문한 뒤 나온 내용에 대해 정리하는 포스팅입니다. 1. 싱글톤 패턴(Singleton Pattern) 싱글톤 패턴은 객체 지향 프로그래밍(OOP, Object-Oriented Programming)에서 클래스가 하나의 인스턴스만 가질 수 있도록 하고, 이에 대한 전역 접근 지점을 제공하기 위해 사용되는 디자인 패턴이다. 동일한 객체의 인스턴스를 여러 개 생성할 필요 없이 데이터베이스 연결이나 configuration 설정과 같은 특정 리소스에 대한 중앙 집중식 접근 지점을 제공하는 데 자주 사용된다. 즉, 한 번에..