biu biu biu coding

正则表达式的兼容问题

javascript
字数统计: 195阅读时长: 1 min
2021/06/23 Share

RegExp Lookbehind 反向定言 兼容

ES9 RegExp Lookbehind Assertions

问题描述

修改公共方法以用支持省略小数位多余的零，这里使用的是正则。上线后反馈用户使用safari浏览器打不开页面。

正则方法如下

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
import NP from 'number-precision';

function formatPercent(num, type: FormatPercentType = 'multiply', decimal = 2) {
    if (num === 0 || num === '0') {
        return '0%';
    }

    if (!!(num * 1)) {
        return (type === 'multiply'
            ? `${NP.times(num, 100).toFixed(decimal)}%`
            : type === 'divide'
            ? `${NP.divide(num, 100).toFixed(decimal)}%`
            : `${num.toFixed(decimal)}%`
        ).replace(/(?<=\.\d*)(0+)(?=%)|(\.0+)(?=%)/, '');
    }

    return EMPTY;
}

问题分析

chrome浏览器运行

运行是正常的
$attrs

safari浏览器运行

发现报错
$attrs

这是因为?<=和?<! 这类反向定言正则属于ES9阶段。目前兼容性还不是很好，babel也不能处理这个情况。

$attrs

原文作者：Febcat

原文链接：https://febcat.github.io/2021/06/23/bugfix/

发表日期：June 23rd 2021, 2:52:19 pm

更新日期：June 23rd 2021, 4:26:21 pm

版权声明：本文采用知识共享署名-非商业性使用 4.0 国际许可协议进行许可

CATALOG
  1. 1. RegExp Lookbehind 反向定言 兼容
    1. 1.1. 问题描述
    2. 1.2. 问题分析
      1. 1.2.1. chrome浏览器运行
      2. 1.2.2. safari浏览器运行
Total : 7
2021
2020
2019
git javascript React SSR Vue webpack settings
bugfix web server