JS 디자인패턴 (2) - Structural Design Pattern
개요/방향성 등의 서론직전 게시글 참고
Adapter(어댑터) / Wrapper(래퍼) Pattern서비스 개발을 한다면 인터페이스 활용은 거의 필수이다.인터페이스의 버전이 올라가거나, 인터페이스가 레거시에서 차세대로 눈에 띄게 바뀌는 경우인터페이스의 규격도 바뀌기 마련이다.
개인 개발, 소규모 개발에 있어서는 클라이언트의 코드를 바꿔주면 되겠지만큰 규모의 프로젝트라면 클라이언트 코드를 바꿔버리기에는 위험성이 있다.또 신규 인터페이스가 문제가 생긴다면 언제든 롤백을 할 준비도 돼있어야 한다.
실무에서 경험을 바탕으로 생각해본다면A인터페이스를 사용하기 위해 공통 유틸에 a_using이라는 메서드를 두었다.만약 업그레이드 버전인 B인터페이스로 변경해야 하는 상황이 생겼다면b_using메서드를 새로 만드는 것이 아니라a_using메서드 안에 연동방식 환경변수(레거시/차세대)를 두고B인터페이스를 필요에 따라 사용할 수 있도록 한다.
12345678910111213 ...
JS 디자인패턴 (1) - Creational Design Pattern
개요학부 시절 만들고자 하는 서비스는 많았는데 나의 서비스 개발 기술은 없는 수준이었다.언어 기본기 공부, 프레임워크 공부를 최우선으로 생각해서, 솔직히 디자인패턴은 눈에 잘 안 들어왔다.
개발자로 2년을 근무하다 오랜만에 디자인패턴 글을 읽어보니 상당히 익숙해서 놀라웠다.현업에서 자주 보았던 패턴이었으며, 나 역시도 무의식적으로 비슷하게 사용한 경우가 많았다.
방향성
프론트엔드 개발에서 자주 사용하는 JS + 취미에 있어 관심있는 메이플스토리의 조합으로 글을 새로 쓸 계획
외국 개발자의 저널을 https://dev.to/twinfred/design-patterns-in-javascript-1l2l 참고
내가 생각하는 디자인패턴이란워낙에 추상적인 개념이다보니, 정답을 단정짓기는 그렇고 내 생각만 적어보자면,디자인패턴의 주 목적은 결국 효율성을 최대화하기 위함이다. (의사소통, 개발 속도, 프로덕트 퀄리티, 유지보수 용이성)
ex) 변수 이름에도 camelCase, PascalCa ...
카카오 blind 2018 비밀지도
문제 링크
문제 풀이각 언어 별 숫자-문자열 변환 방식을 알고 있어야한다.진수 변환까지 알고 있으면 좋다.
전체 코드12345678910111213141516171819202122232425function solution(n, arr1, arr2) { const numToString = (num) => { let a1 = num.toString(2); while (a1.length < n) { a1 = "0" + a1; } return a1; }; arr1 = arr1.map(numToString); arr2 = arr2.map(numToString); const answer = []; for (let a = 0; a < n; a++) { const temp = []; for (let b = 0; b < n; b++) { ...
카카오 blind 2018 셔틀버스
문제 링크
문제 풀이배열과 루프를 활용한 구현 문제이다.
단, 주의할 점이 있다.
보통 이런 류의 문제는 버스를 기다리는 사원들(timetable)이 전부 다 탈 수 있도록 설계해서 내지만 이 문제는 그렇지 않았다.즉 timetable 안에서 버스를 못타는 사람이 충분히 생길 수 있다.
이것을 해결하기 위해 timetable을 sort하고 n*m으로 slice하고 푼다고 해도,아래와 같은 경우라면 버스를 못타는 사람이 또 생길 수 있다.
2인승 버스 3대가 준비되어있고, 9시 이전에 1명만 대기한다.
사람이 10명 대기하고 있어서 앞에서 6명을 잘랐다.
첫 버스에 1명만 탈 수 있다. 두 번째 버스에는 2명이 탄다. 마지막 버스 차례에 3명이 대기중인데 2인승이므로 1명은 낙오된다.
그래서 이 문제는 if로 분기를 잘 나누어야 한다.
전체 코드123456789101112131415161718192021222324252627282930313233343536373839const to ...
카카오 blind 2018 뉴스 클러스터링
문제 링크
문제 풀이배열과 문자열을 활용한 구현 문제이다.
전체 코드123456789101112131415161718192021222324252627282930313233343536373839const words = "ABCDEFGHIJKLMNOPQRSTUVWXYZ".split("");function solution(str1, str2) { str1 = str1.toUpperCase().split(""); str2 = str2.toUpperCase().split(""); const arr1 = []; const arr2 = []; for (let i = 0; i < str1.length - 1; i++) { if (!words.includes(str1[i]) || !words.includes(str1[i + 1])) continue; arr1.push(str1[i] + ...
카카오 blind 2018 추석 트래픽
문제 링크
문제 풀이
트래픽 시작 시간 순으로 오름차순 정렬한다
트래픽이 빠질 때는 고려하지 않는다. 최댓값을 구하는 것이므로 1이라도 더 큰 순간(트래픽이 들어오는 시점)을 기준으로 잡는다.
전체 코드1234567891011121314151617181920212223242526272829function toSecond(times) { const [hour, minute, second] = times.split(":"); return hour * 3600000 + minute * 60000 + second * 1000;}function solution(lines) { lines = lines.map((v) => { const temp = v.split(" "); const end = toSecond(temp[1]); const start = end - temp[2].slice(0, - ...
카카오 blind 2019 징검다리 건너기
문제 링크
문제 풀이완전 탐색으로 풀면 시간초과가 발생한다.최악의 경우stones의 최대 length(200,000) x stones 원소의 최댓값(200,000,000)만큼의 탐색이 필요하기 때문에..
이 때 stones의 최대 length는 건너뛰지 못해도stones의 각 값에는 이분탐색을 적용할 수 있다.
내 차례가 다가왔다. (앞에 n명이 건넜다)내가 마주보든 stones는 초기 stones의 모든 값에 n을 뺀것과 같다.stones에는 0 이하의 수, 0 초과의 수가 존재할 것이다.0이하의 수가 연속되는 길이가 k를 넘지 않으면나도 건널 수 있다.
이 n은 앞서 말한 stones 원소의 최댓값(200,000,000)까지 가능하므로이분탐색을 도입!
전체 코드123456789101112131415161718192021function solution(stones, k) { let left = 0; let right = 200000000; while (1) { ...
카카오 blind 2019 튜플
문제 링크
문제 풀이
input : string => array => sort
answer : set => array
전체 코드123456789101112131415161718192021function solution(s) { const sets = s .split("}") .reduce((a, b) => { b = b.replace("{{", "").replace(",{", ""); if (b.length > 0) a.push(b.split(",")); return a; }, []) .sort((a, b) => a.length - b.length); let answer = new Set([]); whi ...
정규표현식
기본 사용법1234567const name = "My name is Kim";const pattern = /Kim/;pattern.test(name); // truepattern.exec(name); // ["Kim"]name.match(pattern); // ["Kim"]
반복?1개 or 0개
123456const name = "Kim YongHoon Kim";const name2 = "Kim YongHoon";const pattern = /Kim?/;pattern.test(name); // truepattern.test(name2); // true
+1개 이상
12345const text = "catz";const text2 = "catcatz";const pattern = /cat+w/;pattern.test(text); // truepattern.t ...
개발 - Markdown
표준 문법Headings123456# h1 Heading## h2 Heading### h3 Heading#### h4 Heading##### h5 Heading###### h6 Heading
h1 Headingh2 Headingh3 Headingh4 Headingh5 Headingh6 HeadingParagraphs그냥 평범하게 쓰면 문단으로써 들어감
1Lorem ipsum dolor sit amet, graecis denique ei vel, at duo primis mandamus. Et legere ocurreret pri, animal tacimates complectitur ad cum. Cu eum inermis inimicus efficiendi. Labore officiis his ex, soluta officiis concludaturque ei qui, vide sensibus vim ad.
Lorem ipsum dolor sit amet, graecis den ...
