본문 바로가기

Frontend/JavaScript

(3)
JavaScript n자리 랜덤숫자 (초간단) n자리 랜덤숫자를 만들어볼게요. 말그대로 문자없이 숫자만 이용해서 생성합니다. 파라미터로 n을 넘기면 그 숫자만큼의 길이의 랜덤숫자가 생성되요. 맨 앞자리가 0일수도 있게 하기위해 타입은 문자열이에요. function generateRandomCode(n) { let str = '' for (let i = 0; i < n; i++) { str += Math.floor(Math.random() * 10) } return str } 요건 바로 개발자 도구(F12) 열고 테스트해볼 수 있어요!
JavaScript 시간 계산 표시 (방금전, 몇분전, 몇시간전, 몇일전...) 유튜브를 보면 글 작성 기준으로 방금 전, 몇분 전, 몇시간 전, 몇일 전, 몇주 전, 몇개월 전, 몇 년전 이런 식으로 시간을 표기해줘요. 저 역시도 왠만하면 글 작성 날짜를 보여주는 것보다 지나간 시간을 계산해서 표기해주는 것이 좋더라구요. 물론, 프로젝트에 따라 다르겠지만요! 그럼 자바스크립트에서 글 작성 날짜를 받아서 해당 글이 얼만큼 시간이 흘렀는지 표기해주는 함수를 만들어볼게요. function displayedAt(createdAt) { const milliSeconds = new Date() - createdAt const seconds = milliSeconds / 1000 if (seconds < 60) return `방금 전` const minutes = seconds / 60 if ..
JavaScript 숫자 가격 표시 (천단위 콤마) 10000 -> 10,000 10000000 -> 10,000,000 요런식으로 금액에 콤마를 표기하여 보기쉽게 나타내고 싶은 경우가 있어요. 아쉽게도 아직 CSS로 표기할 수 있는 방법은 없는 것으로 알아요. JavaScript를 활용해서 천단위에 콤마를 찍어볼게요. Number.prototype.toLocalString() 사용 숫자를 특정 언어에 맞게 문자열로 변환해줍니다. var price = 10000; price.toLocaleString(); // 10,000 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toLocaleString Number.prototype.toLocaleStr..