Question

我正在编写一个JavaScript翻译器，但在写了几个字之后，我意识到这将需要永远，特别是如果我想要做超过20个单词。有没有办法让这个脚本更短，所以我可以让用户输入更多的单词而不用花太多时间为超过20个变量添加翻译过程。
下面的脚本获取文本框的内容，将其分隔为变量，确保未定义任何变量，并在将已翻译的内容放回文本框之前对每个单词进行单独的翻译过程。我没有包含HTML，因为它并不重要。
所以，我的问题是，如何缩短这个脚本，以便能够翻译更多的单词而不用花费我余生的时间。

/* The Translator */

function myFunction() {  //yeah I gotta use funtion myFunction... I lack creativity
var x = document.getElementById("translateinput").value;


//splitting the string into variables
var w1 = x.split(" ")[0];
var w2 = x.split(" ")[1];
var w3 = x.split(" ")[2];
var w4 = x.split(" ")[3];
var w5 = x.split(" ")[4];
var w6 = x.split(" ")[5];
var w7 = x.split(" ")[6];
var w8 = x.split(" ")[7];
var w9 = x.split(" ")[8];
var w10 = x.split(" ")[9];
var w11 = x.split(" ")[10];
var w12 = x.split(" ")[11];
var w13 = x.split(" ")[12];
var w14 = x.split(" ")[13];
var w15 = x.split(" ")[14];
var w16 = x.split(" ")[15];
var w17 = x.split(" ")[16];
var w18 = x.split(" ")[17];
var w19 = x.split(" ")[18];
var w20 = x.split(" ")[19];

 //making sure nothing is undefined in case the string is less than 20 words
 if (typeof w1 == "undefined") {
w1 = ""
  }
 if (typeof w2 == "undefined") {
      w2 = ""
 }
 if (typeof w3 == "undefined") {
     w3 = ""
 }
 if (typeof w4 == "undefined") {
     w4 = ""
 }
 if (typeof w5 == "undefined") {
     w5 = ""
 }
 if (typeof w6 == "undefined") {
     w6 = ""
 }
 if (typeof w7 == "undefined") {
     w7 = ""
 }
 if (typeof w8 == "undefined") {
     w8 = ""
 }
 if (typeof w9 == "undefined") {
     w9 = ""
 }
 if (typeof w10 == "undefined") {
     w10 = ""
 }
 if (typeof w11 == "undefined") {
    w11 = ""
 }
 if (typeof w12 == "undefined") {
     w12 = ""
 }
 if (typeof w13 == "undefined") {
     w13 = ""
 }
 if (typeof w14 == "undefined") {
     w14 = ""
 }
 if (typeof w15 == "undefined") {
     w15 = ""
 }
if (typeof w16 == "undefined") {
     w16 = ""
 }
 if (typeof w17 == "undefined") {
     w17 = ""
 }
 if (typeof w18 == "undefined") {
     w18 = ""
 }
 if (typeof w19 == "undefined") {
     w19 = ""
 }
 if (typeof w20 == "undefined") {
     w20 = ""
 }

 //The translation process
 if (w1 === "word1")
 {
    var w1 = "word2"
 }
 if (w2 === "word1")
 {
     var w2 = "word2"
 }
 if (w3 === "word1")
 {
    var w3 = "word2"
 }
 if (w4 === "word1")
 {
    var w4 = "word2"
 }
 if (w5 === "word1")
 {
    var w5 = "word2"
 }
 if (w6 === "word1")
 {
    var w6 = "word2"
 }
 if (w6 === "word1")
 {
    var w6 = "word2"
 }
 if (w7 === "word1")
 {
     var w7 = "word2"
 }
 if (w8 === "word1")
 {
    var w8 = "word2"
 }
 if (w9 === "word1")
  {
    var w9 = "word2"
 }
 if (w10 === "word1")
 {
     var w10 = "word2"
 }
 if (w11 === "word1")
 {
    var w11 = "word2"
 }
 if (w12 === "word1")
 {
     var w12 = "word2"
 }
 if (w13 === "word1")
 {
    var w13 = "word2"
 }
 if (w14 === "word1")
{
    var w14 = "word2"
 }
 if (w15 === "word1")
{
     var w15 = "word2"
}
 if (w16 === "word1")
{
    var w16 = "word2"
 }
 if (w17 === "word1")
{
    var w17 = "word2"
  }
  if (w18 === "word1")
{
    var w18 = "word2"
 }
 if (w19 === "word1")
 {
    var w19 = "word2"
  }
 if (w20 === "word1")
 {
    var w20 = "word2"
 }


//resulting translated string
 var result = w1 + " " + w2 + " " + w3 + " " + w4 + " " + w5 + " " + w6 + " " + w7 + " " + w8 + " " + w9 + " " + w10 + " " + w11 + " " + w12 + " " + w13 + " " + w14 + " " + w15 + " " + w16 + " " + w17 + " " + w18 + " " + w19 + " " + w20


//places final result back into text box
   document.getElementById("translateinput").value = result;
}

Answer 1

如果要将字符串中所有出现的单词替换为另一个单词，可以使用内置的String.replace（）函数：

x.replace('word1', 'word2')    // replaces only one occurrence    
x.replace(/word1/gi, 'word2'); // replaces all occurrences (needs a regular expression)

如果你需要用拆分词做其他事情，那么你可以循环一个数组：

var words = x.split(" ");
for (var w in words) {
    console.log(words[w]);
    // do other stuff with the word here.
}

有关详细信息，请参阅Mozilla docs。

Answer 2

您可以阅读JavaScript中的数组并了解循环使用

以下是您可能对该功能进行的更改

将转换映射保留在js对象
中
trans_obj = {＆＃34; word1＆＃34;：＆＃34; word11＆＃34; ，＆＃34; word2＆＃34;：＆＃34; word22＆＃34;}
不是按空格分割文本而是存储在不同的变量中，您可以直接使用数组
使用map翻译数组的每个元素并稍后加入数组

<强> Implementaion

＆＃13;

function translate(str) {
  var tr = {
    word1: "word11",
    word2: "word22",
    word3: "word33",
    hello: "holla"
  };
  var str_list = str.split(/\s/);
  for (var i = 0; i < str_list.length; i++) {
    str_list[i] = tr[str_list[i]] || str_list[i];
  }
  return str_list.join(" ");
}

console.log(translate("word1 is neither word2 nor word3"));
console.log(translate("hello world1"));

＆＃13;

您也可以使用正则表达式，这里是正则表达式实现

正则表达式实施

＆＃13;

function translate(str) {
  var mapObj = {
    word1: "word11",
    word2: "word22",
    word3: "word33",
    hello: "holla"
  };

  var re = new RegExp(Object.keys(mapObj).join("|"), "gi");

  return str.replace(re, function(matched) {
    return mapObj[matched.toLowerCase()];
  });
}


console.log(translate("word1 is neither word2 nor word3"));
console.log(translate("hello world1"));

＆＃13;

我怎样才能缩短这个翻译脚本？

2 个答案: