분류 전체보기34 퍼사드 패턴(Facade Pattern) headfirst 디자인 패턴책을 공부하고 정리한 것 입니다. 개요 당연하게도 이 패턴을 왜 사용하는지에 대해 아는 것이 정말 중요하다고 볼 수 있습니다. 퍼사드 패턴 정의는 다음과 같습니다. 퍼사드 패턴은 서브시스템들의 통합된 인터페이스를 제공한다. 간단하게 말해서 퍼사드 패턴은 단순화된 인터페이스를 통해 서브시스템을 더 쉽게 사용할 수 있도록 하기 위한 용도입니다. 말로만 떠들어서는 역시 뭔지 알 수 없습니다. 코드를 봅시다. 등운동을 하는 코드를 작성해 보겠습니다. 운동 순서는 다음과 같습니다. 1. 스트레칭을 몇분동안 한다. 2. 풀업을 한다. 3. 시티드 로우를 한다. 4. 유산소 달리기를 한다. 다음과 같이 작성할 수 있습니다. this.stretching.stretch(10);// 스트레칭 .. 2022. 2. 4. visual studio Window SDK 설치문제 error MSB8036: Windows SDK 버전 10.0.17134.0을(를) 찾을 수 없습니다. 필요한 버전의 Windows SDK를 설치하거나, 솔루션을 마우스 오른쪽 단추로 클릭하고 [솔루션 대상 변경]을 선택하거나 프로젝트 속성 페이지에서 SDK 버전을 변경하세요. 하루에도 삽질 최소 다섯번은 하는 것 같은데 삽질의 기록 카테고리에는 글이 잘 안올라온다... 쓰기 귀찮다 ^^ 삽질좀 하다 알고리즘 푸려고 VS를 켰는데 다음과 같은 오류를 뱉는다. 문제는 하드 정리중 쓸데없이 2gb 차지하고 있다고 생각한(?) 무지함에 window sdk를 삭제한것이 원인... 해결방법 https://developer.microsoft.com/ko-kr/windows/downloads/windows-sdk/ .. 2022. 2. 3. 화살표함수는 왜 사용하는걸까? 이 포스트는 모던자바스크립트를 공부하고 정리한 것입니다. 화살표함수는 멋있다. const add = (a,b) => a + b; 근데 이거 function 놔두고 왜 사용하는 걸까? 화살표 함수는 콜백함수 내부 this가 전역객체를 바인딩하는 문제를 해결하기 위해 사용한다. 화살표 함수와 일반 함수의 큰 차이는 화살표 함수는 this, arguments, super, new.target의 바인딩을 갖지 않는다. 가장 큰 차이점은 this다. this는 일반함수와 화살표 함수에서 다르게 동작한다. JS에서 this는 타언어와 다르다. this 바인딩은 함수가 어떻게 호출되었는지에 따라 동적으로 결정된다. 함수를 정의할 때 this에 바인딩할 객체가 정적으로 결정되지 않는다. class Prefixer { .. 2021. 12. 22. 함수 선언식 vs 함수 표현식 둘의 차이는 정확히 뭘까???? console.log(add(2,3)); console.log(sub(12,3)); // Variable 'sub' is used before being assigned function add(a:number, b:number){ return a + b; } const sub = function(a:number, b:number){ return a - b; } 함수 선언문은 선언이전에 호출할 수 있고 표현식은 이전에 호출할 수 없다. 이러한 이유는 선언문과 표현식이 함수의 생성시점이 다르기 때문이다. 선언문 선언문은 자바스크립트가 실행되고 있는 시점인 런타임 이전에 자바스크립트 엔진에 의해 먼저 실행된다. 즉 이말은 함수 선언문은 런타임 이전 함수 객체가 먼저 생성이 된다.. 2021. 12. 20. css, html 줄바꿈 문제 no-wrap, word-break 띄어쓰기 없는 단어 줄바꿈 삽질의 기록... import React, { useState, useEffect } from "react"; import styled from "styled-components"; const CreatePostWrapper = styled.div` position: absolute; width: 84%; max-width: 824px; left: 50%; transform: translateX(-50%); margin: 2rem 0; background-color: white; border-radius: 7px; padding: 2rem; border: 2px solid red; `; const App = () => { return ( GOODandelayWebsintsnip.. 2021. 12. 13. Type vs Interface Type 과 Interface의 차이점은 무엇일까? 써드파티 라이브러리 코드를 보면 가끔 Type 별칭을 쓰는 부분이 있는데 필자는 Interface만 선호(?)해서 둘의 차이점이 무엇인지 알고 싶어졌다. 공식 핸드북에 홈페이지다. https://www.typescriptlang.org/docs/handbook/2/everyday-types.html#differences-between-type-aliases-and-interfaces Documentation - Everyday Types The language primitives. www.typescriptlang.org 일단 요약하자면 타입별칭과 인터페이스는 매우 유사하며, 중요한 차이점은 타입은 새로운 속성을 추가할 수 없다는 것 인터페이스는 항상 .. 2021. 12. 5. React에서 setInterval 작성하기 리액트 에서 setInterval을 작성해 봅시다. 오래전에 구현하느라 애먹었는데 이제야 글을 쓰게 되는군요.... 간단하게 코드를 보자면 import { useState } from "react"; import "./styles.css"; export default function App() { const[cnt, setCnt] = useState(0); const run = () => { setInterval(() => { setCnt(prev => prev + 1); }, 1000); } return ( {cnt} run ); } 버튼을 클릭할 시 count를 1씩 1초마다 증가시킵니다. 잘 작동됩니다. 하지만... 버튼을 계속 클릭하게 되면 숫자 카운트는 빠르게 증가합니다. 대체 왜 그럴까요? r.. 2021. 11. 22. abstract 와 interface 차이점 abstract 와 interface는 언뜻보면 비슷해보인다. 그러나 둘은 명확한 차이가 있기에 차이점을 알아보자. abstract class 추상클래스는 일종의 미완성 설계도이다. 상속을 통하여 인스턴스를 생성할 수 있으며 추상클래스 자체로 인스턴스를 생성할 수 없다. 추상클래스는 abstract 키워드를 붙여서 표현하며 abstract로 선언한 메소드는 자식클래스에서 반드시 구현해야 한다. abstract class Person{ private age:number; private name:string; constructor(a:number, n: string){ this.age = a; this.name = n; } public abstract whereAreyouFrom():void; } // ca.. 2021. 11. 8. 이전 1 2 3 4 5 다음