일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
31 |
- GoF
- tenneling
- 시스템 설계
- gitops
- Live Template
- GoF 디자인패턴
- golang
- Bastion Server
- image resizing
- Logrus
- argocd
- 클래스 관계
- 디자인패턴
- 대규모 시스템 설계
- Golines
- notification system
- Kubernetes
- AWS
- go
- Buffered channel
- System Design
- goroutine
- AWS Infra
- Lambda@Edge
- 컴포지트패턴
- Infra
- 알림 시스템
- UnBuffered channel
- Helm V3
- 컴포짓패턴
- Today
- Total
목록프로그래밍언어/Javascript & Typescript (43)
Fall in IT.
최근 웹개발을 할때는 Angular, React, Vue 이 세 가지 프레임워크를 많이 이용합니다. 때로는, Typescript도 함께 사용하기도 하는데요, 이때 인터넷 익스플로러(IE)에서는 웹사이트가 동작하지 않는 경우가 종종 발생합니다. 에러를 확인해보면 Symbol is undefined 또는 Symbol이 정의되지 않았습니다. 라고 나오게 됩니다. 해당 문제는 babel-polyfill을 추가하면 해결할 수 있습니다. 해결방법 babel-polyfill 설치 $ npm install babel-polyfill 웹사이트의 엔트리 파일 위치에 babel-polyfill을 추가 (index.js 또는 index.ts 등) import 'babel-polyfill' 참조 https://www.npmjs..
safari에서 new Date() 사용할때 주의할점 Date 객체는 자바스크립트에서 많이 사용되는데요, 주의해야할 사항이 있습니다. String 타입의 날짜를("2019-03-15") Date 객체에 담아서 사용할때, 크롬과 사파리가 다르게 동작합니다. "yyyy-mm-dd"의 형태로 입력받을 경우 Safari와 Chrome 모두 정상동작하지만, "yyyy-m-dd"의 형태로 입력받을 경우 Safari에서는 error, Chrome에서는 정상동작하게 됩니다. let date = new Date("2019-03-15"); let date = new Date("2019-3-15"); // safari error!
안녕하세요. 오늘은 Typescript로 싱글톤 패턴에 대해서 알아보도록 하겠습니다. 싱글톤 패턴이란? 특정 클래스의 인스턴스가 단 하나만 존재해야 하는 경우가 있다. 이때 싱글톤 패턴을 사용합니다. 예제 소스 class Singleton { private static _default: Singleton; public static get default(): Singleton { if (!Signleton._default) { Signleton._default = new Signleton(); } return Signleton._default; } } 이러한 접근 방식의 또 다른 이점은 초기화 지연이다. 따라서 객체는 처음 액세스할 때 초기화 됩니다. 모두 즐거운 코딩하세요~
안녕하세요. 오늘은 숫자와 숫자 사이의 랜덤 정수를 뽑는 방법에 대해서 알아보겠습니다. 사용 라이브러리Math.random() 사용 방법 1부터 10까지 랜덤 정수를 뽑기 위해선 min에 1, max에 10을 입력하면 됩니다. (1과 10도 포함) 주의사항Math.round() 올림 함수를 사용할 경우 고르지 않은 분포가 나오니, 반드시 floor() 내림 함수를 사용해야 합니다. 참조https://stackoverflow.com/questions/4959975/generate-random-number-between-two-numbers-in-javascripthttps://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Mat..
안녕하세요. 오늘은 window.opener에 대해서 알아보도록 하겠습니다.샘플 코드는 여기에서 확인해주시기 바랍니다. window.opener이란?윈도우 A에서 window.open()을 통해 윈도우 B를 열었다면, window.opner를 통해 윈도우 B에서 윈도우 A를 제어할 수 있다. Sample Code // index.js (윈도우 A) window.onload = () => { setEventHandler(); main(); } function setEventHandler() { // 윈도우 B 열기 버튼 document.getElementById("window-open-button").onclick = () => { window.open("window-b.html", "_blank", 'w..
안녕하세요. 오늘은 자바스크립트의 every 메소드에 대해서 알아보도록 하겠습니다. every 메소드자바스크립트에서 Array객체의 멤버함수 입니다.배열 안의 모든 멤버(즉, item)들이 지정한 테스트의 통과여부를 확인할때 사용합니다. 예제아래 예제는 짝수와 홀수가 함께 존재하는 a 배열, 짝수만 존재하는 b 배열을 sample data로 활용합니다.every 함수를 사용하여 배열의 원소들이 짝수로만 이루어진 배열인지 확인하는 예제입니다. 참조https://msdn.microsoft.com/ko-kr/library/ff679981(v=vs.94).aspx 모두 즐거운 코딩하세요~
interface IPerson{ name: string; age: number; gender: string;} /** * 인터페이스의 모든 프로퍼티를 optional하게 변경한다. */type PartialPerson = Partial;const partialPerson: PartialPerson ={ gender: "male" // optional} /** * 인터페이스의 모든 프로퍼티를 required하게 변경한다. */type RequiredPerson = Required;const requiredPerson: RequiredPerson = { name: "Jade", // required age: 29, // required gender: "male" // required} /** * 인터페이스..
안녕하세요. 오늘은 Typescript뿐만 아니라 정적타입 언어에서 자주 사용되는 Generic에 대해서 알아보도록 하겠습니다. Generic이란? Generic은 어떤 클래스 혹은 함수에서 사용할 타입을 그 함수나 클래스를 사용할 때 결정하는 프로그래밍 기법을 말한다. 기본적으로 Java와 같은 정적 타입의 언어는 클래스 또는 함수를 선언하는 시점에서 매개변수 또는 리턴 타입을 지정해야 한다.이때, Generic을 사용하면 범용적인 매개변수 또는 리턴타입을 지정할 수 있다. Javascript에서는 Generic이 없는 이유 Javascript는 원래 타입 선언이 필요하지 않고, 런타임 시점에 에러가 발생하기 때문에 Generic이 필요하지 않다. Generic을 사용하는 이유 Stack 자료구조 예제..
안녕하세요. 오늘은 명시적 바인딩(Explict Binding)을 사용할때 반드시 알아야할 세가지 함수 call, apply, bind에 대하여 알아보겠습니다."도대체 왜 함수를 그냥 호출하면 될 것을.. 요상한(?) 함수들을 사용하여 호출하는 걸까?"라는 의문을 가지시는 분들이 있으실 것 같습니다. 간단하게 Function.prototyope.call, Function.prototype.bind, Function.prototype.apply 세가지 함수들은, 어떤 함수안에서 사용되는 this의 값이 어떤 값이 사용되야하는지 명확할때 사용하는 방식입니다.100번 말하는 것 보다 직접 코드를 보고, 실행해보는게 효과적이라고 생각하기 때문에 예제를 보도록 하겠습니다. call, apply, bind 사용하여..
자바스크립트에서는 반복적으로 계산되는 함수는 메모이제이션 패턴을 사용하여 구현합니다. 계산 결과를 저장해 놓아 이후에 다시 계산할 필요없이 사용가능하도록 저장해놓은 캐싱과 같은 기능 메모이제이션이라고 합니다. 아래에서 피보나치수열로 예를들어보도록 하겠습니다. 피보나치수열은 0, 1, 1, 2, 3, 5, 8, 13, 21, ... 으로 나타나는 수열입니다. 일반코드 #1function fibonacci(n) { if (n 결과: 일반코드 #2 : 삼항연산자를 사용하여 코드 정리 function fibonacci(n) { return n < 2 ? n :..