一个索引依赖于 Java 脚本中的另一个索引

Question

我正在为移动 window 设计自定进度的阅读实验制作一个函数，其中输入一个句子，一个函数将所有字母替换为破折号。然后参与者点击句子，发现第一个 word/region；下一次点击时，第二个 word/region 被揭开，前一个 word/region 再次被破折号覆盖，依此类推，直到句子结束。下面是我的 replaceWithdash 函数代码，以实现此目的。

function replaceWithdash(sentenceList, currentWordNumber) {
var index, result, word, lett, reslett;
result = "";
index = 0;
while ((index < sentenceList.length)) {
    word = sentenceList[index];
    if ((index !== currentWordNumber)) {
          result = ((result + ("-".repeat(word.length))) + " "); 
    } else {
        result = ((result + word) + " ");
    }
    index = (index + 1);
    lett = Sentence.charAt(index);
    reslett = result.charAct(index);
    if (lett === " ") {
        result = (reslett.replace("-"," "));
        } else {
        result = (reslett);
        }
    }
return result;
}

我遇到的问题是虚线句的显示。第一个 ifelse 函数基本上是说，如果您不在当前单词上，则用破折号替换单词的长度（在 'sentenceList' 中分隔，然后在 'word' 中定义）。如果您在当前单词上，则按原样显示该单词。因此逐字显示如下： Input = The dog ate the food

--- --- --- ----
*click*
The --- --- ----
*click*
--- dog --- ----

等等。我面临的问题（因此需要 'lett' 和 'reslett' 变量）是我不想逐字显示，而是想逐区域显示。这些区域可以包含多个单词。所以在上面的例子中，第一个 region 将是 'the dog' 而不仅仅是 'the'。为了分隔字符串以便在单击时正确显示，我只是将输入更改为 'The dog, ate, the food' 并使用逗号作为分隔 sentenceList 的分隔符。然而，这会产生这样的结果：

------- --- --------
*click*
The dog --- --------

如您所见，显示是正确的，因为第一个区域比第一个单词显示的更准确，但 replaceWithdash 函数正在读取单词之间的 spaces 作为字符，因此破折号显示不正确并且没有看到 space（所以看起来句子中有 3 个单词而不是 5 个）。作为避免这种情况的一种方法，我尝试使用变量 'lett' 和 'reslett' 创建另一个 if 语句，它们在原始句子和虚线句子（'result'). if-else 的意思是：如果句子中的字符索引是 space，则结果虚线句子中的相同字符索引（因为它们的长度相同）被替换为 space.如果字符不是 space，那么就保持结果不变，即破折号。所以，在上面的句子中，通过 charAt(0)-charAt(3)，破折号应该保留，但是一旦你点击 charAt(4)，'result' 现在应该用 space 替换那个破折号。除了自学之外，我对 Java 脚本知之甚少，所以我认为我的代码在这里可能有点偏离，因为它实际上并没有工作。我需要的显示是这样的：

--- --- --- --- ----
*click*
The dog --- --- ----

使用此代码，它只是将所有破折号替换为 spaces（因此显示没有任何内容），所以这里有问题，有什么想法吗？

Answer 1

如果我没理解错的话，这就是你要找的，或者，对吧？

function replaceWithdash(sentenceList, currentWordNumber) {
    const regions = sentenceList.split(",")
    const sigil = regions.map(s => s.replaceAll(/[^\s]/g, "-"))
    if (currentWordNumber !== undefined) {
        sigil.splice(currentWordNumber, 1, regions[currentWordNumber])
    }
    return sigil.join("")
}

str = "The dog, ate, the food"

console.log(replaceWithdash(str))
//"--- --- --- --- ----"

console.log(replaceWithdash(str, 0))
//"The dog --- --- ----"

console.log(replaceWithdash(str, 1))
//"--- --- ate --- ----"

console.log(replaceWithdash(str, 2))
// "--- --- --- the food"

一个索引依赖于 Java 脚本中的另一个索引

One index is dependent on another index in Java Script

javascript

indexing

for-loop

if-statement

embedding