본문 바로가기

전체 글

[프로그래머스] 숫자 문자열과 영단어 (JavaScript)

알고리즘 2023. 6. 21. [프로그래머스] 숫자 문자열과 영단어 (JavaScript) 문제 설명 네오와 프로도가 숫자놀이를 하고 있습니다. 네오가 프로도에게 숫자를 건넬 때 일부 자릿수를 영단어로 바꾼 카드를 건네주면 프로도는 원래 숫자를 찾는 게임입니다. 다음은 숫자의 일부 자릿수를 영단어로 바꾸는 예시입니다. 1478 → "one4seveneight" 234567 → "23four5six7" 10203 → "1zerotwozero3" 이렇게 숫자의 일부 자릿수가 영단어로 바뀌어졌거나, 혹은 바뀌지 않고 그대로인 문자열 s가 매개변수로 주어집니다. s가 의미하는 원래 숫자를 return 하도록 solution 함수를 완성해주세요. https://school.programmers.co.kr/learn/courses/30/lessons/81301 프로그래머스 코드 중심의 개발자 채용. 스택..

[프로그래머스] 소수만들기 (JavaScript)

알고리즘 2023. 6. 21. [프로그래머스] 소수만들기 (JavaScript) 문제 설명 주어진 숫자 중 3개의 수를 더했을 때 소수가 되는 경우의 개수를 구하려고 합니다. 숫자들이 들어있는 배열 nums가 매개변수로 주어질 때, nums에 있는 숫자들 중 서로 다른 3개를 골라 더했을 때 소수가 되는 경우의 개수를 return 하도록 solution 함수를 완성해주세요. 제한사항 nums에 들어있는 숫자의 개수는 3개 이상 50개 이하입니다 nums의 각 원소는 1 이상 1,000 이하의 자연수이며, 중복된 숫자가 들어있지 않습니다. https://school.programmers.co.kr/learn/courses/30/lessons/12977 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘..

자바스크립트의 클로저 동작 방식 (렉시컬환경과 렉시컬 스코프)

Computer Programming/CS 2023. 6. 21. 자바스크립트의 클로저 동작 방식 (렉시컬환경과 렉시컬 스코프) 1. 렉시컬 환경 어떤 함수 A에서 선언한 변수 a를 참조하는 내부 함수 B를 외부로 전달할 경우, A의 실행 컨텍스트가 종료된 이후에도 변수 a가 사라지지 않는 현상을 클로저라고 합니다. 클로저는 LE와 연관이 있기 때문에 이를 먼저 간단하게 설명하겠습니다. LE는 Lexical Environment로, 실행할 스코프 범위 안에 있는 변수와 함수를 프로퍼티로 저장하는 객체입니다. 두 가지 구조로 나누어져 있으며 하나는 자신의 지역 변수를 프로퍼티로 저장하고 있는 객체인 '환경레코드(Record)' 이고 하나는 상위의 렉시컬 환경인 외부 렉시컬환경(Outer) 입니다. 'LE' = { Environment Record: { 변수객체: [Object], scopeChain: [Object], }, Oute..

[리액트를 다루는 기술] 13. 리액트 라우터 (URL /:, 쿼리스트링, 라우트 중첩, useNavigate, Navigate)

Computer Programming/[리액트를 다루는 기술] 2023. 6. 20. [리액트를 다루는 기술] 13. 리액트 라우터 (URL /:, 쿼리스트링, 라우트 중첩, useNavigate, Navigate) 기존에 띄웠던 웹 애플리케이션을 그대로 유지하면서 라우팅 설정에 따라 또 다른 페이지를 보여주는 SPA를 react router dom을 사용하여 구현해봤다. 1. 기본 사용법 index.js에 react router dom에 내장되어있는 BrowserRouter로 감싸야한다. 이 컴포넌트는 브라우저의 history API를 사용해 html을 새로 불러오지 않고도 주소를 변경하고, 현재 주소의 경로에 저장된 정보를 컴포넌트에서 사용할 수 있게 해준주는 역할을 한다. const root = ReactDOM.createRoot(document.getElementById('root')); root.render( ); 2. URL 파라미터와 쿼리스트링 - URL 파라미터: /profile/nayoung3669 ..

React immer 라이브러리로 불변성 유지하기

Computer Programming/[리액트를 다루는 기술] 2023. 6. 20. React immer 라이브러리로 불변성 유지하기 객체의 구조가 깊어지면 자바스크립트 배열 내장 함수만으로 구현할 수는 있지만 복잡해질 것이다. 가독성을 높이기 위해 immer 이라는 라이브러리를 사용하면 구조가 복잡한 객체도 쉽고 짧은 코드로 불변성을 유지하면서 데이터를 업데이트할 수 있다. => 불변성에 신경쓰지 않는 것 처럼 하지만 실제로는 불변성관리를 해주는 라이브러리. yarn add immer 아래의 코드를 immer을 사용해서 바꿔보자 import { useCallback, useRef, useState } from 'react'; import './App.css'; function App() { const nextId = useRef(1) const [form, setForm] = useState({ name: '', username: '..

react-virtualized를 사용한 렌더링 최적화

Computer Programming/[리액트를 다루는 기술] 2023. 6. 20. react-virtualized를 사용한 렌더링 최적화 올해 초 캐나다에서 코딩 공부한지 정말 얼마 안 됬을 때.... 백엔드 친구와 주식 관련 앱을 만들어보려고 했던 적이 있는데 주식 데이터가 실시간으로 너무 많다보니 렌더링이 느리고 성능도 매우 좋지 않았고 최적화를 잘 못하던 시절이라.. 그 시절 내 자신이 정말정말 답답했었다... 😅 아무튼 그때 너무 구현해보고 싶었는데 못 했던 부분이 주식 데이터를 보여줄 때 일단 유저에게 짠 하고 처음 보여지는 부분만 먼저 렌더링하고, 유저가 스크롤하거나 zoom하면 그때 필요한 정보를 가져와서 렌더링하는 기능이었다. 비슷한 로직의 라이브러리를 보니 감회가 새롭다 🤩 이번에는 스크롤 하면서 렌더링 되게 만들어 줄 예정이다 리스트 아이템의 크기를 먼저 재야하는데, 이 때는 두번째 요소부터 해야 테두리가 합쳐진 크기가 ..

[프로그래머스] 콜라츠 추측 (JavaScript)

알고리즘 2023. 6. 20. [프로그래머스] 콜라츠 추측 (JavaScript) 문제 설명 1937년 Collatz란 사람에 의해 제기된 이 추측은, 주어진 수가 1이 될 때까지 다음 작업을 반복하면, 모든 수를 1로 만들 수 있다는 추측입니다. 작업은 다음과 같습니다. 1-1. 입력된 수가 짝수라면 2로 나눕니다. 1-2. 입력된 수가 홀수라면 3을 곱하고 1을 더합니다. 2. 결과로 나온 수에 같은 작업을 1이 될 때까지 반복합니다. 예를 들어, 주어진 수가 6이라면 6 → 3 → 10 → 5 → 16 → 8 → 4 → 2 → 1 이 되어 총 8번 만에 1이 됩니다. 위 작업을 몇 번이나 반복해야 하는지 반환하는 함수, solution을 완성해 주세요. 단, 주어진 수가 1인 경우에는 0을, 작업을 500번 반복할 때까지 1이 되지 않는다면 –1을 반환해 주세요. 제한 사항 입력..

[프로그래머스] 하샤드 수 (JavaScript)

알고리즘 2023. 6. 20. [프로그래머스] 하샤드 수 (JavaScript) 문제 설명 양의 정수 x가 하샤드 수이려면 x의 자릿수의 합으로 x가 나누어져야 합니다. 예를 들어 18의 자릿수 합은 1+8=9이고, 18은 9로 나누어 떨어지므로 18은 하샤드 수입니다. 자연수 x를 입력받아 x가 하샤드 수인지 아닌지 검사하는 함수, solution을 완성해주세요. https://school.programmers.co.kr/learn/courses/30/lessons/12947 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 내 코드: function solution(x) { let arr = String(x).split('').map..

[프로그래머스] lv1. 문자열 내림차순으로 배치하기 (JavaScript)

알고리즘 2023. 6. 20. [프로그래머스] lv1. 문자열 내림차순으로 배치하기 (JavaScript) 문제 설명 문자열 s에 나타나는 문자를 큰것부터 작은 순으로 정렬해 새로운 문자열을 리턴하는 함수, solution을 완성해주세요. s는 영문 대소문자로만 구성되어 있으며, 대문자는 소문자보다 작은 것으로 간주합니다. https://school.programmers.co.kr/learn/courses/30/lessons/12917 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 내 풀이: function solution(s) { return s.split('').sort((a,b) => { if (a > b) return 1 if (a < b) return..

이전 1 ··· 4 5 6 7 8 9 10 ··· 13 다음

Archives

Recent Posts

Tags

더보기

Calendar

티스토리툴바