몽땅뚝딱 개발자

◽ 적용하기 export const hexToRgba = (hexType: string, alpha: string): string => { let r = parseInt(hexType.slice(1, 3), 16), g = parseInt(hexType.slice(3, 5), 16), b = parseInt(hexType.slice(5, 7), 16) return 'rgba(' + r + ', ' + g + ', ' + b + ', ' + alpha + ')' } 개인적으로 공부한 내용을 정리하는 블로그로 잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.

◽ 세자리마다 콤마(,) 적용 parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',') ◽ 소수인 경우 세자리마다 콤마(,) 적용 // 소수점을 기준으로 split const parts = returnTarget.toString().split('.') parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',') // 정수만 추출하여 3자리마다 콤마 적용 returnTarget = parts.join('.') 개인적으로 공부한 내용을 정리하는 블로그로 잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.

전개연산자는 ES6부터 적용되는 문법이다. 배열이나 객체 변수를 좀 더 지관적이고 편리하게 합치거나 추출할 수 있게 도와주는 문법이다. ◽ Array 합치기 변수 앞에 ...(마침표 3개)를 입력하여 사용한다. componentDidMount() { let varArray1 = ['num1', 'num2'] let varArray2 = ['num3', 'num4'] // ES5 let sumVarArr = [varArray1[0], varArray1[2], varArray2[0], varArray2[1]] // ES6+ let sumVarArr = [...varArray1, ...varArray2] } 아래와 같이 개별 변수에 값을 할당할 수도 있다. componentDidMount() { let var..

const getTextColorByBackgroundColor = (hexColor: string): string => { const c = hexColor.substring(1) // 색상 앞의 # 제거 const rgb = parseInt(c, 16) // rrggbb를 10진수로 변환 const r = (rgb >> 16) & 0xff // red 추출 const g = (rgb >> 8) & 0xff // green 추출 const b = (rgb >> 0) & 0xff // blue 추출 const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b // per ITU-R BT.709 // 색상 선택 const result = luma < 127.5 ? 'white'..

◽ dataset의 문법 'data-'라는 prefix를 붙이고 map으로 관리된다. const target = this.document.querySelectorAll('li') target.setAttribute("data-auto", true) ◽ 가져오기 const target = this.document.querySelectorAll('li') console.log(target.dataset.min) // 5 console.log(target.dataset.max) // 10 console.log(target.dataset.auto) // true 개인적으로 공부한 내용을 정리하는 블로그로 잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.

Node.js란? Node.js는 Javascript를 사용하기 위해 만들어진 프로그램(=환경, *자바스크립트 런타임, 자바스크립트 실행기)이다. * 런타임: 특정 언어로 만든 프로그램을 실행할 수 있는 환경 스크립트 언어는 웹 브라우저안에서만 동작하여 웹 브라우저없이는 동작하지 못했다. Node.js는 Javascript를 웹 브라우저에서 독립시킨 것으로 Node.js를 설치하면 터미널 프로그램에서 Node.js를 입력하여 브라우저 없이 바로 실행할 수 있다. Node.js는 내장 HTTP 서버 라이브러리를 포함하고있어 웹 서버에서 아파치 등의 별도의 소프트웨어 없이 동작하는게 가능하다. 출처 https://junspapa-itdev.tistory.com/3 https://hanamon.kr/nodej..

◽ 배열 끝에 항목 추가하기 let arr = ['고구마', '감자', '옥수수'] arr.push('땅콩') // ['고구마', '감자', '옥수수', '땅콩'] ◽ 배열 앞에 항목 추가하기 let arr = ['고구마', '감자', '옥수수'] arr.unshift('땅콩') // ['땅콩', '고구마', '감자', '옥수수'] ◽ 배열 끝에서부터 항목 제거하기 let arr = ['고구마', '감자', '옥수수'] arr.pop() // ['고구마', '감자'] ◽ 배열 앞에서부터 항목 제거하기 let arr = ['고구마', '감자', '옥수수'] arr.shift() // ['감자', '옥수수'] ◽ 배열 안 항목의 인덱스 찾기 let arr = ['고구마', '감자', '옥수수'] arr.in..

조금 슬픈 마음으로 정리해보는,,,🥺 https://be-a-weapon.tistory.com/206 예전에 정리해놓고도 왜 기억을 못하니,, 당시에도 저렇게 적어놓고 이해를 제대로 못했을 가능성이 높다. 삭제하려다가 반성의 의미로 남겨두었다,, 새로운 정보라고 생각하고 포스팅하던 중에 이미 관련 글이 블로그에 있을 때 울적하다,,😮‍💨 ◽ call(), apply()을 왜 사용하는가? this를 명시적으로 바인딩하기 위해서 사용한다. 이렇게 콘솔을 찍는 경우 결과값이 '페퍼로니'가 나올 것 같지만, this는 window를 가리킨 상태가 아니기때문에 undefined이다. const name = '페퍼로니' function print() { console.log(this.name); } print() ..

파일 업로드 구현 중, 데이터를 실어보낼 formdata에 데이터를 넣고 console.log()로 조회했지만 출력되지 않았다. 예전에도 같은 경험을 한 적이 있는데 놀랍게도 어떻게 출력했는지 전혀 기억나지 않았다. 앞으론 기억하자! [방법 1.] submit() { let data = new FormData(); this.fileList.forEach((obj, idx) => { data.append("files", obj); }) // key 조회 for (let key of data.keys()) { console.log(key); } // value 조회 for (let value of data.values()) { console.log(value); } } [방법 2.] submit() { le..

◽ delete의 경우 기존의 key(=index)가 남아있는 채로 삭제된다. 해당 요소를 삭제해도 다른 요소의 key값은 바뀌지 않는다. delete this.fileList[idx]; ◽ splice()의 경우 기존의 key(=index)가 알아서 줄어든다. 해당 요소를 삭제하면 다른 요소의 key값도 바뀐다. this.fileList.splice(idx, 1) 개인적으로 공부한 내용을 정리하는 블로그로 잘못된 개념을 게시하지않도록 주의하고 있으나 오류가 있을 수 있습니다.