PAD

padStart와 padEnd 함수는 ES8(ES2017)에 새롭게 추가된 기능이다. pad는 좌우에 특정한 문자열로 채우는 기능이다. 좀더 자세히 얘기하면 첫번째 파라미터인 maxLength를 받아 문자열의 길이가 maxLength보다 작을 경우 나머지를 특정한 문자열로 채워주는 기능이다. 이때 두번째 문자열을 넘겨주지 않으면 빈 공백으로 문자열을 채운다.

String.prototype.padStart(maxLength, ?fillString);
String.prototype.padEnd(maxLength, ?fillString);

숫자 앞에 0 붙이기

달력의 날짜를 표시 할때 01, 02 처럼 숫자 앞에 0을 붙여서 표현한다. padStart가 나오기 전에는 이러한 기능을 만들기 위해서 로직을 구현하였지만 이제는 간편하게 작업할 수 있다.

const number = 10;
const size = 4;
const result = String(number).padStrt(size, 0);

console.log(result);
// 0010

아이디를 *로 표시하기

아이디의 앞부분 일부만 표시를 하고 나머지는 *로 표시 하는 기능도 자주 사용하였다. padEnd를 이용하면 간편하게 기능을 구현할 수 있다.

const id = '아이디입니다'
const temp = id.slice(0, 3);
const result = temp.padEnd(id.length, '*');

console.log(result);
// 아이디***