JS實現(xiàn)手機號脫敏、郵箱脫敏、身份證號脫敏、姓名脫敏等常見脫敏代碼示例

更新時間：2024年02月01日 15:32:38 作者：暴怒的代碼

這篇文章主要給大家介紹了關于JS實現(xiàn)手機號脫敏、郵箱脫敏、身份證號脫敏、姓名脫敏等常見脫敏的相關資料,脫敏的目的是保護用戶隱私,一種常見的方式是顯示部分字符,用星號或其他字符替代,需要的朋友可以參考下

一：為什么要脫敏？

在前端項目開發(fā)中，數(shù)據(jù)的展示與渲染是非常關鍵的一步。通常我們會從后端接口直接拿到數(shù)據(jù)，但是在某些情況下渲染一些隱私信息，比如身份證號，手機號等。這些我們就需要進行脫敏處理，比如前三后四的格式，又或者其它格式。這樣有利于布局和保密。接下來，就讓我們看一下常見的脫敏種類吧！

二：如何實現(xiàn)脫敏？

在實現(xiàn)脫敏上，我們主要使用的是正則表達式和字符串的 replace 替換這兩個技術。字符表達式是用來匹配我們要去進行替換的數(shù)據(jù)。replace 則是根據(jù)各種不同的需求替換成不同的字符。

1.手機號脫敏（前三后四）

// 手機號做脫敏處理
function phoneHide(phone) {
    let reg = /^(1[3-9][0-9])\d{4}(\d{4}$)/; // 定義手機號正則表達式
    phone = phone.replace(reg, '$1****$2');
    return phone; // 185****6696
}

2.郵箱脫敏

function emailHide(email) {
    var avg;
    var splitted;
    var email1;
    var email2;
    splitted = email.split('@');
    email1 = splitted[0];
    avg = email1.length / 2;
    email1 = email1.substring(0, email1.length - avg);
    email2 = splitted[1];
    return email1 + '***@' + email2; // 輸出為81226***@qq.com
}

3.身份證號脫敏

function cardHide(card) {
    const reg = /^(.{6})(?:\d+)(.{4})$/; // 匹配身份證號前6位和后4位的正則表達式
    const maskedIdCard = card.replace(reg, '$1******$2'); // 身份證號脫敏，將中間8位替換為“*”
    return maskedIdCard; // 輸出：371782******5896
}

4.姓名脫敏

function nameHide(name) {
    if (name.length == 2) {
        name = name.substring(0, 1) + '*'; // 截取name 字符串截取第一個字符，
        return name; // 張三顯示為張*
    } else if (name.length == 3) {
        name = name.substring(0, 1) + '*' + name.substring(2, 3); // 截取第一個和第三個字符
        return name; // 李思思顯示為李*思
    } else if (name.length > 3) {
        name = name.substring(0, 1) + '*' + '*' + name.substring(3, name.length); // 截取第一個和大于第4個字符
        return name; // 王五哈哈顯示為王**哈
    }
}

三：結尾

脫敏處理是信息安全的重要手段，它可以有效保護敏感信息不被暴露。在JavaScript中，我們可以使用一些基本的脫敏處理方法。以上這些就是比較常見的方法，各位小伙伴可以根據(jù)自己的需求使用哦。當然還有各種不同的情景，不過相信各位小伙伴可以通過上面的代碼寫出更適配你所需要的邏輯。

附前端js讓手機號脫敏的其他幾種方法

標題手機號脫敏方法有幾種

      // 方法一：使用substring()方法
              let phoneNumberOne='19909091221';
              let desensitizationOne=phoneNumberOne.substring(0,3)+' **** '+phoneNumberOne.substring(7);
              // 方法二：使用substring()方法
              let phoneNumberTwo='19909091221';
              let desensitizationTwo=phoneNumberTwo.substr(0,3)+' **** '+phoneNumberTwo.substr(7);
              // 方法三：使用正則表達式方法
              let phoneNumberThree='19909091221';
              let regular=/(\d{3})\d*(\d{4})/
              let desensitizationThree=phoneNumberThree.replace(regular,'$1****$2');

              //總結一下區(qū)別：
              //  substring第一個參數(shù)是開始下標，第二個是結束下標。
              //  substr第一個參數(shù)是開始下標，第二個是截取幾位。

到此這篇關于JS實現(xiàn)手機號脫敏、郵箱脫敏、身份證號脫敏、姓名脫敏等常見脫敏的文章就介紹到這了,更多相關JS常見脫敏手機號郵箱等內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: