자바스크립트54 REST(Representational State Transfer) API 란? REST (Representational State Transfer) API는 웹 서비스를 위한 아키텍처 스타일 중 하나입니다. RESTful API 또는 REST API라고도 불립니다. RESTful API는 클라이언트-서버 모델을 따르며, 각각의 요청이 클라이언트 정보와 서버 정보를 포함합니다. REST API는 HTTP 프로토콜을 기반으로 하며, 자원(Resource)을 HTTP URI로 정의하고 HTTP Method를 통해 자원에 대한 행위(조회, 생성, 수정, 삭제)를 정의합니다. REST API는 다른 아키텍처와 비교하여 장점이 많습니다. 첫째, 간결한 인터페이스를 가지고 있습니다. URI와 HTTP Method만으로 요청을 처리할 수 있어, 단순하면서도 확장성이 높은 API를 만들 수 있습니.. 2023. 5. 8. 자바스크립트 class super JavaScript의 클래스 상속에서 super 키워드는 자식 클래스가 부모 클래스를 참조할 수 있도록 합니다. super를 사용하면 부모 클래스의 생성자 함수를 호출하거나 부모 클래스의 메서드에 접근할 수 있습니다. 이번 글에서는 super 키워드의 역할과 사용법에 대해 자세히 알아보겠습니다. super 키워드란? super는 부모 클래스를 참조하는 키워드입니다. super를 사용하면 부모 클래스의 생성자 함수나 메서드를 호출할 수 있습니다. super를 사용하는 가장 대표적인 경우는 자식 클래스의 생성자 함수에서 부모 클래스의 생성자 함수를 호출하는 것입니다. 이때 super() 함수를 호출합니다. super() 함수를 호출하면 부모 클래스의 생성자 함수가 호출되어 부모 클래스에서 정의한 초기화 작업.. 2023. 4. 24. 자바스크립트 class extends JavaScript 클래스 상속은 객체 지향 프로그래밍의 중요한 개념 중 하나입니다. 클래스 상속을 이용하면 이미 존재하는 클래스에서 속성과 메소드를 상속받아 새로운 클래스를 만들 수 있습니다. JavaScript에서는 extends 키워드를 사용하여 클래스를 상속하며, 이를 이용하면 코드의 재사용성이 높아지고 유지보수성이 향상됩니다. 클래스 상속이란? JavaScript 클래스 상속은 한 클래스가 다른 클래스로부터 속성과 메소드를 물려받아 새로운 클래스를 생성하는 것을 의미합니다. 이를 통해 기존 클래스의 코드를 재사용하여 새로운 클래스를 만들 수 있습니다. 이러한 상속 구조를 통해 코드의 중복성을 줄이고 코드의 가독성과 유지보수성을 향상시킬 수 있습니다. extends 키워드 JavaScript에서는.. 2023. 4. 24. 자바스크립트 클래스(Class) 자바스크립트에서 클래스는 ES6에서 새로 도입된 개념으로, 객체 지향 프로그래밍 패러다임에서 클래스를 구현하기 위한 방법을 제공합니다. 클래스를 이용하면 객체를 생성할 때 일반적으로 사용되는 생성자 함수와 프로토타입을 조합하여 작성되는 코드를 간결하게 작성할 수 있습니다. 클래스 정의 자바스크립트에서 클래스를 정의하는 방법은 다음과 같습니다. javascript class MyClass { constructor(prop1, prop2) { this.prop1 = prop1; this.prop2 = prop2; } method1() { // code } method2() { // code } } 위 코드에서 MyClass는 클래스 이름이며, constructor는 클래스 생성 시 호출되는 생성자 함수입니다.. 2023. 4. 21. 자바스크립트 생성자 함수(Constructor Function) 자바스크립트에서 객체를 생성하는 방법에는 생성자 함수를 이용하는 방법이 있습니다. 생성자 함수란 일반적인 함수와 마찬가지로 동작하지만, 객체를 생성할 때 사용됩니다. 생성자 함수는 new 연산자와 함께 사용되며, 객체를 생성할 때마다 생성자 함수를 호출하여 객체를 초기화합니다. 생성자 함수는 함수 선언문, 함수 표현식, 화살표 함수 등 여러가지 형태로 정의할 수 있습니다. 일반적으로 생성자 함수의 이름은 첫 글자를 대문자로 작성하여 구분합니다. 생성자 함수 내부에서는 this 키워드를 사용하여 새로운 객체를 가리킵니다. this를 이용하여 객체의 프로퍼티와 메서드를 정의할 수 있습니다. 생성자 함수 내부에서는 일반 함수와 마찬가지로 매개변수를 사용할 수 있습니다. 사용법 예를 들어, 다음과 같이 Pers.. 2023. 4. 20. 자바스크립트 팩토리 함수(Factory Function) 자바스크립트에서 팩토리 함수(Factory Function)란, 객체를 생성하여 반환하는 함수를 말합니다. 객체 지향 프로그래밍에서는 객체를 생성하는 것이 중요한 작업 중 하나이며, 팩토리 함수는 이를 쉽게 구현할 수 있도록 도와줍니다. 팩토리 함수는 보통 객체 리터럴 형태로 객체를 생성하는 것과는 달리, 동적으로 객체를 생성합니다. 팩토리 함수는 매개변수를 받아서 새로운 객체를 생성하고, 이를 반환합니다. 따라서 팩토리 함수를 사용하면 객체 생성에 필요한 로직을 모듈화하고, 재사용성을 높일 수 있습니다. 사용법 예를 들어, 사용자 정보를 가지고 있는 객체를 생성하는 팩토리 함수를 만들어보겠습니다. function createUser(name, age, gender) { return { name, age.. 2023. 4. 20. 자바스크립트 axios 사용법 Axios는 Promise 기반의 HTTP 클라이언트 라이브러리로, 브라우저와 Node.js에서 모두 사용할 수 있습니다. 이 라이브러리는 XHR(XMLHttpRequest)을 기반으로 하지만, fetch보다 더 많은 기능과 광범위한 브라우저 호환성을 제공합니다. Axios는 간단하고 직관적인 API를 가지고 있으며, 다양한 요청과 응답 인터셉트(intercept)를 지원합니다. 또한, 요청과 응답 데이터를 자동으로 직렬화(serialization)하고 역직렬화(deserialization)합니다. 기능 Axios를 사용하면 다음과 같은 기능을 수행할 수 있습니다. HTTP 요청을 보내기(GET, POST, PUT, DELETE 등) 요청 URL에 매개변수 전달하기 요청 본문에 데이터 전송하기 요청 헤더.. 2023. 4. 20. 자바스크립트 fetch 함수 fetch() 함수는 자바스크립트에서 제공하는 비동기 네트워크 요청 메서드로, 서버로부터 데이터를 받아오는 데 사용됩니다. fetch() 함수는 Promise를 반환하며, Response 객체를 resolve하는 새로운 Promise를 생성합니다. 사용법 fetch() 함수는 다음과 같은 문법을 가집니다. fetch(url, options); 여기서 첫 번째 매개변수인 url은 요청을 보낼 서버의 주소를 의미하며, 두 번째 매개변수인 options은 옵션 객체입니다. 옵션 객체는 HTTP 요청에 대한 다양한 옵션을 설정할 수 있는데, method, headers, body 등이 있습니다. fetch() 함수로 요청을 보내면, 응답으로 Response 객체가 반환됩니다. Response 객체는 HTTP 응.. 2023. 4. 20. 이전 1 2 3 4 ··· 7 다음