본문 바로가기

FRONTEND/Code Backup4

211201 Javascript Reduce Method 활용법 JavaScript Reduce Method Made Simple reduce() 메서드는 가장 자주 사용되는 Array 메서드인 ES6(ECMAScript 2015) 에 추가된 JS 기능입니다. reduce() 의 역할은 제공된 reducer function 을 실행하여 주어진 Array 를 한 개의 값으로 줄여나가는 역할을 합니다. 결과적으로는 한 개의 값으로 줄여나가는 것 입니다. // reduce() 문법 array.reduce(callback, initialValue) const reducer = (accumulator, currentValue, index) => { // ... } 사용법 reduce 메서드는 보통 전체 총합/평균/최소/최대 값을 구할 때 사용됩니다. 이 말은 다른데에도 사용할.. 2021. 12. 1.
210914 Javascript - Regex 백업 Javascript - Regex 형식 백업 외부에서 텍스트를 받아와 목록에서 찾기 function findText (text) { const regex = new RegExp(text, 'gi') // text 찾기 }예제코드 See the Pen 210924 Regex_FindText by Jaeeun Jung (@dmsdl950823) on CodePen. Email 형식 확인 function emailValidator (email) { const regex = /^(([^()[\]\\.,;:\s@"]+(\.[^()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9].. 2021. 11. 27.
210610 Javascript - File / Blob / 업로드 / 다운로드 / Encoding / Decoding Blob 이란? FileList 와 File 의 생김새 차이 FileReader 사용하기 Image 를 Base64 코드로 변환하기 Base64 코드를 Image 로 변환하기 파일 내부 데이터를 텍스트로 변환하기 파일 업로드 파일 다운로드 부록 - 파일 용량 체크 Blob 이란? Blob Object 는 file 같은 나열할 수 있는(Enumerable) 오브젝트이며, raw data 입니다 Text 나 binary data 처럼 읽힐 수 있고, ReadableStream 으로 변환될 수 있습니다. FileList 와 File 의 생김새 차이 console 로 확인해보면, FileList 와 File 의 생김새의 차이는 아래와 같습니다. - FileList : { 0: File, length: 1 } -.. 2021. 11. 25.
210625 Javascript Textarea Input 이벤트에 맞춰 길이 늘리기 Javascript Textarea Input 이벤트에 맞춰 길이 늘리기 Vanilla Javascript const textarea = document.querySelector('textarea') textarea.addEventListener('input', e => { textarea.style.height = textarea.scrollHeight + 'px' }) Vue.js const textareaWrap = this.$refs.textarea.$el const textarea = textareaWrap.querySelector('textarea') textarea.style.height = 'auto' textarea.style.height = textarea.scrollHeight + '.. 2021. 11. 25.