e-commerce 및 회원정보 등에서 자주 사용하는 마스킹 방법 (정규식)

1. 천 단위 콤마( , ) 추가하기

const addComma = (num: number) => {
  return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
};

console.log('addComma - result : ', addComma(123456789));

 

2. 휴대폰 번호 하이픈( - ) 추가하기

const addHyphen = (phoneNum: String) => {
  if (!phoneNum) return '';

  return phoneNum.replace(/^(\d{2,3})(\d{3,4})(\d{4})$/, `$1-$2-$3`);
};

console.log('addHyphen - result : ', addHyphen('01012341234'));

 

3. 이름 첫글자, 마지막 글자 빼고 나머지 마스킹( * ) 처리하기

const maskingName = function (name: string) {
  if (name.length > 2) {
    const originName = name.split('');
    originName.forEach(function (splitName, i) {
      if (i === 0 || i === originName.length - 1) return;
      originName[i] = '*';
    });
    const joinName = originName.join();
    return joinName.replace(/,/g, '');
  } else {
    const pattern = /.$/;
    return name.replace(pattern, '*');
  }
};

console.log('maskingName - result : ', maskingName('밥값하는개발자'));

 

4. 휴대폰 가운데 번호 마스킹( * ) 처리하기

const maskingPhone = (phone: string) => {
    return (
      phone.substring(0, 3) +
      '****' +
      phone.substring(phone.length - 4, phone.length)
    );
  };

  console.log('maskingPhone - result : ', maskingPhone('01012345678'));

 

5. 텍스트 나머지 마스킹( * ) 처리하기

const maskingText = (strName: string) => {
  if (strName.length > 2) {
    var originName = strName.split('');
    originName.forEach(function (name, i) {
      if (i === 0 || i === originName.length - 1) return;
      originName[i] = '*';
    });
    var joinName = originName.join();
    return joinName.replace(/,/g, '');
  } else {
    var pattern = /.$/; // 정규식
    return strName.replace(pattern, '*');
  }
};

console.log('maskingText - result : ', maskingText('나는 누구인가?'));

'공부 > React' 카테고리의 다른 글

[React] moment 활용해서 보여지게 설정하기  (0) 2022.05.25