如果语句不那么混乱,如何制作JavaScript呢?

时间:2014-03-13 00:51:32

标签: javascript

如果语句不那么混乱,我怎样才能做出以下其他内容?

var visas = ["Blue-Collar Worker", "Business", "Foreign Student", "Internship", "Investment", "Joining Foreign Family", "Joining Minors", "Joining Taiwanese Family", "Studying Mandarin Chinese", "Tourism", "Visa-Exempt Entry", "Visiting Family", "Religious Work", "White-Collar Worker"];

var visaOld = $('#inputVisaOld').val(); var visaNew = $('#inputVisaNew').val();

if (visaOld === 'Studying Mandarin Chinese' && visaNew === 'Foreign Student') {
  return '<div class="alert alert-info">Documents for FR -> FS</div>'; 
} else if (visaOld === 'Visa-Exempt Entry' && visaNew === 'White-Collar Worker') {
  return '<div class="alert alert-info"><a class="alert-link">Visitor Visa for Employment Purpose</a></div>'; 
} else if (visaOld === 'Tourism' && visaNew === 'Joining Taiwanese Family') {
  return '<div class="alert alert-info">Documents for P -> TS</div>'; 
} else {
  return '<div class="alert alert-danger">Not allowed to change</div>'; 
}

我考虑将其转换为switch语句,但我需要在每个块中声明语句,我认为switch不可能这样做?

3 个答案:

答案 0 :(得分:1)

这有点整洁

var myString = '<div class="alert alert-info">';
var visaOld = $('#inputVisaOld').val(); var visaNew = $('#inputVisaNew').val();
if (visaOld === 'Studying Mandarin Chinese' && visaNew === 'Foreign Student') {
  myString += 'Documents for FR -> FS'; 
} else if (visaOld === 'Visa-Exempt Entry' && visaNew === 'White-Collar Worker') {
  myString += 'Visitor Visa for Employment Purpose'; 
} else if (visaOld === 'Tourism' && visaNew === 'Joining Taiwanese Family') {
  myString += 'Documents for P -> TS'; 
} else {
  myString += 'Not allowed to change'; 
}
myString += '</div>';
return myString;

答案 1 :(得分:1)

您可能更喜欢使用switch(true)构造:

switch (true) {
  case (visaOld === 'Studying Mandarin Chinese' && visaNew === 'Foreign Student'):
    return '<div class="alert alert-info">Documents for FR -> FS</div>';
    break;
  case (visaOld === 'Visa-Exempt Entry' && visaNew === 'White-Collar Worker'):
    return '<div class="alert alert-info"><a class="alert-link">Visitor Visa for Employment Purpose</a></div>';
    break;
  case (visaOld === 'Tourism' && visaNew === 'Joining Taiwanese Family'):
    return '<div class="alert alert-info">Documents for P -> TS</div>';
    break;
  default:
    return '<div class="alert alert-danger">Not allowed to change</div>';
    break;
}

答案 2 :(得分:1)

另一种方法是使用javascript的对象查找。不适用于所有情况,但如果您需要在大型表中快速查找,则此方法将比if / else-if块或交换机的长结构更快,因为它是哈希表查找。

// setup a table
var changes = {};
changes[['Studying Mandarin Chinese', 'Foreign Student']] =
    '<div class="alert alert-info">Documents for FR -> FS</div>';
changes[['Visa-Exempt Entry', 'White-Collar Worker']] =
    '<div class="alert alert-info"><a class="alert-link">Visitor Visa for Employment Purpose</a></div>';
changes[['Tourism', 'Joining Taiwanese Family']] =
    '<div class="alert alert-info">Documents for P -> TS</div>';

// do the lookup
return changes[[visaOld, visaNew]] ||
    '<div class="alert alert-danger">Not allowed to change</div>';