본문 바로가기

분류 전체보기170

virtual dom에 대하여... 오늘은 virtual dom에 대해서 알아볼려고 한다. 정확히 말하자면 "버츄얼 돔과 리얼 돔의 차이를 설명해주세요"라는 질문에 답을 하려고 한다. 1. 버츄얼 돔과 리얼 돔의 차이를 설명해주세요 버츄얼 돔의 경우에는 리엑트에서 제공하는 매커니즘으로 기존의 돔처럼 변화가 일어나는 즉시 dom을 업데이트 하는 매커니즘이 아니라 기존의 dom과 버츄얼 돔과의 차이점을 분석하고 이 차이점에 기반해서 바뀌는 부분들에 대해서만 업데이트를 하는 매커니즘이다. 이 매커니즘의 장점으로는 불필요한 dom의 업데이트가 일어나지 않기 때문에 성능적인 면에서 굉장히 빠르고 부드럽다는 장점이 있다. https://minprogramming.tistory.com/entry/리엑트를-다루는-기술-1강 리엑트 렌더링 과정에 대하여... 2023. 8. 17.
전역상태관리에 대하여... 오늘은 전역상태관리에 대해서 알아볼려고 한다. 정확하게 말하자마녀 Redux를 제외한 다른 상태관리 툴에 대해서 설명하려고 한다. 1. redux말고 다른 상태관리 툴은 무엇이 있으며 어떤 차이점이 있는가? 1-1) redux를 제외한 나머지 툴로 대표적인 예시는 context api가 있습니다. 1-2) context api와 redux의 차이점으로는 성능 이슈와 관련이 깊습니다. redux의 경우에는 전역적으로 상태를 관리하고 이에 대해서 필요한 부분들에서만 렌더링이 이루어집니다. 반면 context api의 경우에는 한번 컴포넌트가 바뀔 경우에 모든 컴포넌트가 바뀐다는 단점이 존재합니다. 따라서 context api를 사용할 때는 불 필요한 리렌더링을 줄이기 위해서 useMemo나 React.mem.. 2023. 8. 17.
프로그래머스 같은 숫자는 싫어 자바스크립트 https://school.programmers.co.kr/learn/courses/30/lessons/12906 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr function solution(arr) { let stack = [] for (a of arr) { if(stack[stack.length - 1] !== a) stack.push(a) } return stack; } function solution(arr) { return arr.filter((val,index) => val != arr[index+1]); } filter https://dev.. 2023. 8. 16.
프로그래머스 콜라 문제 자바스크립트 https://school.programmers.co.kr/learn/courses/30/lessons/132267 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr //주어진 콜라가 다 떨어질 때까지 반복 //주어진 콜라를 b만큼 나눈 다음에 그 나눈 몫을 저장 //주어진 콜라를 b만큼 나눈 다음에 그 나눈 나머지를 저장 //몫을 다시 주어진 콜라로 전환 function solution(a, b, n) { var answer = 0; while(n >= a) { let 몫 = Math.floor(n / a) let 나머지 = n % a n = 몫 * b +.. 2023. 8. 16.
프로그래머스 추억 점수 자바스크립트 https://school.programmers.co.kr/learn/courses/30/lessons/176963 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr //photo에 있는 배열들을 하나씩 꺼내면서 다음 과정을 수행합니다. //꺼낸 배열의 원소들을 하나씩 꺼내면서 다음 과정을 수행합니다. //만약 원소가 name에 있다면 그 인덱스에 해당하는 yearning에 값을 더합니다. //만약 원소가 name에 없다면 해당 과정을 수행하지 않습니다. //원소들을 다 돌고 나서 그 합을 answer에 push 합니다. function solution(na.. 2023. 8. 16.
redux에 대하여... 오늘은 redux에 대해서 같이 이야기를 나눌려고 한다. 정확히 말하자면 redux는 무엇이고 왜 사용하는지에 대해서 알아볼려고 한다. 1. redux 란? : redux는 전역 상태 관리를 도와주는 라이브러리입니다. 2. redux의 사용이유 : redux 의 사용 이유에는 여러가지가 있지만 그중에서 2가지만 보도록 하겠습니다. 첫번째는 단방향 통신입니다. redux의 경우 단방향 통신 즉 FLUX 패턴에 근거하여 상태 관리가 이루어집니다. 이는 복잡한 상황을 간단하게 만들고 예상치 못한 오류를 사전에 해결할 수 있습니다. 다음은 미들웨어를 지원한다는 점입니다. 리덕스에는 리덕스 미들웨어를 제공합니다. 이는 로그 관리 , 에러 핸들링 , 비동기 처리를 하는 데 있어서 굉장히 용이합니다. 이는 결과적으로.. 2023. 8. 16.

티스토리툴바