JavaScript Memoization
·
JavaScript
1. Memoization 메모이제이션이란?기억되어야 할 것이라는 뜻의 라틴어에서 파생된 단어로, 컴퓨터 프로그램이 동일한 계산을 반복적으로 해야할 때, 이전에 계산한 값을 메모리에 저장하여 중복적인 계산을 제거하여 전체적인 실행 속도를 빠르게 해주는 기법으로 동적 계획 법(DP: Dynamic Programming)의 핵심이 되는 기술이다. // 지정한 수가 소수인지 여부를 반환var isPrime2 = function (num) { console.time('소요 시간'); console.log('소수 판별 시작.', num); // TODO: 소수 판별 코드 let prime = num > 1; // 1은 소수가 아님 for (let i = 2; i  소수는 1과 자기 자신만으로 나누어 떨어..
JavaScript reduce(), find()
·
JavaScript
1.Reduce() , Array.prototype.reduce(callback[, initialValue])Reduce 함수란?reduce는 사전적으로 줄이다라는 뜻을 가지고 있다, 사저적 의미 그대로, 리듀스 함수는 배열의 요소를 순차적으로 순회하며 숫자든 배열이든 객체든 하나의 값우로 줄여 return하는 함수이다. 즉, 배열을 기반으로 하나의 값을 도출할 때 사용된다. reduce 함수 기본 문법arr.reduce(callback(accumulator, currentValue, index, array), initialValue);// 배열.reduce(callback(누적값, 현재값, 인덱스, 요소), 초기값); reduce()는 빈 요소를 제외하고 배열 내에 존재하는 각 요소에 대해 callba..
[모던자바스크립트 Deep Dive] 45장. 프로미스
·
JavaScript
1. PromiseES6에서 비동기 처리하기 위한 다른 패턴으로 프로미스를 도입했다. 프로미스는 전통적인 콜백 패턴이 가진 단점을 보완하며 비동기 처리 시점을 명확하게 표현할 수 있다는 장점이 있다. 2. 비동기 처리를 위한 콜백 패턴의 단점const get = (url) => { const xhr = new XMLHttpRequest(); xhr.open("GET", url); xhr.send(); xhr.onload = () => { if (xhr.status === 200) { return JSON.parse(xhr.response); } console.log(`${xhr.status}`); };};const response = get("https://json~~"..
map, forEach, for of, ArrowFunction
·
JavaScript
var arr = [10, 20, 30];var arr2 = [100, 400, 900];1. forfor 반복문으로 위 arr2를 출력하는 것인데, arr의 제곱을 출력하는 것이다.여기서 전체적으로 var를 사용할 것인데, 그 이유는 전첵적으로 같은 변수가 많기 때문에 사용 한 것이다.var arr2 = [];for (let i = 0; i  2. for of ( ES 6 )for of는 ES6에 나온 문법으로, arr라는 배열을 순회하면서 item에 요소를 할당해주는 것이다. 그래서 arr2라는 빈 배열을 만들고, push를 통해 arr2 배열에 item * item 한 값을 넣어주는 것이다.var arr2 = [];for (let item of arr) { arr2.push(item * item)..
리액트 기본 개념 - 4
·
React/다시 공부하는 리액트
라이브러리 추가할 때  이렇게 여러 라이브러리를 추가할 때가 있다. 근데 여기 자세히 보면 umd, standalone이런 단어가 있다. 이게 무엇이냐? 아래와 같다.umd 여러환경에서 작동하도록standalone : 브라우저에서만 사용babelbabel이란? JS 코드를 구형 브라우저나 실행 환경에서도 동작하도록 변환(트랜스파일)해주는 도구이다.여기서 만약에  -> 변환 O -> 변환 X function App() { return Hello JSX; // return React.createElement('h1', null, 'Hello React'); } 구조분해할당, Props부모 컴포넌트에서 자식 컴포넌트에 데이터를 전달할 때 두 가지 방법이 있다. 1. 구..
리액트 기본 개념 - 3
·
React/다시 공부하는 리액트
실습을 하던 중 이제 props로 부모에서 자식으로 데이터를 전달 해줘야한다. 그래서 이 데이터 전달에 대한 코드만 적겠다.이는 todo인데, 이제 Header, Todo, Footer 이렇게 있는데, 전달은 Todo를 통해 자식에게 전달해준다.  이것은 Todo.jsx 쇼핑 목록 여기를 보면 TodoInput과 TodoList가 있다.그리고 TodoList안에 TodoItem에 있기에 둘다 전달해줘야 한다. 아래와 같이 전달 받으면 되는데, 여기서 문제가 있는게, 만약 함수를 전달한다. 그러면 함수에 return값이 없다면 undefined로 되어, 어떠한 작동도 하지 않을 것이다. 그래서 전달할 때는 저렇게 이벤트를 통해 전달하여 저 이벤트가 ..
오류확인자
절대 오류를 확인해!