전체 글

[프로그래머스] x만큼 간격이 있는 n개의 숫자

문제 설명 함수 solution은 정수 x와 자연수 n을 입력 받아, x부터 시작해 x씩 증가하는 숫자를 n개 지니는 리스트를 리턴해야 합니다. 다음 제한 조건을 보고, 조건을 만족하는 함수, solution을 완성하세요 제한 조건 x는 -10000000 이상, 10000000 이하인 정수 n은 1000이하인 자연수 입출력 예 x n answer 2 5 [2,4,6,8,10] 4 3 [4,8,12] -4 2 [-4,-8] 멘토님 풀이법 function solution(x, n) { const answer = []; // 반복문 실행 // i인덱스에서 계속해서 더해서 return // i가 n보다 작거나 같을 떄까지 반복문 실행하면 n을 포함한 숫자 for (let i = 1; i { // undefine..

[프로그래머스] 자릿수 더하기

문제 자연수 N이 주어지면, N의 각 자릿수의 합을 구해 return 하는 solution 함수를 만들어 주세요. 예를들어 N = 123이면 1 + 2 + 3 = 6을 return 하면 됩니다. 제한 사항 N의 범위: 100,000,000 이하의 자연수 입출력 예 N answer 123 6 987 24 입출력 예 설명 입출력 예 #1 문제는 예시와 같습니다. 입출력 예 #2 9 + 8 + 7 = 24 이므로 24를 return하면 됩니다. 1.문제 이해하기 입력으로 들어올 숫자의 각 자리 수를 합한 값을 변환해주면 된다. n의 값이 123 이면 1 + 2 + 3 = 6을 retun 하면 된다. 2.해결 방법 입력으로 들어온 숫자를 문자로 변환해 다음 배열로 만들어 reduce를 이용해 각 자리 숫자를 더..

[TIL] 01월 20일 Typescript 적응기

이번 오전 교육에서는 Typescript의 기초에 대해 배웠다. 자세한 목차 이걸 쓰면 더 안전하다고? => Typescript 기존의 Javascript를 typescript로 바꾸자 Typescript는 기존의 Javascript에서 한단계 UP된 언어이다. 타입 스크립트란? 자바스크립트의 타입을 강제시키는 언어이다. let aaa = "안녕하세요" aaa = 123; 예를 들어 aaa라는 상자에 문자열을 넣다가 다시 숫자 타입으로 넣을 수 있는 방식이 기존의 자바스크립트의 방식이었다. let aaa:string = "안녕하세요" aaa = 123 // 문자만 들어가는 string type이라 숫자는 불가능 typescript에서는 문자열로 선언을 string값으로 넣어주면 숫자는 들어갈 수 없다. ..

[JS] JS와 TS의 차이점

Javascript vs Typescript TypeScript는 Javascript의 기반의 언어 Javascript는 클라이언트 측 스크립트 언어 Typescript는 객체 지향 컴파일 언어 객체 지향 프로그래밍 패러다임은 데이터 추상화에 중심 - 객체와 클래스라는 두 주요 개념을 기반으로 한다. Javascript 웹 개발에 주로 사용되는 언어 웹 페이지를 대화식으로 만드는 프로그래밍 언어 폼 유효성 검사, 애니메이션 적용 및 이벤트 생성을 수행하는 역할 클라이언트 측 스크립트 언어 - 사용자가 웹 브라우저를 열고 웹페이지를 요청할 시 해당 요청이 웹 서버로 이동한다. 멀티 스레딩, 멀티 프로세싱 기능이 없음 Typescript Javascript의 상위 집합으로 Javascript의 모든 기능이 ..

[프로그래머스] 약수의 합

문제 정수 n을 입력받아 n의 약수 모두 더한 값을 리턴하는 함수, solution을 완성해주세요 제한 사항 n은 0 이상 3000이하인 정수입니다. 입출력 예 입출력 예 #1 12의 약수는 1, 2 ,3 ,4 ,6, 12입니다. 이를 모두 더하면 28입니다. 입출력 예 #2 5의 약수는 1,5입니다. 이를 모두 더하면 6입니다. function solution(num) { const arr = []; // 먼저 i값의 반복문을 돌려준다. for (let i = 0; i < num; i++) { // input을 나눌때 나머지가 0인 정수를 모조리 찾아주고 // 모든 숫자를 배열에 넣어 누적 합사후 합계를 반환한다. // 하지만 0 부터 input 까지 숫자를 1씩 더해가며 계산해야하므로 시간 복잡도가 ..

[TIL] 2022월 01월 19일

이번 시간에는 게시판을 수정하는 수정페이지를 구현하는 방법을 배웠다. import React from 'react'; import BoardWrite from '../../../../src/components/units/board/08-write/BoardWrite.container'; export default function BoardsEditPage() { return } 먼저 BoardWrite 컴포넌트에 props 마다 기본 List페이지에서는 수동 버튼이 보이고 삭제페이지에서는 삭제페이지 가 보일 수있도먼 처음 페이지에는 isEdit라는 수정페이지에 props 값을 잡아준다. import axios from 'axios'; import { useState } from 'react'; impor..

[프로그래머스 코딩테스트] 문자열 다루기 기본

[프로그래머스] 문자열 다루기 기본 문제 설명 문자열 s의 길이가 4 혹은 6이고, 숫자로만 구성돼있는지 확인 해주는 함수, solution을 완성하세요, 예를 들어 s가 "a1234" 이면 False를 리턴하고 1234라면 True를 리턴하면 됩니다. 제한 사항 s의 길이는 1이상, 길이 8 이하인 문자열입니다. 입출력 예 s return "a234" false "1234" true 정규표현식을 이용한 풀이법 function solution(s) { return (s.length === 4 || s.length === 6) && /^[0-9]+$/.test(s); } test() 메서드는 주어진 문자열이 정규 표현식에 만족하는지 판별하고, 그 여부를 true 또는 false로 반환한다. 1. ^ : 시..

[프로그래머스 코딩테스트] 서울에서 김서방 찾기

문제설명 String형 배열 seoul의 element중 "Kim"의 위치 x를 찾아, "김서방은 x에 있다" 는 String을 반환하는 함수 solution을 완성해주세요, seoul에 "Kim"은 오직 한번만 나타나며 잘못된 값이 입력되는 경우는 없습니다. 제한사항 seoul은 길이 1이상, 1000 이하인 배열입니다. seoul의 원소는 길이 1 이상, 20 이하인 문자열 입니다. "Kim"은 반드시 seoul 안에 포함되어 있습니다 입출력 예 seoul return ["Jane", "Kim"] "김서방은 1에 있다" for 문을 이용한 Javascript 풀이법 function solution(seoul) { let answer = ''; // for문을 이용한 방법 for (let i = 0; ..

[TS] 제네릭 (Generic)

제네릭이란 무엇인가? 제네릭 타입은 타입에 유연성을 제공하여 컴포넌트 등에서 재사용을 가능케 해주는 타입이다. 타입의 유연성이란 :string :number 등과 같이 고정된 타입이 아닌 사용에 따라 여러 타입을 사용하게 해준다는 것 이는 any 타입과 매우 흡사하지만 차이점이 있다. 제네릭은 타입 정보가 동적으로 결정되는 타입이다. 제네릭 타입은 다양한 타입을 받을 수 있다는 유연성이란 점에서 any 타입과 흡사하지만 타입의 정보가 동적으로 결정된다는 차이가 있다. any 타입과 제너릭 any 타입 사용 코드 다음 any type을 사용한 코드이다. // identityy의 인자 타입은 any // 이 함수에 반환되는 타입과 any function identity(arg: any): any { retu..

[React] Atomic 패턴에 대하여

아토믹 패턴 디자인은 시스템을 만드는 하나의 방법론으로 총 5가지의 구분 단계가 있다. Atoms(원자) Molecules(분자) Organisms(유기체) Templates Pages 뷰를 Atoms(원자) -> Molecules(분자) -> Organisms(유기체) -> Templates -> Pages 순으로 작은것들을 만들고, 결합해 좀 더 큰 단위의 뷰를 만들어 나가는 디자인 시스템이다. 웹앱은 여러 페이지 단위 이루이지고 페이지는 Input, button, form 등의 태그들로 이루어져 있다. 이를 원자, 분자, 유기체같은 생물학적인 개념으로 접근한 것이다. 장점 1. 재사용 가능한 설계 시스템을 제공합니다. 컴포넌트들을 혼합해 일관성 있고 재사용의 효율을 높이는 디자인을 할 수 있다. 2..

[TIL] 2022년 01월 18일

이번시간에 배운 내용은 React 7강 반복문을 대체할 여러가지 문법에 대해 배웠다. React 7강 나이제 for문 안써 => map함수/filter함수 최신 데이터를 가져와줘!! => refetch 목록에서 삭제가 안되는데... => key/index map vs filter map const classmates = ["철수", "영희", "훈이"] classmates.map((el) => (el + "어린이")) map함수를 사용해 classmates라는 값에 배열형태에 값이 선언되었을때는 map함수를 사용해 element를 사용해 index 뒷부분에 문자을 삽입할 수 있는 map 함수이다. const classmates = [ { name: "철수" }, { name: "영희" }, { name:..

[React] Component와 props, state

🚀 Component, props, state Component 컴포넌트를 통해 UI를 재새용 가능한 개별적인 여러 조각으로 나눈다. 컴포넌트는 개념적으로 Javascript의 함수와 유사한 방식이다. 'props' 라는 입력을 받은후, 화면에 어떻게 표시되는지를 기술하는 React 엘리먼트를 반환한다. 엘리먼트는 일반 객체(plain object)로 React 앱의 가장 작은 단위이다. 엘리먼트는 컴포넌트의 '구성요소' 이다. 컴포넌트를 선언하는 방식에는 함수형 컴포넌트 와 클래스형 컴포넌트가 있다. Class Component class HelloWorld extends React.Component { render() { return Hello!; } } 클래스형 컴포넌트는 React.Componen..