合并多个替换文本

Question

我想通过javascript将英语翻译成越南语：

var text = 'Name, Password and ConfirmPassword';
var _text = text.replace('Name', 'Tên đại diện')
                .replace(/Password|ConfirmPassword/g, 'Mật khẩu');

我的问题：还有另一种方法可以将2 replace压缩为1吗？

就像：

var text = 'Name, Password and ConfirmPassword';
var _text = text.replace(/(Name)|(/Password|Confirmpassword/g)/, ???);

Answer 1

使用回调可以返回不同的东西，具体取决于匹配正则表达式的哪个部分

var _text = text.replace(/Password|ConfirmPassword|Name/g, function(m) {
    if ( m === 'Name' ) return 'Tên đại diện';
    return 'Mật khẩu';
});

Answer 2

如果您需要几种语言或者只是想简化代码，我会使用json对象来保存翻译，只需用翻译来更改元素的文本，而不是处理许多正则表达式替换。

＆＃13;

＆＃13;

// language translations. this objects key is the element selector
var translations = {
  '#welcome' : {
    english: 'Hello',
    vietnamese: 'chào bạn',
    thai: 'สวัสดี',
    afrikaans: 'Goeie dag'
  },
  '#password' : {
    english: 'Please enter your password',
    vietnamese: 'Vui lòng nhập mật khẩu của bạn',
    thai: 'กรุณาใส่รหัสผ่านของคุณ',
    afrikaans: 'gee jy jou wagwoord'
  },
  '.submit': {
    english: 'Submit',
    vietnamese: 'đệ trình',
    thai: 'ส่ง',
    afrikaans: 'Indien'
  }
};

/**
 * translate a string based on the translations hash object
 *
 * this function will find an element based on the selector and change
 * it's text or placeholder to the selected language
 *
 * @param {string}    language    language to translate text to
 */
function translate( language ){
  return function( e ){
    for( var key in translations ){
      var el = document.querySelector( key ),
          translation = translations[ key ][ language ];
      
      if( el.placeholder ){
        el.placeholder = translation;
      }
      else if( el.value ){
        el.value = translation;
      }  
      else {
        el.innerHTML = translation;
      }
    }
  }  
}

// get all the required elements
var 
  english    = document.querySelector('#translate-english'),
  vietnamese = document.querySelector('#translate-vietnamese'),
  thai       = document.querySelector('#translate-thai'),
  afrikaans  = document.querySelector('#translate-afrikaans');

// bind the events to the language buttons
      thai.addEventListener('click', translate('thai'), false);
   english.addEventListener('click', translate('english'), false);
 afrikaans.addEventListener('click', translate('afrikaans'), false);
vietnamese.addEventListener('click', translate('vietnamese'), false);

＆＃13;

<button id="translate-english">english</button>
<button id="translate-vietnamese">Vietnamese</button>
<button id="translate-thai">Thai</button>
<button id="translate-afrikaans">afrikaans</button>

<h3><span id="welcome">hello</span> stackoverflow</h3>
<input type="password" id="password" placeholder="Please enter your password" />
<input type="submit" class="submit" value="Submit" />

＆＃13;

＆＃13;

＆＃13;