[JavaScript] 자바스크립트의 비동기 처리와 Promise 객체
·
Coding/JavaScript
웹 개발에서, 사용자 경험을 향상시키기 위해 비동기 처리는 중요한 개념입니다. 자바스크립트에서는 비동기 처리를 위해 Promise 객체를 사용합니다. 이 글에서는 자바스크립트의 비동기 처리 방식과 Promise 객체에 대해 알아보겠습니다.1. 비동기 처리의 필요성웹 애플리케이션은 사용자와의 상호작용에 맞춰 동적으로 데이터를 업데이트하고, 외부 서버와 통신하여 데이터를 가져와야 합니다. 이러한 작업은 시간이 오래 걸리는 경우가 많아, 이를 동기적으로 처리하면 사용자 경험이 저하될 수 있습니다. 따라서 비동기적으로 처리하여 웹 페이지의 응답성을 향상시키는 것이 중요합니다.2. 비동기 처리의 구현자바스크립트에서 비동기 처리는 주로 콜백 함수를 통해 이루어집니다. 예를 들어, Ajax 요청이나 타이머 함수 등을..
[JavaScript] 배열 요소 합계
·
Coding/JavaScript
배열 요소의 총 합을 구하기 위해서 reduce 함수를 사용한다. 자바스크립트의 reduce 함수는 배열의 각 요소를 순회하며 callback 함수의 실행 값을 누적하여 하나의 결과값을 반환한다. 1. 합계 구하기 const arr = [1, 2, 3]; const result = arr.reduce(function add(sum, currValue) { return sum + currValue; }, 0); console.log(result); // 6 위 예시 처럼 합계를 구할 수 있다. [출처] https://cocobi.tistory.com/134 [JS] 자바스크립트 배열의 합계, 평균 구하기 📌 배열의 합계, 평균 구하기 자바스크립트에서 배열의 합계와 평균을 구하는 방법으로 reduce( )를..
[JavaScript] 배열 중복 제거
·
Coding/JavaScript
Set 객체를 사용하여 배열 중복 요소 제거 1. Set const dupArr = [1, 2, 3, 1, 2]; const set = new Set(dupArr); const uniqueArr = [...set]; document.writeln(Array.isArray(uniqueArr)); // true document.writeln(uniqueArr); // 1, 2, 3 위와 같이 배열 내부 중복을 제거할 수 있다. [출처] https://hianna.tistory.com/422 [Javascript] 배열 중복 제거하는 3가지 방법 Javascript의 배열에서 중복 되는 값을 제거하는 3가지 방법을 알아보도록 하겠습니다. 1. Set 2. indexOf(), filter() 3. forEach..
[React] TodoList - 컴포넌트 만들기 (1/3)
·
Coding/React
Visual Studio Code 터미널에서 create-react-app 을 사용하여 새로운 프로젝트를 만든다. npm 버전이 맞지 않을 경우 재설치를 하거나 nvm list에서 nvm 버전을 바꾼다. create-react-app 에러 발생 시 지우고 재설치 해본다. $ npx create-react-app mashup-todolist 해당 디렉토리 이동 후 react-icons와 styled-component 라이브러리를 설치한다. $ cd mashup-todolist $ yarn add react-icons styled-components 그리고 터미널에서 해당 디렉토리를 열고 yarn start 를 입력하여 개발 서버를 실행한다. 만들어야 할 컴포넌트 목록 TodoTemplate 우리가 만들 T..
[JavaScript] ECMAScript 6
·
Coding/JavaScript
소개 ECMA(European Computer Manufacturers Association) Script는 JavaScript 프로그래밍 언어를 정의하는 국제 표준의 이름이다. 현재 사용하는 대부분의 JavaScript는 2009년에 처음 제정되어 2011년에 개정된 ECMAScript 5.1 표준에 기반하고 있다. 이후 클래스 기반 상속, 데이터 바인딩(Object.observe), Promise 등 다양한 요구사항들이 도출되었다. 그 결과 2015년 6월에 대대적으로 업데이트된 ECMAScript 6 를 발표했고, 매년 표준을 업데이트하는 정책에 따라 2016년 6월에 ECMAScript 7 를 발표했다. ES6 = ECMAScript6 = ECMAScript 2015 = ES2015 으로 표기한다..