본문 바로가기

WEB10

[javascript]랜덤하게 밝은 색 코드 반환하기 함수 구현 목적 여러 색을 랜덤 하게 뽑고 싶은데(차트 라인 별 색상 등) 너무 알록달록하여 밝은 색들만 랜덤하게 뽑고 싶어서 구현해 봤습니다. 구현 방법 랜덤하게 헥스 코드(#○○○○○○)로 반환하는 함수입니다. 헥스 코드는 16진수 6자리로 이루어져 있습니다. 이중 2자리씩 앞에서 부터 R(빨강색), G(녹색), B(파란색)을 나타내며 00(0)~FF(255)까지 총 256단계로 각각의 색의 강도를 나타냅니다. 해당 색은 빛의 삼원색을 서로 더하는 가산혼합으로 3가지 색이 모두 0인 경우 #000000 검정, 모두 FF 인 경우 #FFFFFF로 흰색이 됩니다. 이처럼 각 색의 값의 합이 높을 수록 밝아지므로 모든 색상 값을 반 이상으로 랜덤 하게 뽑았습니다. RGB 값이 128, 16진수로는 80 이.. 2022. 1. 26.
[javascript]Array(배열) 비우기 배열 비우기 개발을 하다 보면 배열을 비워야 할 경우가 발생하는데 그때 사용할 수 있는 방법들입니다. 1. 빈 배열 대입 let array = [1,2,3,4,5]; array = [] console.log(array) // [] 단순하게 빈 배열 대입하여 배열을 비울 수 있습니다. 2. 배열의 길이 수정 let array = [1,2,3,4,5] array.length = 0 console.log(array) // [] 배열의 길이를 0으로 수정하면 배열을 비울 수 있습니다. ※ 배열의 길이를 수정하면 해당 길이만큼 배열의 크기가 바꿔지며 현재 길이보다 크게 변경 할 경우 해당 자리에 빈 값이 들어가며 sparse Array가 됩니다. 3. 배열 자르기 let array = [1,2,3,4,5] arr.. 2022. 1. 21.
[javascript]Hoisting? 호이스팅(Hoisting - 끌어올리다) 변수 선언, 함수 선언 등이 스코프 최상단으로 끌어올려진 것 같은 현상 원인 javascript의 경우 인터프리트 언어로 한 줄씩 읽으면서 실행하지만 그전에 먼저 변수, 함수 등의 선언문을 찾아내 힙 메모리에 적재하기 때문입니다. 이때 let, const와는 다르게 var는 선언과 동시에 undefined로 초기화까지 하는데 이로 인해 똑같이 hoisting 돼도 let과 const는 다르게 작동합니다. 예제 소스로 확인 1) 선언문이 먼저 힙에 적재되는지 확인 console.log(a); //var a로 선언되어있기 때문에 선언과 동시에 undefined로 할당 - 참조 가능 : undefined console.log(b); //let b로 선언되어있기 때문에 .. 2022. 1. 10.
checkbox type의 input 태그를 Array를 이용해 radio 효과 나타내기 간단하게 javascript의 Array를 통해 Queue 형식(FIFO)으로 데이터를 처리 queue의 Enqueue : Array의 push(value)를 사용 - 배열에 value를 추가 queue의 Dequeue : Array의 shift()를 사용 - 배열에서 첫 번째 value를 제거하며 반환 체크박스를 선택하면 Array에 값을 추가하고 Array가 체크 가능한 최대 개수를 넘을 시 shift를 통해 제일 먼저 선택된 값을 제거하여 Radio처럼 동작하게 합니다. See the Pen radio checkbox by kjg20260 (@kjg20260) on CodePen. 2021. 9. 30.

티스토리툴바