如何在 JavaScript 中转换数字，以及使用 Tel 输入删除键盘上非数字字符的命令问题

Question

遵循这个答案在JavaScript中转换数字的解决方案和正确方法是什么？

现在，我尝试使用此方法将电话号码字段中的数字转换为电话输入类型。

function toEnglishDigits(str) {
  const persianNumbers = ["۱", "۲", "۳", "۴", "۵", "۶", "۷", "۸", "۹", "۰"]
  const arabicNumbers = ["١", "٢", "٣", "٤", "٥", "٦", "٧", "٨", "٩", "٠"]
  const englishNumbers = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0"]

  return str.split("").map(c => englishNumbers[persianNumbers.indexOf(c)] ||
    englishNumbers[arabicNumbers.indexOf(c)] || c).join("")
}

但我发现了一个问题，需要帮助。 我也在我的函数中使用了这部分代码

// Remove non-numeric characters
var numericPhoneValue = convertedValue.replace(/[^0-9]/g, '');

我认为与数字٤，٥，٦u200d冲突，因为也许这些数字不是正常的阿拉伯语，也许吃东方阿拉伯语！印度和类似的东西。

但是，在此条件之前（删除非数字字符）。我首先使用以下内容，优先级更高。

var convertedValue = toEnglishDigits(currentPhoneValue);

当在任何其他命令和条件（例如（删除非数字字符））之前将字符转换为英文时； 不应再有干扰，也不应有转变。如果有任何干扰或问题。为什么只有这三个数字是这样，其余的数字都没有问题？

看，我们只允许使用数字 0 到 9

var numericPhoneValue = convertedValue.replace(/[^0-9]/g, '');

，其他所有内容都应该删除。

然后，为了不拒绝用波斯语和阿拉伯语输入的数字，我们来了，把数字转换成英文的说明。在需要做其他事情之前。

为什么英语/波斯语和阿拉伯语的任何数字在转换时没有任何问题，但只是不转换 ٤,٥,٦u200d nums？我该怎么办以及如何解决问题？

我使用其他方法，例如

var numericPhoneValue = convertedValue.replace(/[^\d0-90-9]/g, '');

或

var numericPhoneValue = convertedValue.replace(/[^0-9\u0660-\u0669\u06F0-\u06F9]/g, '');

，或偶数

var numericPhoneValue = convertedValue.replace(/[^\d0-90-94-6]/g, '');

还有这个！

var numericPhoneValue = convertedValue.replace(/\D/g, '');

但这没有任何区别，除了隐藏（删除）之外；他们将不再从战场上消失。他们留在现场，但没有皈依，而皈依对他们来说又不起作用！

最后一件事 当我使用这段代码来转换数字时。这三个数字被接受并转换，对他们来说没有问题。除了这个;其他功能均无法正常工作。

var currentPhoneValue = phoneField.val();

// Convert Persian and Arabic digits to English using the shared utility function
var convertedValue = convert_number.toNormal(currentPhoneValue);

var convert_number = (function () {
    var numerals = {
        persian: ["۰", "۱", "۲", "۳", "۴", "۵", "۶", "۷", "۸", "۹"],
        arabic: ["٠", "١", "٢", "٣", "٤", "٥", "٦", "٧", "٨", "٩"]
    };

    return {
        toNormal: function (str) {
            if (!str) {
                return '';
            }
            var num, i, len = str.length, result = "";

            for (i = 0; i < len; i++) {
                num = numerals["persian"].indexOf(str[i]);
                num = num != -1 ? num : numerals["arabic"].indexOf(str[i]);
                if (num == -1) num = str[i];
                result += num;
            }
            return result;
        }
    }
}

var numericPhoneValue = convertedValue.replace(/[^0-9]/g, '');

为什么？另外，我不想使用这个功能。因为我觉得它又老又慢。我将要使用的在问题开头编写的函数更好更快。但这些问题确实存在，我不知道如何解决。

Answer 1

我不知道这是否能解决您的问题，但我会从正确处理 Unicode 字符串开始。

您当前的代码存在一些问题，让我们从以下开始：

string.split("")

摘自

split()

文档：

警告：当使用空字符串（

""

）作为分隔符时，该字符串不会被用户感知的字符（grapheme）分割 簇）或 unicode 字符（代码点），但采用 UTF-16 代码 单位。这会破坏代理对。请参阅“如何获得 在 JavaScript 中将字符串转换为字符数组？”在 StackOverflow。

类似地，使用

string.length

将返回 UTF-16 代码单元的数量。它不返回用户感知的字符数量。这同样适用于

string[index]

也将访问 UTF-16 代码单元。它不访问索引

index

处的用户感知字符。

要正确处理 Unicode 字符，您应该使用 string iterator 将字符串转换为数组。迭代器由

Array.from(string)

、扩展语法

[...string]

、

for..of

循环使用。

或者，您可以通过添加

u

(Unicode) 标志来使正则表达式识别 Unicode。

---

根据上述解释，我建议您从以下操作开始：

1. 确保将

   u

   标志添加到正则表达式中，这样它就不会破坏代理对。
2. 使用

   Array.from(string)

   、

   [...string]

   、

   string.split(/(?:)/u)

   （带有

   u

   标志的空正则表达式，

   (?:)

   是必需的，因为

   //

   是注释）根据用户感知的字符拆分字符串。
3. 不要使用string.length

   、

   string[index]

   ，首先使用上述选项之一将其拆分为字符数组。然后遍历数组，而不是字符串。

我不知道这些建议是否能解决您的问题，但它减少了可能发生的问题的数量。这可能会使实际问题更容易调试。