记录--用js如何实现将手机号中间的几位数字变成****
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助
今天,我们要实现一个很常见并且简单的功能:将手机号中间的几位数变成****
这个功能其实很常见,比如我们微信的账号安全里面显示的手机号、掘金的账号设置里面显示的手机号、支付宝里面的证件号码、各大银行的App卡号.....还有很多有关系到我们私密的地方,在此就不一一例举了,看似简单的功能,我们该如何实现呢?
其实实现的方法有很多,在这里作者将使用js的方式来实现,如有不正确或者需要修改的地方,请多多指教,有更好的方法也可以留言~
下面所使用到的方法,相信学习过javaScript的小伙伴们都非常熟悉,但是你还记得他们的用法嘛?下面作者会对使用到的方法进行简单回顾,不太记得的小伙伴要去回顾一下了呢~
好了,废话少说,开始进入正题。
1. 第一种,使用字符串和数组中常见的几个方法。字符串方法:split()。数组方法:splice(),join()。
在实现之前,我们先一起来回顾一下这几个方法:
- split(): 将一个字符串拆分为一个子字符串数组,并返回该数组。
注释:该方法返回新数组,不会更改原始字符串。 注意:如果("")用作分隔符,则会对字符串进行逐个字符拆分。 www.w3school.com.cn/jsref/jsref…
下面是一个例子
const str = “hello”
let arr = str.split("");
console.log(arr); // h,e,l,l,o
- splice():方法向数组添加或从数组中删除项目,并返回删除的项目。
注释:splice() 该方法会改变原始数组。www.w3school.com.cn/jsref/jsref…
下面是一个例子:
const arr = ["a","b","c","d"];
arr.splice(1,2,"e","gg","d"); //从数字索引的第一位开始,删除两个内容,向数组添加”e“和”gg“两项。
console.log(arr); // ["a","e","gg","d"];
- join():将数组作为一个字符串返回。元素将由指定的分隔符分隔。默认分隔符是逗号 (,)。
注释:join()该方法不会改变原数组
下面是一个例子:
const arr = ['a','b','c','d'];
let result = arr.join();
console.log(result); // a,b,c,d
实现功能:
const telphone = '13300009999';
let telArr = telphone.split();
telArr.splice(3,4,'****');
let result = telArr.join(); //因为不会改变原数组,需要用一个新的变量去接收
console.log(result); // 1330****999
2.第二种,利用字符串的substr()
- substr():该方法用于提取字符串的一部分。该方法从指定位置开始,并返回指定数量的字符。
注释:substr() 方法不会更改原始字符串。 下面是一个例子:
const str = 'Hello World';
let result = str.substr(1,4);
console.log(result); //ello
实现功能:
const telphone = '13300009999';
let result = telphone.substr(0,4) + '****' + telphone.substr(8);
console.log(result);// 1330****999 //第二句代码解释:
//使用 `substr` 方法截取电话号码的前四位,然后拼接上'****',
//再拼接上电话号码从索引为8开始的剩余部分,将结果赋值给变量result。
3.第三种,利用字符串的substring()和replace();
- substring():该方法用于从字符串中提取指定的索引(位置)之间的字符,并返回子字符串。 注释:
substring()方法不会更改原始字符串。 下面是一个例子:
const str = 'Hello World';
let result = str.substring(1,4);
console.log(result); //ell
- replace():该方法在字符串中搜索值或正则表达式;该方法返回已替换值的新字符串。
注释:replace() 方法不会更改原始字符串。 下面是一个例子:
const str = 'Hello World';
let result = str.replace("Hello","Hi");
console.log(result); //Hi World
实现功能:
const telphone = '13300009999';
let result = telphone.replace(telphone.substring(3,8),'****');
console.log(result);// 1330****999
上述的replace()提到了正则表达式,那么我们也可以使用正则表达式来实现www.w3school.com.cn/jsref/jsref… www.w3school.com.cn/js/js_regex…
- /d:查找数字
- 1,1,1,2,...,$99:与正则规则中的第1到第99个子表达式相匹配的文本。
实现功能:
const telphone = '13300009999';
const reg = /(\d{4})\d{4}(\d{3})/;
let result = telphone.replace(reg,"$1****$2");
console.log(result);// 1330****999
本文转载于:
https://juejin.cn/post/7271058595444752443
如果对您有所帮助,欢迎您点个关注,我会定时更新技术文档,大家一起讨论学习,一起进步。

记录--用js如何实现将手机号中间的几位数字变成****的更多相关文章
- AngularJS进阶(十三)JS利用正则表达式校验手机号
JS利用正则表达式校验手机号 注:请点击此处进行充电! 绪 由于项目需求,需要在前端实现手机号码的校验.当然了,对于基本的格式校验应该放在客户端进行,而不需要再将待校验的手机号发送至服务端,在服务端完 ...
- 个人复习记录之-js
1变量:内存中储存一个数据的储存空间. 使用:声明,赋值,取值.注 不能以数字开头,不能用保留字 *声明提前:在程序正式执行前,都会将所有var声明的变量提前到开始位置,集中创建***赋值留在原地** ...
- js正则表达式验证账号手机号电话邮箱
1.账号 规则:字母.数字.下划线组成,字母开头,4-16位. 表达式:/^[a-zA-z]\w{3,15}$/: 2.手机号 规则:11位数字,以1开头 表达式:/^1\d{10}$/ 3.电话号码 ...
- 记录下 js各种证件的正则验证
身份证 /(^\d{15}$)|(^\d{17}([0-9]|X)$)/ 护照 /^[a-zA-Z0-9]{3,21}$/ /^(P\d{7})|(G\d{8})$/ 军官证或士兵证 ...
- js 正则 以字母开头必须有 大小写字母数字组成 可以有“@"或 ”.“
js 正则 以字母开头必须有 大小写字母数字组成 可以有“@"或 ”.“ var reg = /^[a-zA-Z]{1}(?=.*[a-z])(?=.*[A-Z])[a-zA-Z\d_@ ...
- js验证连续两位数字递增或递减和连续三位数字相同
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8" ...
- js正则判断实现18位数字
js实现18位数字 var stuCardReg = /^[0-9]{18}/; var stuCard = $('.inp).val();//获取input框中的数值 if (!stuCardReg ...
- 记录:sea.js和require.js配置 与 性能对比
最近有点忙,很久无写博客,记录一下之前的配置require.js和sea.js的配置.(有误有望提出 require.js 文件目录 /app(项目使用js) /lib(require.js jq存放 ...
- 记录d3.js 力导向图的平移缩放,类似地图导航点击某一项移动到当前位置
项目中有用到d3.js用于图结构的查询, 需求如下: 右上角有个模糊搜索功能,查询出来的结果用列表展示 点击列表的某一列,要求画布移动到当前选中的节点的位置,基于画布正中间 搜索出来的结果列表展示用的 ...
- [Javascript摸鱼记录] 关于js简单字符删减替换增加插入追加前中后处理
以前总是怕死js如其名,能让我入坑润不出来,然后最近被迫写点静态html,又要用到数值运算处理, 于是又开启了「好几十个标签栏解决一个问题」的"探索路程",顺便记录一下摸鱼结果希望 ...
随机推荐
- C语言中位运算取余
位运算取余 求一个数被另一个数整除的余数,可以用求余运算符"%",但是,如果不允许使用求余运算符,又该怎么办呢?下面介绍一种方法,是通过位运算来求余,但是注意:该方法只对除数是2的 ...
- 【Unity3D】摇杆
1 需求实现 1)需求实现 鼠标拖拽摇杆球控制坦克移动: 上下左右按键也可以控制坦克移动,并且摇杆球也同步移动: 鼠标右键滑动,控制坦克转向: 相机在玩家后上方的位置,始终跟随玩家,朝玩家正前方看 ...
- React闭包陷阱
React闭包陷阱 React Hooks是React 16.8引入的一个新特性,其出现让React的函数组件也能够拥有状态和生命周期方法,其优势在于可以让我们在不编写类组件的情况下,更细粒度地复用状 ...
- 新零售SaaS架构:什么是订单履约系统?
什么是订单履约系统? 订单履约系统用来管理从接到销售订单,到把货品送到客户手中的整个业务过程.它是上游交易(如销售和客户下单环节)和下游仓储配送(如库存管理.物流)之间的桥梁,确保信息流的顺畅和操作的 ...
- linux基本命令--day02
目录树架构示意图 以下是对这些目录的解释: /bin: bin是Binary的缩写, 这个目录存放着最经常使用的命令. /boot: 这里存放的是启动Linux时使用的一些核心文件,包括一些连接文件以 ...
- 【LeetCode回溯算法#03】电话号码的字母组合(数字映射字母)
电话号码的字母组合 力扣题目链接(opens new window) 给定一个仅包含数字 2-9 的字符串,返回所有它能表示的字母组合. 给出数字到字母的映射如下(与电话按键相同).注意 1 不对应任 ...
- 【LeetCode二叉树#15】二叉搜索树中的众数(递归中序遍历)
二叉搜索树中的众数 力扣题目链接(opens new window) 给定一个有相同值的二叉搜索树(BST),找出 BST 中的所有众数(出现频率最高的元素). 假定 BST 有如下定义: 结点左子树 ...
- ASP.NET Core MVC应用模型的构建[4]: Action的选择
ControllerModel类型的Actions属性包含一组描述有效Action方法的ActionModel对象.对于定义在Controller类型中的所有方法,究竟哪些方法才能成为有效的Actio ...
- mysql找出不包含某些关键字的结果
比如公司业务是和房产相关的,但是库里存在和房产不相关的内容时就需要筛选并删除. 如何筛选才能不误伤呢? 这是我的一个初步的SQL: 意思是如果name.desc字段都不包含房.盘.楼.地产关键字才找出 ...
- cpu过高什么原因?怎么排查?
运行大型程序或应用程序:当计算机运行大型程序或应用程序时,CPU需要处理更多的数据和指令,因此CPU占用率会相应地增加. 病毒或恶意软件:某些病毒或恶意软件会占用计算机的CPU资源来执行恶意任务,例如 ...
