all category

programmers

[Programmers Level 2] 모음사전 Javascript

⚡문제정보 역시 완전 탐색 문제입니다. A부터 E까지 순서대로 적혀있는데 단어가 주어지면 그 순서를 맞춰주면 됩니다. A 1 AA 2 AAA 3 AAAA 4 AAAAA 5 대충 이런흐름으로 올라가는군요 sort()메서드를 통해 서순은 해결해줄 수 있긴한데 재귀적으로... 저 값들을 만들어보고싶습니다. 🔍접근방법 1. 재귀적으로 접근하여 모든 경우의 수를 담은 배열을 만든다. 2. sort 메서드를 이용해 정렬해준다. 3. 정렬된 배열에서 주어진 매개변수와 일치하는 인덱스를 찾는다. 4. 정답 😑나의 풀이라기보단 GPT의 풀이에 가까운 function solution(word) { let answer = [] let aeiou = ['A','E','I','O','U'] function maker(n,wor..

programmers

[Programmers Level 2] 피로도 Javascript

⚡문제정보 제 통곡의 벽인 완전탐색을 해야하는 문제입니다. k라는 내 초기 피로도가 주어지고 던전을 최대한 많이 돌아야하는 건데 이건 던파 많이해보신 분들은 아시겠지만 피로도를 극한까지 아꼈다가 최대한 소모피로도가 큰 던전을 가는게 제일 이득이죠 가장 많은 던전을 방문할 수 있는 경우의 수를 찾아야하는 문제인데 여기서 최소 필요 피로도라는 개념이 있어서 내 현재 피로도가 최소 필요 피로도보다 낮으면 던전에 방문할 수 없는 제한조건까지 걸려있습니다. 조건이 까다로우니 탐욕법같은건 적용하기 애매하겠고 그냥 맘편히 다 찾아보는게 제일 답을 찾기 좋겠네요 조건을 보면 던전의 최대 갯수도 8개뿐이니까 충분히 완전탐색을 돌릴만 해보입니다. 🔍접근방법 다 푼 사람의 블로그를 참고한다. https://leejams.g..

programmers

[Programmers Level 1] 덧칠하기 Javascript

⚡문제정보 대충 이런 문제인데 처음 생각한 로직으로 풀려다가 구현이 안되어서 오랜시간 막혔습니다. 처음 구상은 포인터를 하나 두고 arr[i] - pointer값이 m보다 크거나 같으면 answer를 올리는 식으로 구상했는데 그렇게 짜니 안되는 케이스가 생겼어요 결국 맨처음에 떠올릴 수 있던 무식하게 순회하기를 선택하고 풀었읍니다. 🔍접근방법 1. 정직하게 배열을 주어진 길이만큼 만들고 true로 가득채워준다. 2. section에 주어진 값과 매칭되는 인덱스에 false를 할당한다. 3. false를 만나면 m - 1값만큼 인덱스를 점프시키고 answer값을 올려준다. 😑나의 풀이 function solution(n, m, section) { let answer = 0 let arr = new Arra..

react

라이프사이클 메서드 폼 미쳤다.

🐕 라이프사이클은 1. 모든 리액트 컴포넌트는 라이프 사이클(수명주기)가 존재한다. 2. 컴포넌트의 수명은 페이지에 렌더링되기 전인 준비 과정에서 시작하여 페이지에서 사라질 때 끝남 그런데 우리가 리액트 프로젝트를 하다보면 1. 컴포넌트를 처음으로 렌더링 할 때 어떤 작업을 처리해야하거나 2. 컴포넌트를 업데이트한 전후로 어떤 작업을 처리하거나 3. 업데이트를 방지해야하거나 같은 상황을 마주할 수 있어요 바로 이럴 때 클래스형 컴포넌트에서는 라이프 사이클 메서드를 이용해 처리를 해줍니다. 함수형 컴포넌트에서는 못써요 대신에 비슷한 작업을 Hook으로 처리할 수 있습니다. 👻라이프 사이클 메서드 9가지 라이프 사이클 메서드는 총 아홉가지가 있습니다. will 접두사가 붙은 메서드들은 어떤 작업을 작동하기 ..

javascript

node.js 환경에서 fetch API를 사용하는 방법

위와 같이 현재 Node.js에서 fetch API는 실험적으로 제공되고 있는 상태입니다. 따라서 fetch API를 브라우저 환경이 아닌 node.js 환경에서 바로 동작시키고 확인하고 싶은 경우 가장 쉬운 해결책은 fetch API 모듈을 설치하는 것입니다. 그다지 어렵지 않으니 잘 따라오시면 쉽게 할 수 있을거에요 🐕 먼저 빈 폴더를 만든다. 기존에 이미 폴더가 있으신 분들은 상관없습니다. 다만 위 실습에서는 package.json의 설정을 조금 변경하기 때문에 기존에 모듈을 ES6 방식이 아닌 다른 방식으로 불러오면서 코드를 작업하고 계시던 분들은 기존 코드와 충돌이 발생할 수 있으니 유의해주세요 ES6 방식은 다음과 같습니다. export function sayHello(name) { conso..

react

커스텀 훅으로 맛있는 훅 만들기

🐕 커스텀훅 우리가 함수를 만드는 것처럼 훅을 커스텀해서 만들 수 있다. 함수 안에 이름을 지어주고 원하는 로직을 만들어주면 끝이다. 다만 커스텀 훅을 만들 때 주의할 점이 있는데 함수의 이름 시작을 use로 만들어줘야한다는 것이다. 네이밍이 어긋나게 되면 오류가 발생했을 때 리액트에서 적절한 경고메시지를 받을 수 없고 또 함수를 쓰는 당사자인 개발자가 코드를 읽기 어려워질 수 있기 때문이다. 👻간단하게 커스텀 훅을 작성하자 useInput.js import React, { useState } from 'react'; export function useInput(initialValue) { const [inputValue, setInputValue] = useState(initialValue); cons..

cheetsheet

length 프로퍼티 없이 이터레이터로 Each 구현하기

🐕 과제를 하다가... underbar라는 과제가 있는데 배열 내장 메서드 없이 배열 내장 메서드를 구현하는 내용이었습니다. 근데 전 length 프로퍼티도 사용하면 안되는 줄 알고 이걸 length 없이 어떻게 구현할까 고민하다가 결국 이터러블 프로토콜을 이용해서 직접 만들면되지않나? 라는 결론에 도달했어요 👻어케 함 다행히도 정적메서드는 사용해도 오류가 안 나길래 썼는데.. (생각해보면 정적메서드도 되는데 length를 막아놨다고 생각하는 거 자체가 이상하긴함) 그러면 맨 처음 생각나는 선택지는 while문을 만들어서 무한정으로 값을 올려주는 let idx = 0 while(arr[idx] !== undefined) { idx++ } 이런 선택지를 고려할 수 있을 것입니다. 하지만 이 방식에는 치명적..

react

useCallback을 케이크처럼 쉽게 먹는 방법

🐕 useCallback을 쓰는 시점 useMemo와 비슷하게도 메모이제이션을 기반으로 한 훅입니다. 캐싱해둔 값을 그대로 사용하는 건데... useCallback은 콜백함수 그 자체를 메모이제이션 해줍니다. useMemo가 return 값을 메모이제이션 해주는 것과는 살짝 대비가 되는 느낌 컴포넌트가 다시 렌더링 되더라도 함수가 초기화되는걸 막을 수 있다. 이후에 렌더링이 될 때는 이전에 이미 만들어둔 함수 객체를 계속 유지하면서 사용할 수 있다. 이걸 왜 써야할까요? 1. 함수 컴포넌트는 상태변화시 다시 렌더링된다. 2. 렌더링 될 때 함수 내부 변수는 초기화된다. 3. 따라서 렌더링 전 변수와 렌더링 후 변수는 메모리 주솟값이 다르다. 4. useEffect 등에서 사용하는 의존성 배열은 주솟값이 ..

냠냠맨
'분류 전체보기' 카테고리의 글 목록 (30 Page)