专栏首页YuanXin正则表达式

正则表达式

内容一览 ?:

  • 正则常见函数
  • 实现千分位标注
  • 全局匹配与lastIndex
  • 字符串第一个出现一次的字符

正则常见函数

正则表达式常用的方法分为 2 类:

  1. 字符串上调用,进行正则规则匹配。操作对象是正则表达式
  2. 正则表达式上调用。操作对象是字符串。

准备了下面代码:

const pattern = /runoob/gi; // 正则表达式
const str = "Visit Runoob!runoob"; // 待匹配字符串

字符串上调用的方法,常见的有:search/ match / replace

// Return: Number 代表搜索到的开始地址
console.log(str.search(/Runoob/i));

// Return: Array 匹配出来的所有字符串
console.log(str.match(/run/gi));

// Return: 新的string对象
console.log(str.replace(/visit/i, "visit"));

正则表达式对象上的方法,常见的有:test / exec

// Return: Boolean 代表是否符合匹配
console.log(pattern.test(str));

// Return: 找到第一个匹配的值,返回一个数组,存放着匹配信息
console.log(pattern.exec(str));

实现千分位标注

题目:实现千分位标注位,考虑小数、负数和整数三种情况。

sep参数是自定义的分隔符,默认是,

/**
 * 实现千分位标注位
 * @param {*} str 待标注的字符串
 * @param {*} sep 标注符号
 */
const addSeparator = (str = "", sep = ",") => {
    str += "";
    const arr = str.split("."),
        re = /(\d+)(\d{3})/;

    let integer = arr[0],
        decimal = arr.length <= 1 ? "" : `.${arr[1]}`;

    while (re.test(integer)) {
        integer = integer.replace(re, "$1" + sep + "$2");
    }

    return integer + decimal;
};

console.log(addSeparator(-10000.23)); // -10,000.23
console.log(addSeparator(100)); // 100
console.log(addSeparator(1234, ";")); // 1;234

全局匹配与lastIndex

题目:请说出下面代码执行结果(为了方便,我将结果注释在代码中了),并且解释。

const str = "google";
const re = /o/g;
console.log(re.test(str)); // true
console.log(re.test(str)); // true
console.log(re.test(str)); // false

由于使用的是全局匹配,因此会多出来lastIndex这个属性,打印如下:

const str = "google";
const re = /o/g;

console.log(re.test(str), re.lastIndex); // true 2
console.log(re.test(str), re.lastIndex); // true 3
console.log(re.test(str), re.lastIndex); // false 0

简单理解就是:同一个全局匹配的正则对同一个目标串匹配后,匹配过的部分串将不再匹配。

字符串第一个出现一次的字符

题目:字符串中第一个出现一次的字符

利用字符串的match方法匹配指定字符:

const find_ch = str => {
    for (let ch of str) {
        const re = new RegExp(ch, "g");
        // 检查每个字符的匹配数量
        if (str.match(re).length === 1) {
            return ch;
        }
    }
};
// 输出答案是 l
console.log(find_ch("google"));

除了上述方法,使用indexOf/lastIndexOf同样可以:

const find_ch = str => {
    for (let ch of str) {
        if (str.indexOf(ch) === str.lastIndexOf(ch)) {
            return ch;
        }
    }
};
// 输出答案是 l
console.log(find_ch("google"));

扫码关注「心谭博客」, 专注前端与算法

目前已有前端面试、剑指Offer·JS、动画设计、Webpack等系列专题

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 【架构设计】领悟微内核+插件化的代码设计之美

    在阅读内部名字服务的源码时,看到了微内核+插件化的设计实现,非常有利于功能的横向扩展。本文以开源的 tcb-admin-node.js 库的扩展功能为例,记录下...

    心谭博客
  • 【剑指offer:在排序数组中查找数字】搜索左右边界:从两边向中间、二分查找

    二分查找一般用来查找数字在有序数组中是否出现过。进一步想,它可以用来不断在子序列中搜索对应数字。所以,我们就可以用它来向左边子序列中不断搜索,确认左边界;同样的...

    心谭博客
  • 【剑指offer:和为s的两个数字】双指针

    题目描述:输入一个递增排序的数组和一个数字 s,在数组中查找两个数,使得它们的和正好是 s。如果有多对数字的和等于 s,则输出任意一对即可。

    心谭博客
  • 苹果中国员工涉嫌贩卖用户数据,高考机器人失利,数学仅得105分 | 大数据24小时

    数据猿导读 苹果“后院起火”,22名中国员工涉嫌非法贩卖用户数据被捕;高考机器人首战告负,AI+教育还有很长一条路要走;DT平台及服务提供商数梦工场获7.5亿元...

    数据猿
  • 20181202_ARTS_week23

    ES6: Understanding the destructuring assignment syntax in Javascript

    Bob.Chen
  • Vue项目使用AES做加密

    用户1174387
  • “西瓜书”——第二章_模型评估与选择

    习题 注: 其中: 真正例(TP)【好的西瓜,模型认为是好瓜】 假正例(FP)【坏的西瓜,模型认为是好瓜】 假反例(FN)【好的西瓜,模型认为是坏瓜】 真...

    YingJoy_
  • 线程概念简介 什么是线程 多线程上篇(七)

    在20世纪 60年代人们提出了进程的概念后,在OS中一直都是以进程作为能拥有资源和独立运行的基本单位的。

    noteless
  • 12个提高 JavaScript 技能的概念!

    JavaScript 是一种复杂的语言。如果是你是高级或者初级 JavaScript 开发人员,了解它的基本概念非常重要。本文介绍 JavaScript 至关重...

    前端小智@大迁世界
  • ES6系列_8之函数和数组

    ES6为我们提供了这样的解构赋值使在前后端分离时,后端返回来JSON格式的数据,前端可以直接把这个JSON格式数据当作参数,传递到函数内部进行处理。比如:

    wfaceboss

扫码关注云+社区

领取腾讯云代金券