javascript - JS Variable 将其他变量拉入其中

Question

我知道这个问题的标题似乎含糊不清 - 但那是因为我根本不知道如何恰本地总结它。

我正在做一个项目，我在其中输入一些文本，然后它被翻译成其他东西。

有一个 fiddle here .

如果我输入 4，它会转换为单词 for。

如果我输入 b4，它应该转换为 before。

相反，它转换为 bfor，因为它将变量 4 捕获为一个单独的变量。

我试过更改顺序，但没有用。这是正则表达式问题吗？

我的变量在JS中标识。

var replaceValues = {
    '4' : 'for',
    'b4' : 'before'
}

$('.bs-text').keyup(function (event) {
    newText = event.target.value;
    for (var txt in replaceValues) {
        var temp = new RegExp(txt, 'gim');
        newText = newText.replace(temp, replaceValues[txt]);
    }
    $('.human-text').text(newText);
});

Answer 1

正如我在评论中指出的那样，JS 对象没有定义其键的顺序，因此当您知道字典会变得更大时，依赖它并不是一个好主意。

在另一个 SO 问题中有更多相关信息:Does JavaScript Guarantee Object Property Order?

相反，使用具有您定义的顺序的简单数组。这个字典数组的排序也可以在JS中完成，你不需要自己处理。

var replaceValues = [
  {key: '4', value: 'for'},
  {key: 'b4', value: 'before'},
];

// sort the values so longer keys go first
replaceValues.sort((a, b) => b.key.length - a.key.length);

$('.bs-text').keyup(function (event) {
    var newText = event.target.value;
    for (var txt in replaceValues) {
        var replacement = replaceValues[txt];
        var temp = new RegExp(replacement.key, 'gim');
        newText = newText.replace(temp, replacement.value);
    }
    $('.human-text').text(newText);
});

你也可以使用 ES6 Map，它应该有顺序保证。但请注意，仅从 Object 创建 Map 是不够的:

A Map object iterates its elements in insertion order — a for...of loop returns an array of [key, value] for each iteration.

It should be noted that a Map which is a map of an object, especially a dictionary of dictionaries, will only map to the object's insertion order—which is random and not ordered.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map#Objects_and_maps_compared