Функция refactor javascript

Question

:) Я создал javascript, он хорошо работает, мои знания javascript ограничивают меня созданием компактного и легкого скрипта. это некоторые подменит Javascript рамок ASPX, вот это это сценарий:

if (name === 'diensten/consultancy') 
      { 
       activeOne(); 
      } 
    else if (name === 'diensten/maatwerk') 
      { 
       activeTwo(); 
       diesntenActive(); 
      } 
    else if (name === 'diensten/outsourcing') 
      { 
       activeThree(); 
       diesntenActive(); 
      } 
    else if (name === 'diensten/opleidingen') 
      { 
       activeFour(); 
       diesntenActive(); 
      } 
    else if (name === 'diensten/implementaties') 
      { 
       activeFive(); 
       diesntenActive(); 
      } 
    else if (name === 'support') 
      { 
       activeOne(); 
       supportActive(); 
      } 
    else if (name === 'support/contact') 
      { 
       activeTwo(); 
       supportActive(); 
      } 
    else if (name === 'support/download') 
      { 
       activeThree(); 
       supportActive(); 
      } 
    else if (name === 'overOns') 
      { 
       activeOne(); 
       overOnsActive() 
      } 
    else if (name === 'overOns/cebes') 
      { 
       activeTwo(); 
       overOnsActive() 
      } 
    else if (name === 'overOns/partner') 
      { 
       activeThree(); 
       overOnsActive(); 
      } 
    else if (name === 'overOns/vacatures') 
      { 
       activeFour(); 
       overOnsActive(); 
      } 
    else if (name === 'fireman') 
      { 
       productenActive(); 
      } 
    else if (name === 'prio') 
      { 
       productenActive(); 
      } 
    else if (name === 'firstwatch') 
      { 
       productenActive(); 
      } 
    else if (name === 'firstwatchOnline') 
      { 
       productenActive(); 
      } 
    else if (name === 'cebesFrame') 
      { 
       productenActive(); 
      } 
    else if (name === 'cms') 
      { 
       productenActive(); 
      } 
    return false 

Я уверен, что есть способ, чтобы сократить этот JavaScript, не слишком срочный, просто дайте мне больше знаний о JavaScript. Любое предложение приветствуется. Благодарю.

Answer 1

Старт должен был бы использовать инструкцию switch вместо длинного дерева if/else.

switch (name) { 
    case 'diensten/consultancy': 
    activeOne(); 
    break; 

    case 'diensten/maatwerk': 
    activeTwo(); 
    diesntenActive(); 
    break; 

    ... 

    case 'cms': 
    productActive(); 
    break; 

    default: 
    console.log ("No handler found for '" + name + "'!"); 
} 

Альтернативный метод заключается в использовании object в котором определяются функции и связать их с соответствующими ключами.

var func_map = { 
    'diensten/consultancy': function() { 
    activeOne(); 
    }, 

    'diensten/maatwerk': function() { 
    activeTwo(); 
    diesntenActive(); 
    }, 

    'diensten/outsourcing': function() { 
    activeThree(); 
    diesntenActive(); 
    }, 

    ... 

    'cms': function() { 
    productenActive(); 
    } 
}; 

if (name in func_map) func_map[name](); 
else console.log ("No handler found for name = '" + name + "'!"); 

Answer 2

У вас идеальная ситуация для справочной таблицы. У вас есть целая куча возможностей для имени, и ваши действия для каждого имени - это всего лишь один или несколько простых вызовов функций.

Это означает, что вы можете использовать таблицу поиска. Вы указываете значение для имени в качестве ключа и массив имен функций для вызова этого имени. Один поиск в таблице дает вам набор функций для вызова, и вы перебираете массив для вызова каждого из них. Это имеет то преимущество, что, чтобы добавить больше деталей, вы просто добавить новую строку в таблицу без написания каких-либо дополнительных строк кода:

var lookup = { 
    "cms": [productenActive], 
    "cebesFrame": [productenActive], 
    "firstWatchOnline": [productenActive], 
    "fireman": [productenActive], 
    "firstwatch": [productenActive], 
    "prio": [productenActive], 
    "overOns/vacatures": [activeFour, overOnsActive], 
    "overOns/partner": [activeThree, overOnsActive], 
    "overOns/cebes": [activeTwo, overOnsActive], 
    "overOns": [activeOne, overOnsActive], 
    "support/download": [activeThree, supportActive], 
    "support/contact": [activeTwo, supportActive], 
    "support": [activeOne, supportActive], 
    "diensten/implementaties": [activeFive, diesntenActive], 
    "diensten/opleidingen": [activeFour, dienstenActive], 
    "dienstenout/outsourcing": [activeThree, dienstenActive], 
    "diensten/maatwerk": [activeTwo, dienstenActive], 
    "diensten/consultancy": [activeOne] 
}; 

var fns = lookup[name]; 
if (fns) { 
    for (var i = 0; i < fns.length; i++) { 
     fns[i](); 
    } 
} 

Answer 3

Вот моя попытка. Это не самое лучшее в том, что оно очень специализировано для вашего дела. Однако он обеспечивает много динамических вызовов и повторного использования кода.

var subPage = { 
    'diensten' : ['consultancy', 'maatwerk', 'outsourcing', 'opleidingen', 'implementaties'], 
    'support' : [undefined, 'contact', 'download'], 
    'overOns' : [undefined, 'cebes', 'partner', 'vacatures'], 
} 
var others = ['fireman', 'prio', 'firstwatch', 'firstwatchOnline', 'cebesFrame', 'cms']; 
var active = [activeOne, activeTwo, activeThree, activeFour, activeFive]; 

var addr = name.split('/'); 
if (subPage[addr[0]]){ 
    var index = subPage[addr[0]].indexOf(addr[1]); 
    if (index != -1){ 
     active[index](); 
     if (addr[1] !== 'consultancy') // Special case 
      this[adder[0]+'Active'](); // Assuming this refers to the scope where diesntenActive() lives 
    } 
} else if (others.indexOf(addr[0]) != -1){ 
    productenActive(); 
} 
return false; 

В любом случае, это, вероятно, слишком усложняет ситуацию. Я бы порекомендовал вам либо использовать оператор switch, либо таблицу поиска, если вы действительно не заботитесь о сокращении размера вашего скрипта. Только в этом случае вы можете рассмотреть мой очень специализированный подход.