오늘은 padStart와 padEnd에 대해 알아보겠습니다.
날짜를 계산할 때 앞에 0을 붙여야 하거나, 일부 암호화를 해야할 때가 있습니다.
조건문이나 반복문으로 해결할 수도 있지만 오늘은 그 작업을 편리하게 해보겠습니다.
String.prototype.padStart()
MDN에 예제가 잘나와있어서 가져왔습니다.
// 앞에 0 넣기
const str1 = '5';
console.log(str1.padStart(2, '0')); // -> "05"
console.log(str1.padStart(2)); // -> " 5"
// 앞에 * 넣기
const fullNumber = '2034399002125581';
const last4Digits = fullNumber.slice(-4);
console.log(last4Digits); // -> "5581"
const maskedNumber = last4Digits.padStart(fullNumber.length, '*');
console.log(maskedNumber); // -> "************5581"
사용방법은 아래와 같습니다.
두 번째 인자가 생략될 경우 앞쪽에 공백으로 채워집니다.
적용할문자열.(채울길이, 채울문자)
String.prototype.padEnd()
padStart가 앞부분을 채웠다면 padEnd는 뒤를 채웁니다.
사용방법은 padStart와 동일하며 두 번째 인자를 생략하면 공백으로 채워집니다.
const str1 = '12345';
console.log(str1.padEnd(10, '.')); // -> "12345....."
console.log(str1.padEnd(10)); // -> ""12345 "
참고 :
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/padStart
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/String/padEnd
'Front-end > JS tip' 카테고리의 다른 글
javascript 두 좌표 사이의 거리 구하기 (0) | 2022.02.16 |
---|---|
javascript 카카오 공유하기 (0) | 2022.01.22 |
javascript .replaceAll 안될 때 (0) | 2022.01.20 |
javascript select option 값 가져오기 (0) | 2022.01.14 |
javascript selectbox option 값 구하기 (0) | 2022.01.12 |