전체 글343 728x90 javascript #디자인패턴 - 메모이제이션 패턴 (memoization pattern) 메모이제이션(memoization) 패턴 패턴의 이름대로 '메모'를 하는 것이 특징입니다. 메모를 하는 대상은 바로 함수 또는 객체입니다. 이 패턴의 활용 용도는 일반적인 프로그래밍 언어에서 캐시를 사용하는 것처럼 사용한다고 생각하면 됩니다. 적용예시1. 메모이제이션 패턴을 이용한 캐시 구현 특정 아이템을 검색하려고 할 때, 검색 결과를 ID 기반으로 캐시 처리하는 메모이제이션 패턴입니다. 메모이제이션 패턴의 메모를 하는 대상은 변수가 될 수도 있고 함수가 될 수도 있습니다. 아래 소스에서 검색하는 함수가 searchItem() 이라면 이 함수 자체에 cache라는 속성을 객체로 추가하고, cache에는 아이템이 있으면 캐시에 저장된 객체를 반환하고 없으면 서버로 요청합니다. Search 적용예시2. 메.. 2021. 2. 13. javascript #디자인패턴 - Self-defining function 패턴 Self-defining function 패턴 앞서 살펴본 Init-time branching 패턴은 처음 웹페이지 초기화 단계에서 컴퓨팅 자원을 소모하여 향후 어떠한 방법으로 함수가 호출될 지 결정하는 것이었다면, Self-defining function 패턴은 위의 함수가 최초 실행되는 시기에 이것을 결정하여 설정하게 됩니다. 이렇게 Init-time branching 패턴의 초기화 시기를 조절하기 위한 상황 이외에도 함수 실행 전 초기화가 필요할 때 호출됩니다. Self-defining function 패턴의 또 다른 사용 방법은 바로 함수가 한 번만 호출되어야할 때, 특히 XMLHttpRequest 등으로 서버에 요청을 보낼 때 사용하면 편리합니다. 예시1 - Self-defining functi.. 2021. 2. 12. javascript #디자인패턴 - Init-time branching 패턴 Init-time branching 패턴 Init-time branching 패턴은 이름 그대로 초기화 단계에서 분기하여 같은 함수를 환경에 따라 다르게 정의하는 것을 의미합니다. 보통 웹페이지가 처음 열릴 때 실행된다고 해서 Init-branching 패턴이라고도 하며, 페이지가 로드될 때 실행되기 때문에 Load-branching 패턴이라고도 합니다. 브라우저 호환성을 보장해줄 때 사용하면 좋은 패턴입니다. 적용예시1. 이벤트 핸들러 호환성 지원 1. navigator.appName 으로 호환성 지원 과거에는 이렇게 처리하는 웹페이지들이 많았으나, 최근에는 이렇나 처리 방식이 적당하지 않습니다. 웹페이지들이 Internet Explorer8을 구분하기 위해 위의 소스를 이용하는 이유는 이벤트 핸들러 .. 2021. 2. 10. javascript #디자인패턴 - 함수 기반 데커레이터 패턴(decorator pattern) 프락시 패턴에서 살펴봤던 래퍼 기능을 데커레이터 패턴과 함께 사용하면, 해당 함수가 호출되기 전에 여러 가지 함수가 호출될 수 있도록 응용할 수 있습니다. 이렇게 응용할 수 있는 상황은 각 함수의 모니터링 기능을 넣고자 할 때입니다. 구현 함수 호출 전 시각과 이후의 시각을 출력하여 각 함수의 처리 시간을 유추할 수 있도록 합니다. 결과 실행 결과를 보면 각 함수에서 호출이 시작되고 끝나는 데 걸리는 시간을 알 수 있습니다. 이러한 모니터링 도구를 변형하여 사용자의 사용 패턴이나 각 자바스크립트 함수의 호출 시간을 기록하여 컴퓨팅 자원을 분산하거나 병목을 분산하여 사용자 경험을 높일 수 있는 자료로 활용할 수 있습니다. 이전글 2021/02/10 - [Study Note/Javascript] - java.. 2021. 2. 10. javascript #디자인패턴 - 객체 기반 데커레이터 패턴(decorator pattern) 하나의 객체에 여러 가지 기능들을 추가함으로써 기존의 객체에 추가로 꾸며진 객체를 만들어낼 수 있습니다. 데커레이터 패턴을 이용해 각기 다른 부품으로 이루어진 컴퓨터의 가격을 알아봅니다. 구현 결과 참고도서 : 속깊은 자바스크립트 5.4. 데커레이터 패턴 이전글 2021/02/10 - [Study Note/Javascript] - javascript #폼 검증을 위한 데커레이터 패턴 적용 javascript #폼 검증을 위한 데커레이터 패턴 적용 데커레이터 패턴 프락시 패턴은 호출되는 객체가 아닌 별도의 중간자 역할을 수행하는 프락시 객체가 추가 기능을 수행하는 패턴이라고 한다면, 데커레이터(decorator) 패턴은 호출 대상이 되는 simuing.tistory.com 2021. 2. 10. javascript #디자인패턴 - 폼 검증을 위한 데커레이터 패턴(decorator pattern) 데커레이터 패턴 프락시 패턴은 호출되는 객체가 아닌 별도의 중간자 역할을 수행하는 프락시 객체가 추가 기능을 수행하는 패턴이라고 한다면, 데커레이터(decorator) 패턴은 호출 대상이 되는 객체에 추가 기능들을 자유롭게 추가하는 패턴입니다. 데커레이터 패턴을 유용하게 이용할 수 있는 곳은 바로 검증 도구입니다. 구현 (폼 검증을 위한 데커레이터 패턴 실용 예) First name: Last name: Age: Gender: Male Female 결과 필수 항목을 모두 기입하지 않은 경우 유효성체크를 통과하지 못한 경우 필수 항목을 모두 기입한 경우 # 참고도서 : 속깊은 자바스크립트 5.4. 데커레이터 패턴 참고할만한 문서 : ui.toast.com/weekly-pick/ko_20200102 2021. 2. 10. 울산맛집 #해월당 베이커리 - 울산,울주군,상북면,언양,삼남읍 해월당을 방문했어요. 친구 추천으로 울주군 상북면에 신규오픈한 해월당에 다녀왔습니다~^^ 울주군은 제 고향인데 뭔가... 심심한 곳이에요. 그래서 그런지 신규오픈한 가게가 생기면 금방 화제 거리가 된답니다. ㅎㅎ 해월당은 2021년 2월 3일에 오픈했고 2월 7일 일요일에 방문했습니다. 오픈 일주일도 안된 주말이라서 그런지 사람이 엄청 많았어요. 주차요원 안내를 받고 주차한 뒤 코로나 예방을 위해 발열체크, 방문기록을 남겼습니다. :) 코로나로 인해 시식이 불가하다는 안내문이 적혀있었습니다. 생소한 빵도 많았기에 최대한 맛을 상상해보며 고르는 재미가 있었습니다. 해월당은 앉을 곳이 많았어요. 코로나로 걱정되기도 했었는데 워낙 넓어서 요리조리 거리 유지하고 잘 피하면(?) 병원 대기석보다 안전하겠다는 느낌.. 2021. 2. 10. 2018 #주토피아 팬아트 - 닉과 주디 2018년에 지인이 아이폰 배경화면으로 하고싶다며 의뢰했던 닉과 주디 팬아트입니다. 지긋한 닉과 시크한 주디 버전입니다. ㅎㅎ 2021. 1. 25. 2017 #캐릭터 디자인 - 쥐똥박사 지인 캐릭터를 그려주던 시절! 그려줬던 캐릭터들 중 하나입니다. 주제는 쥐똥+박사 였죠 ㅎㅎ 귀여워서 올립니다. 2021. 1. 25. 2021년 #하이브리드 앱 개발언어 트랜드 분석(with Google Trends) 전 세계 + 지난 5년 하이브리드 앱! 하면 떠오르는 개발언어 세 가지로 검색해보았습니다. react native 인기가 상승하다가 2020년엔 수그러드는 양상입니다. ionic 특이한 그래프입니다. 연말 연초에는 그래프가 급상승하더니 여름엔 그래프가 푹 내려갑니다. 왜일까요? 모르겠네요ㅠㅠ 어쩌면 연말, 연초에 급하게 만들어 제출해야 하는 서비스를 만드는 것이 아닌가... 싶습니다. ㅋㅋㅋ flutter 생각보다 인기가 엄청납니다. 2019년엔 react native를 넘어섰네요. 대한민국 + 지난 5년 국내에서도 flutter의 인기가 높아졌을까? 궁금해져 대한민국으로 검색해보았습니다. react native ionic 보다 인기가 많으며, 서울과 경기에서 많이 검색되었습니다. ionic 다른 하이브.. 2021. 1. 24. 2021년 #프론트엔드 언어 트랜드 분석 (with Google Trends) javascript 기본기를 공부하다가 문득 프론트엔드 트랜드가 어떻게 될까? 궁금해졌습니다. 트랜드가 궁금할 땐 구글 트랜드다! 싶어 저만의 기준으로 검색해보았습니다. 트랜드 검색일자 : 2021.01.24 전 세계 + 지난 5년 Google Trends 비교 - react, angular, vue react 인기가 급상승하여 2017~2018년에 angular를 잡고 2020년엔 vue까지 잡았네요. 아시아권에서 인기가 많습니다. angular 안정적으로 유지되고 있으나 인기가 좋아지는 양상은 아닙니다. vue 엄청난 인기를 누리다가 2020년에 인기가 급감되었음을 확인할 수 있습니다. jquery react, angular, vue 만 비교하려다 재미삼아 jquery도 넣어보았습니다. 프론트언어가 .. 2021. 1. 24. 프로그래머스 #정렬 - 가장 큰 수 lv2 제출 답안 function solution(numbers) { let answer = '', i, numbers_sort = [], number; if(Math.max(...numbers)===0) { return '0'; } for(i=0; in[1])].join('') return answer; } 풀이 과정 0만 들어 오는 경우 "0000" 으로 반환될 우려가 있으므로 제일 첫 부분에 체크하는 조건문을 작성하였다. 1000이하의 수가 주어진다는 점을 응용할 방법이 없을까 찾아보던 중 숫자를 반복하여 4자리 수로 만들면 된다는 사실을 알아내었다. 그 부분만 차용하여 문자열 내림차순으로 정렬시켰고 결과는 주어진 숫자를 join() 하여 return 하도록 하였다. 다른 사람들의 풀이 분석 다른 사람들의.. 2021. 1. 23. 이전 1 ··· 3 4 5 6 7 8 9 ··· 29 다음
