Axios란? Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리입니다. 쉽게 말해서 백엔드랑 프론트엔드랑 통신을 쉽게하기 위해 Ajax와 더불어 사용합니다. - 저는 AJAX보다 AXIOS를 훨씬 많이 사용합니다. 브라우저 호환성 Latest ✔ Latest ✔ Latest ✔ Latest ✔ Latest ✔ 11 ✔ axios 특징 운영 환경에 따라 브라우저의 XMLHttpRequest 객체 또는 Node.js의 http api 사용 Promise(ES6) API 사용 요청과 응답 데이터의 변형 HTTP 요청 취소 HTTP 요청과 응답을 JSON 형태로 자동 변경 Axios 사용법 Axios 다운로드 HTTP Methods Axios 사용해보기..

1. 상속 상속은 클래스의 선언 코드를 중복해서 작성하지 않도록 함으로써 코드의 생산 효율을 올리는 문법이다. 기본적인 형태는 다음과 같다. class 클래스이름 extends 부모클래스 이름{} 상속은 상속이라는 이름처럼 어떤 클래스가 가지고 있는 유산 (속성과 메소드)를 다른 클래스에게 물려주는 형태로 사용한다. 이때 유산을 주는 클래스를 부모클래스, 유산을 받는 클래스를 자식 클래스 라고 부른다. class shape { constructor(width, height, color) { this.width = width; this.height = height; this.color = color; } draw() { console.log(`drawing ${this.color} color of`); }..

클래스는 객체를 효율적이고 안전하게 만들기 위해서 만들어진 문법입니다. 기존의 문법을 효율적이고 안전하게 활용하기 위해 나온 문법입니다. 1. 객체지향 패러다임 객체지향 패러다임 객체를 우선적으로 생각해서 프로그램을 만든다는 방법론을 의미한다. 객체지향 프로그래밍 프로그래밍에서 필요한 데이터를 추상화시켜 상태와 행위를 가진 객체를 만들고 그 객체들 간의 유기적인 상호작용을 통해 로직을 구성하는 프로그래밍 방법이다. 절차지향 프로그래밍(C언어 등)을 보완하기 위해 등장했다. 절차지향 프로그래밍은 모듈을 재활용하기 어렵기 때문에 대규모 프로젝트에서는 코드의 반복으로 인해 장황해지거나 비효율적인 설계가 될것이다. "데이터와 이를 처리하는 함수를 함께 묶을 수 없을까?", "프로그램을 어떻게 구조적으로 나눌 수..

자바스크립트의 특징, 비동기 처리 // #1 console.log('양말을 신는다'); // #2 setTimeout(() => { console.log('신발을 신는다'); }, 1000); // #3 console.log('밖으로 나간다'); 자바스크립트의 대표적인 내장 비동기 함수인 setTimeout() 입니다. 첫번째 인자로 실행할 콜백함수를 담고 두번째 인자로 들어온 시간만큼 기다린 후에 콜백함수를 실행합니다. 코드의 실행을 예측한다면, 양말을 신는다. // 1초 후 신발을 신는다. 밖으로 나간다. 와 같이 동작하리라고 예측할 수 있습니다. 하지만, 양말을 신는다. 밖으로 나간다. 신발을 신는다. 와 같이 콘솔창에 나타나게 됩니다. 특정 로직의 실행이 끝날 때까지 기다려주지 않고 나머지 코드를..

옵셔널 체이닝(Optional Chaning) 자바스크립트에서 존재하지 않는 요소에 접근하려 할 때 에러가 발생할 수 있습니다. 그래서 옵셔널 체이닝이 등장하기 전에는 AND 연산자의 단축평가를 이용해 이를 해결할 수 있었습니다. let users = {} console.log(users && users.user && users.user.name) undefined 하지만 이 경우에 체이닝이 길어지면 길어질수록 코드의 복잡성이 증가한다는 단점이 있습니다. 그래서 이를 해결하기 위해 ES2020 부터 옵셔널 체이닝이 추가되었습니다. 옵셔널 체이닝(?.)은 체이닝(.)과 동일한 기능을 하는데 차이점은 옵셔널 체이닝은 nullish한(null or undefined) 값을 할당하고 있는 경우에 에러를 반환하지..

❓ ES는 무엇인가 ES는 ECMAScript의 약자입니다. 그리고 숫자 6은 여섯 번째 ES라고 생각하면 되겠습니다. 그렇다면 ES, ECMAScript는 무엇일까요? 위키백과를 보면 ECMAScript 는 Ecma 인터내셔널의 ECMA-262 기술 규격에 정의된 표준화된 스크립트 프로그래밍 언어입니다. 자바스크립트를 표준화하기 위해서 만들어졌으며 꼭 자바스크립트가 아니더라도 어도비 플래시를 사용하는 소프트웨어에서 사용하는 액션스크립트, MS 사의 인터넷 익스플로러에 쓰이는 J스크립트 등 다른 구현체들 역시 포함하고 있습니다. ES 가 등장하게 된 배경을 살펴보면 1990년대로 거슬러 올라갑니다. Netscape 회사는 웹 디자이너들과 파트 타입 프로그래머들이 이미지, 플러그인 등의 요소를 쉽게 조합해..

🤔JavaScript의 자료형과 JavaScript만의 특성은 무엇일까 ? 👉느슨한 타입(loosely typed)의 동적(dynamic) 언어 Javascript는 느슨한타입(loosely typed)의 동적 (dynamic)입니다. Javascript의 변수는 어떤 특정 타입과 연결되지 않으며, 모든 타입의 값으로 할당 (및 재할당) 가능합니다. 👉느슨한 타입(loosely typed)의 동적(dynamic) 언어의 문제점은 무엇이고 보완할 수 있는 방법에는 무엇이 있을까? 💡 문제점 타입이 올바른지 체크하는 것이 굉장히 까다롭기 때문에 배포 시 예상치 못한 문제가 발생할 수 있다. 실행 도중에 변수에 예상치 못한 타입이 들어와 타입에러가 발생할 수 있다. 동적타입 언어는 런타임 시 확인할 수 밖에 ..