기록저장소

프로토타입한번 만들어진 프로토타입을 복제해서 사용할 수 있도록 const a = new A(1,2,3,4,5);const a2 = new A(1,20,3,40,5);//조금다르고 거의 비슷한 경우//일부만 수정const a3 = a.clone();a3.two = 20;a3.four = 40;//포로토타입const veryHeavy = {very:'heavy'};const a = new A(veryHeavy);const a2 = a.clone();//외부에 별도로 두지 않음const a = new A({very:'heavy'});const a2 = a.clone();주의 ) 깊은복사를 잘 못 복사해서 원복객체도 수정되는 오류 주의, 부모의 private 값은 복사 x

빌더복잡한 객체의 생성과정을 단계별로 제어하고 캡슐화하여 다양한 구성의 객체 생성,많은 선택적 매개변수를 가진 객체 생성시 코드 가독성과 유지보수성 향상interface Btn { //버튼 필요요소 name: string; type: string; onClick: () => void;}interface Input{ //input 필요요소 name: string; type: string; onChange: () => void; value: string|number;}//확정된 필요요소가 아니라서 유연하게 만들고자 함↓class GrimpanMenuBtn{ private name: string; private type: string; private onClick?: () => void; pri..

추상 팩토리 : 여러 객체가 묶인 세트의 생성에 대한 패턴, 추가되어도 기존것들을 수정하지 않음//메뉴 세트//기본 메뉴를 override해서 해당 브라우저 메뉴 생성//기존 코드를 수정하지 않음! : OCP 지킴//GrimpanMenu.tsimport Grimpan from "./AbstractGrimpan.js";import IEGrimpan from "./IEGrimpan.js";import ChromeGrimpan from "./ChromeGrimpan.js";export abstract class GrimpanMenu { grimpan: Grimpan; protected constructor(grimpan: Grimpan) { this.grimpan = grimpan; } abstr..

팩토리 메서드 : 클래스와 클라이언트 사이에 팩토리라는 중간자를 두고 독립된 요소로 분리//AbstractGrimpanFactory.tsimport Grimpan from './AbstractGrimpan';abstract class AbstractGrimpanFactory { abstract createGrimpan(): Grimpan; //추상그림판을 가져와야함 (IEGrimpan x, ChromeGrimpan x) //createGrimpan을 무조건 상속해서 override해야함 };}export default AbstractGrimpanFactory;* Abstract : 일반 class가 abstract class를 상속받을 수 있음, abstract가 아닌 요소도 수용해서 abstrac..

싱글턴 (Singleton)단 하나만 존재해야 할 때, 하나의 클래스가 단 하나의 인스턴스만 생성되도록  보장ex) 다크모드 문제 예시//class와 instance가 분리되어 있어서 상태관리가 어려움let instance: Grimpan;class Grimpan { constructor(canvas: HTMLElement | null){ if (!canvas || !(canvas instanceof HTMLElement)){ throw new Error('canvas 엘리먼트를 입력하세요.'); } } initialize(){} initializeMenu(){}}new Grimpan(document.querySelector('#canva..

SOLID 원칙소프트웨어 작업에서 코드를 리팩터링하여 읽기 쉽고 확장하기 쉽게 적용하는 지침 두문자약어개념SSRP단일 책임 원칙 (Single responsibility principle) : 한 클래스는 하나의 책임만 가진다.OOCP개방/폐쇄 원칙 (Open/closed principle): 소프트웨어 요소는 확장에는 열려있으나 변경에는 닫혀있어야 한다.LLSP리스코프 치환 원칙 (Liskov substitution principle): 프로그램의 객체는 프로그램의 정확성을 깨지않으면서 하위 타입의 인스턴스로 바꿀 수 있어야 한다.IISP인터페이스 분리 원칙 (Interface segregation principle): 특정 클라이언트를 위한 인터페이스 여러개가 범용 인스턴스 하나보다 낫다.DDIP의존..

디자인 패턴소프트웨어 개발에서 반복적으로 발생하는 문제해결을 위해 제안된 재사용 가능한 설계 방법이나 해결 방법 사용이유?코드 재사용성: 검증된 해결책을 적용하여 개발 속도 향상코드 가독성 및 유지보수성: 명확한 구조와 의도, 협업과 유지보수 용이일관성: 동일한 패턴 이해로 코드 품질 향상 종류?1. 생성 패턴 (Creational Pattern) : 객체 생성 방법과 과정을 캡슐화하여 유연하고 재사용 가능하게 만드는 패턴- 싱글턴 패턴 (Singleton) : 한 클래스에 하나의 인스턴트만 존재하도록 보장- 심플 팩토리 패턴 (Simple Factory Pattern) : 객체 생성 로직 캡슐화로 특정 클래스 인스턴스 반환- 팩토리 메서드 패턴 (Factory Method) : 객체 생성을 서브클래스에..

Q. 나이로 태어난 년도 구하기function solution(age){ let now = new Date(); let year = now.getFullYear(); let answer = year - age - 1; //+1???????? return answer;}* getFullYear() : 주어진 날짜의 현지 시간 기준 연도 반환 Q. 정수 배열 array가 매개변수로 주어질 때, 최빈값 return function solution(array){ let answer = 0; let fre={}; let max = 0; array.forEach((item) => { fre[item] = (fre[item] || 0) + 1; //빈도수 체크 if..

41.1 호출 스케줄링 일정시간이 경과된 후에 함수가 호출되도록 예약하는 방식 타이머 함수 : ECMAScript에 정의된 빌트인 함수가 아닌 호스트 객체(브라우저환경, Node.js 환경에서 전역 객체의 메서드로 제공) 타이머 생성 : setTimeout, setInterval -> 타이머 만료시 콜백 함수 호출, 비동기 처리방식 타이머 제거 : clearTimeout, clearInterval 41.2 타이머 함수 setTimeout / clearTimeout 두번째 인수인 시간타이머가 만료되면 첫번째 인수인 콜백함수가 호출됨, setTimeout 함수가 생성한 고유타이머 id를 clearTimeout 함수의 인수로 전달하여 타이머 취소 const timeoutId = setTimeout(func|c..

[ 두 수의 나눗셈 ]Q. 정수 num1과 num2가 매개변수로 주어질 때, num1을 num2로 나눈 값에 1,000을 곱한 후 정수 부분을 return 하도록 soltuion 함수를 완성해주세요.function solution(num1, num2) { var answer = parseInt((num1/num2)*1000); return answer;} * 다른 풀이const solution = (num1, num2) => Math.floor(num1 / num2 * 1000);function solution(num1, num2) { return Math.trunc(num1 / num2 * 1000);} * Math.floor : 소수점이하 버림하여 정수 반환* Math.ceil : 소..