![[特殊字符] 拼多多大厂笔试题——正则表达式](images/news1.jpg)
前言正则表达式是拼多多、字节、阿里前端笔试最高频考点之一。很多同学JS基础不错但一遇到正则直接白给。✨ 本篇完全对标拼多多真实笔试原题从需求、规则、语法、代码、易错点全方位拆解零基础也能吃透正则核心轻松拿捏大厂笔试今天这篇完全对标拼多多真实笔试原题从需求、规则、语法、代码、易错点全方位拆解看完直接秒杀所有手机号正则面试题 一、真题 1手机号正则校验题目需求如何验证用户输入的手机号是正确的必须是11 位纯数字手机号必须以数字 1 开头第二位不能是 0、1、2前两位确定后后面必须跟随9 位数字✅核心原则永远不要相信用户的输入把用户当小白✅正则本质模式匹配 字符规则数学约束。✅真题标准答案letstr15188888898;// 描述一个匹配的规则// 一个字符一个字符的匹配//[] 表示匹配的字符范围//{n} 表示字符的长度//let reg /1[3-9][0-9]{9}/;letreg/^1[3-9]\d{9}$/;console.log(Object.prototype.toString.call(reg))console.log(typeof{});//类型 对象objectconsole.log(typeofreg);//类型 对象objectconsole.log(reg.test(str));//true//let str 13888888888;//console.log(reg.test(str)); //false//let str 138888888;少一个8//console.log(reg.test(str)); //false//let str 13888888888ss;$表示字符串的结束//console.log(reg.test(str)); //false//let str 13888888888ss;^表示字符串的开始✨考点解析/ element / ——正则表达式基本框架每次匹配一个字符1固定开头字符满足手机号以 1 开头/1/匹配第一个字符为1——————[3-9]限定第二位取值范围规避 0/1/2/1[3-9]/匹配第二个字符第二位取值范围:3-9——————\d{9}\d代表单个数字{9}代表精准匹配 9 次补齐末尾位数。/1[3-9]\d{9}/——————^匹配字符串起始位置$匹配字符串结束位置杜绝前后多出多余字符letstr13888888888ss;//一般//let reg /1[3-9][0-9]{9}/;//false// 有$letreg/1[3-9]\d{9}$/;//trueconsole.log(reg.test(str));//$表示字符串的结束letstraa13888888888;//一般//let reg /1[3-9][0-9]{9}/; //false//有^letreg/^1[3-9]\d{9}$/;//trueconsole.log(reg.test(str));//^表示字符串的开始❌ 新手常见错误写法笔试高频踩坑// 错误1没有加^ $会匹配到不完整号码constreg1/1[3-9]\d{9}/// 错误2第二位范围写错constreg2/^1[0-9]\d{9}$/// 错误3位数写死错误constreg3/^1[3-9]\d{8}$/ 二、正则表达式核心语法精讲笔试必背正则全称Regular ExpressionJS 正则固定格式/ 正则规则 /匹配逻辑一次只匹配一个字符逐位校验/ /正则包裹标识内部写匹配规则{}限定前面字符的匹配次数[]限定单个字符的取值范围\d匹配任意数字 0-9^匹配字符串开头$匹配字符串结尾 三、前置基础JS 数据类型笔试底层考点JS 数据类型分为两大派系正则操作字符串全部依赖这两类✨1. 基本类型值类型Number 数值类型String 字符串类型正则主要操作对象Boolean 布尔类型undefinednull✨2. 引用类型对象类型Object 普通对象Array 数组下标为数字索引的特殊对象 四、正则两大高频操作提取数字 替换字符✨1. 提取字符串中所有数字match 全局匹配 gmatch()字符串提取正则匹配内容g 修饰符global 全局匹配找到所有符合规则的内容不停止\d 代表匹配一次或多次可以提取连续数字conststr价格是100元,进价是80元,赚了20元;//匹配数字constreg/\d/g;//g表示全局匹配console.log(reg.test(str));//trueconstresstr.match(reg);console.log(res);//[100, 80, 20]✨2. 字符串正则替换replacereplace(正则, 新内容)批量替换字符串内容//干掉- w 改成 W大写conststrhello-world;// () 表示分组 不匹配() ,但是可以提取// $1表示提取第一个分组的内容constreg/-(\w)/;console.log(str.match(reg));//[-w, w]constresstr.replace(reg,(_,c){console.log(_,c,/////);returnc.toUpperCase();})console.log(res);//helloWorld步骤1. 正则 -(\w) 找到 -字母2. 分组 () 把后面的字母提取出来3. replace 回调里把字母变大写自动删除 -4. 最终hello-world → helloWorld️另一种constreshello-world.replace(/-(\w)/,(_,c){returnc.toUpperCase();})console.log(res);//helloWorld✨3. 进阶实战模板字符串正则渲染递归替换除了数字提取、字符替换正则递归替换也是笔试、项目开发高频用法常用于模板字符串插值渲染实现模板占位符批量替换为真实数据。需求场景通过正则匹配{{变量名}}占位符递归替换模板中所有变量实现数据动态渲染。// 模板字符串lettemplate我是{{name}}, 年龄{{age}}, 性别{{sex}};// 数据源对象letperson{name:张三,age:17,sex:男}// 正则模板渲染函数递归替换所有占位符functionrender(template,data){// 匹配 {{变量名}} 格式的占位符constreg/{{(\w)}}/// 判断是否存在可匹配的占位符if(reg.test(template)){// exec 获取匹配到的变量名constnamereg.exec(template)[1];// 替换当前匹配到的占位符templatetemplate.replace(reg,data[name])// 递归调用继续替换剩余占位符returnrender(template,data);}// 所有占位符替换完成返回最终字符串returntemplate;}// 输出结果我是张三, 年龄17, 性别男console.log(render(template,person));核心知识点解析/{{(\w)}}/专属模板占位符正则{{ }}匹配固定双大括号(\w)捕获括号内的变量名字母/数字/下划线exec()正则匹配方法可获取匹配结果及捕获组内容精准拿到变量名递归逻辑单次只替换一个占位符通过递归循环匹配直到模板中无任何占位符完美适配多变量模板无需g全局修饰符依靠递归实现全局替换是前端模板引擎的核心底层原理。 五、正则符号速查表面试直接背符号作用说明\d匹配任意单个数字 [0-9]\w匹配字母、数字、下划线匹配前面字符 1 次或多次*匹配前面字符 0 次或多次[]字符范围约束{n}精准匹配 n 次g全局匹配^ $首尾严格锁定 六、完整可直接上线的手机号校验工具函数// 拼多多笔试完整版封装函数 function checkPhoneNumber(phone) { const reg /^1[3-9]\d{9}$/ return reg.test(phone) } // 测试 console.log(checkPhoneNumber(13666666666)) // true console.log(checkPhoneNumber(12666666666)) // false 七、全文核心总结✨ 本篇围绕拼多多前端笔试核心正则考点从零拆解手机号正则校验核心逻辑、原生正则语法、三大实战用法覆盖笔试选择题、编程题、工程实战三大场景✅ 掌握手机号正则核心规则首尾锚点、范围匹配、精准位数约束✅ 吃透正则基础符号告别语法混淆、手写报错问题✅ 熟练运用 match 提取、replace 替换、递归模板渲染三大实战技巧✅ 规避新手高频踩坑点写出规范、严谨、可上线的正则代码 学习建议正则不要死记硬背理解「逐字符匹配、规则约束」的核心思想就能适配各类表单校验、字符串处理场景 文末互动看完这篇相信你已经拿捏拼多多正则笔试核心考点大家如果遇到其他大厂正则真题、正则手写难题欢迎评论区留言交流一起刷题进阶✅ 掘金发布标签JavaScript正则表达式前端面试拼多多笔试前端基础❤️码字不易欢迎点赞收藏持续更新大厂前端笔试真题解析
[特殊字符] 拼多多大厂笔试题——正则表达式
前言正则表达式是拼多多、字节、阿里前端笔试最高频考点之一。很多同学JS基础不错但一遇到正则直接白给。✨ 本篇完全对标拼多多真实笔试原题从需求、规则、语法、代码、易错点全方位拆解零基础也能吃透正则核心轻松拿捏大厂笔试今天这篇完全对标拼多多真实笔试原题从需求、规则、语法、代码、易错点全方位拆解看完直接秒杀所有手机号正则面试题 一、真题 1手机号正则校验题目需求如何验证用户输入的手机号是正确的必须是11 位纯数字手机号必须以数字 1 开头第二位不能是 0、1、2前两位确定后后面必须跟随9 位数字✅核心原则永远不要相信用户的输入把用户当小白✅正则本质模式匹配 字符规则数学约束。✅真题标准答案letstr15188888898;// 描述一个匹配的规则// 一个字符一个字符的匹配//[] 表示匹配的字符范围//{n} 表示字符的长度//let reg /1[3-9][0-9]{9}/;letreg/^1[3-9]\d{9}$/;console.log(Object.prototype.toString.call(reg))console.log(typeof{});//类型 对象objectconsole.log(typeofreg);//类型 对象objectconsole.log(reg.test(str));//true//let str 13888888888;//console.log(reg.test(str)); //false//let str 138888888;少一个8//console.log(reg.test(str)); //false//let str 13888888888ss;$表示字符串的结束//console.log(reg.test(str)); //false//let str 13888888888ss;^表示字符串的开始✨考点解析/ element / ——正则表达式基本框架每次匹配一个字符1固定开头字符满足手机号以 1 开头/1/匹配第一个字符为1——————[3-9]限定第二位取值范围规避 0/1/2/1[3-9]/匹配第二个字符第二位取值范围:3-9——————\d{9}\d代表单个数字{9}代表精准匹配 9 次补齐末尾位数。/1[3-9]\d{9}/——————^匹配字符串起始位置$匹配字符串结束位置杜绝前后多出多余字符letstr13888888888ss;//一般//let reg /1[3-9][0-9]{9}/;//false// 有$letreg/1[3-9]\d{9}$/;//trueconsole.log(reg.test(str));//$表示字符串的结束letstraa13888888888;//一般//let reg /1[3-9][0-9]{9}/; //false//有^letreg/^1[3-9]\d{9}$/;//trueconsole.log(reg.test(str));//^表示字符串的开始❌ 新手常见错误写法笔试高频踩坑// 错误1没有加^ $会匹配到不完整号码constreg1/1[3-9]\d{9}/// 错误2第二位范围写错constreg2/^1[0-9]\d{9}$/// 错误3位数写死错误constreg3/^1[3-9]\d{8}$/ 二、正则表达式核心语法精讲笔试必背正则全称Regular ExpressionJS 正则固定格式/ 正则规则 /匹配逻辑一次只匹配一个字符逐位校验/ /正则包裹标识内部写匹配规则{}限定前面字符的匹配次数[]限定单个字符的取值范围\d匹配任意数字 0-9^匹配字符串开头$匹配字符串结尾 三、前置基础JS 数据类型笔试底层考点JS 数据类型分为两大派系正则操作字符串全部依赖这两类✨1. 基本类型值类型Number 数值类型String 字符串类型正则主要操作对象Boolean 布尔类型undefinednull✨2. 引用类型对象类型Object 普通对象Array 数组下标为数字索引的特殊对象 四、正则两大高频操作提取数字 替换字符✨1. 提取字符串中所有数字match 全局匹配 gmatch()字符串提取正则匹配内容g 修饰符global 全局匹配找到所有符合规则的内容不停止\d 代表匹配一次或多次可以提取连续数字conststr价格是100元,进价是80元,赚了20元;//匹配数字constreg/\d/g;//g表示全局匹配console.log(reg.test(str));//trueconstresstr.match(reg);console.log(res);//[100, 80, 20]✨2. 字符串正则替换replacereplace(正则, 新内容)批量替换字符串内容//干掉- w 改成 W大写conststrhello-world;// () 表示分组 不匹配() ,但是可以提取// $1表示提取第一个分组的内容constreg/-(\w)/;console.log(str.match(reg));//[-w, w]constresstr.replace(reg,(_,c){console.log(_,c,/////);returnc.toUpperCase();})console.log(res);//helloWorld步骤1. 正则 -(\w) 找到 -字母2. 分组 () 把后面的字母提取出来3. replace 回调里把字母变大写自动删除 -4. 最终hello-world → helloWorld️另一种constreshello-world.replace(/-(\w)/,(_,c){returnc.toUpperCase();})console.log(res);//helloWorld✨3. 进阶实战模板字符串正则渲染递归替换除了数字提取、字符替换正则递归替换也是笔试、项目开发高频用法常用于模板字符串插值渲染实现模板占位符批量替换为真实数据。需求场景通过正则匹配{{变量名}}占位符递归替换模板中所有变量实现数据动态渲染。// 模板字符串lettemplate我是{{name}}, 年龄{{age}}, 性别{{sex}};// 数据源对象letperson{name:张三,age:17,sex:男}// 正则模板渲染函数递归替换所有占位符functionrender(template,data){// 匹配 {{变量名}} 格式的占位符constreg/{{(\w)}}/// 判断是否存在可匹配的占位符if(reg.test(template)){// exec 获取匹配到的变量名constnamereg.exec(template)[1];// 替换当前匹配到的占位符templatetemplate.replace(reg,data[name])// 递归调用继续替换剩余占位符returnrender(template,data);}// 所有占位符替换完成返回最终字符串returntemplate;}// 输出结果我是张三, 年龄17, 性别男console.log(render(template,person));核心知识点解析/{{(\w)}}/专属模板占位符正则{{ }}匹配固定双大括号(\w)捕获括号内的变量名字母/数字/下划线exec()正则匹配方法可获取匹配结果及捕获组内容精准拿到变量名递归逻辑单次只替换一个占位符通过递归循环匹配直到模板中无任何占位符完美适配多变量模板无需g全局修饰符依靠递归实现全局替换是前端模板引擎的核心底层原理。 五、正则符号速查表面试直接背符号作用说明\d匹配任意单个数字 [0-9]\w匹配字母、数字、下划线匹配前面字符 1 次或多次*匹配前面字符 0 次或多次[]字符范围约束{n}精准匹配 n 次g全局匹配^ $首尾严格锁定 六、完整可直接上线的手机号校验工具函数// 拼多多笔试完整版封装函数 function checkPhoneNumber(phone) { const reg /^1[3-9]\d{9}$/ return reg.test(phone) } // 测试 console.log(checkPhoneNumber(13666666666)) // true console.log(checkPhoneNumber(12666666666)) // false 七、全文核心总结✨ 本篇围绕拼多多前端笔试核心正则考点从零拆解手机号正则校验核心逻辑、原生正则语法、三大实战用法覆盖笔试选择题、编程题、工程实战三大场景✅ 掌握手机号正则核心规则首尾锚点、范围匹配、精准位数约束✅ 吃透正则基础符号告别语法混淆、手写报错问题✅ 熟练运用 match 提取、replace 替换、递归模板渲染三大实战技巧✅ 规避新手高频踩坑点写出规范、严谨、可上线的正则代码 学习建议正则不要死记硬背理解「逐字符匹配、规则约束」的核心思想就能适配各类表单校验、字符串处理场景 文末互动看完这篇相信你已经拿捏拼多多正则笔试核心考点大家如果遇到其他大厂正则真题、正则手写难题欢迎评论区留言交流一起刷题进阶✅ 掘金发布标签JavaScript正则表达式前端面试拼多多笔试前端基础❤️码字不易欢迎点赞收藏持续更新大厂前端笔试真题解析
