Переопределить функцию с помощью функции в Javascript

Question

Вот скрипт, который делает некоторые вещи, но самое главное, он постоянно меняет значение inDynamicEditMode от 0 до 1 и от 1 до 0. Я пытаюсь создать функция, которая переопределит функцию payx(), если inDynamicEditMode - 0 (или 1). Я отправляю весь скрипт на случай, если я удалю что-то важное.

var start = 0.01 

var $input = $("#oddsInput") 
var $odds = $("#oddsOverUnder") 
var $button = $("#roll") 
var $bet = $("#bet") 
var $pay = $("#oddsPayout.btn.btn-primary.btn-xlg.btn-block") 
var inDynamicEditMode = true; 

function basex() { 
    $bet.val(start) 
} 

function timesx() { 
    var lol = document.getElementById('bet').value; 
    $bet.val(lol * 8) 
} 

function paylowx() { 
    $pay.click() 
    document.getElementById("oddsInput").value = "1.2"; 
    $odds.click() 
} 

function payhighx() { 
    $pay.click() 
    document.getElementById("oddsInput").value = "5.2"; 
    $odds.click() 
} 

function payx(){ 

} 

var mars = document.createElement('div'); 

mars.innerHTML = '' + 
    '<div class="form-group">' + 
    '<div class="text-center col-sm-6 col-sm-offset-3">' + 
    '<input id="base" type="button" value="BASE" onClick="basex()">' + 
    '<input id="times" type="button" value="x8" onClick="timesx()">' + 
    '<input id="paylow" type="button" value="1.2" onClick="paylowx()">' + 
    '<input id="payhigh" type="button" value="5.2" onClick="payhighx()">' + 
    '</div>' + 
    '</div>'; 
document.getElementsByClassName('text-center col-sm-6 col-sm-offset-3')[0].appendChild(mars); 

var mybase = document.querySelector("#base"); 
mybase.style.backgroundColor = "#131313"; 
mybase.style.borderStyle = "none"; 
mybase.style.borderRadius = "6px 0px 0px 0px" 
mybase.style.color = "#fff" 
mybase.style.fontSize = "18px" 
mybase.style.width = "80px" 
mybase.style.height = "40px" 

var mytimes = document.querySelector("#times"); 
mytimes.style.backgroundColor = "#131313"; 
mytimes.style.borderStyle = "none"; 
mytimes.style.borderRadius = "0px 6px 0px 0px" 
mytimes.style.color = "#fff" 
mytimes.style.fontSize = "18px" 
mytimes.style.width = "80px" 
mytimes.style.height = "40px" 

var mypaylow = document.querySelector("#paylow"); 
mypaylow.style.backgroundColor = "#131313"; 
mypaylow.style.borderStyle = "none"; 
mypaylow.style.borderRadius = "0px 0px 0px 6px" 
mypaylow.style.color = "#fff" 
mypaylow.style.fontSize = "18px" 
mypaylow.style.width = "80px" 
mypaylow.style.height = "40px" 

var mypayhigh = document.querySelector("#payhigh"); 
mypayhigh.style.backgroundColor = "#131313"; 
mypayhigh.style.borderStyle = "none"; 
mypayhigh.style.borderRadius = "0px 0px 6px 0px" 
mypayhigh.style.color = "#fff" 
mypayhigh.style.fontSize = "18px" 
mypayhigh.style.width = "80px" 
mypayhigh.style.height = "40px" 

var myhalf = document.querySelector("#halfBetButton"); 
myhalf.style.display = "none" 

var mydouble = document.querySelector("#doubleBetButton"); 
mydouble.style.display = "none" 


function roll() { 
    $bet.val(start) 
    $button.click() 
    setTimeout(function() { 

     var tr = document.querySelector("#myBetsTable tr:nth-child(2)") 
     var cls = tr.getAttribute('class') 

     if (cls === 'success'){ 
      payx() 
     } 
     else{ 
      payx() 
      inDynamicEditMode ^= true 
     } 
      $button.click(); 
    setTimeout(function() { 
      $button.click(); 
      },1000); 
      },1000); 
} 

setInterval(roll, 2000) 

Вот две функции

 if(inDynamicEditMode == 0){ 
      function payx() { 
      $pay.click() 
      document.getElementById("oddsInput").value = "1.2"; 
      $odds.click() 
     } 

     if(inDynamicEditMode == 1){ 
      function payx() { 
      $pay.click() 
      document.getElementById("oddsInput").value = "5.2"; 
      $odds.click() 
     } 

Answer 1

Вы можете объявить функцию как переменную.

// Therefore 
payx = function() { 
    // script 
} 
payx(); 

В коде

if (inDynamicEditMode == 0) { 
    payx = function() { 
    $pay.click() 
    document.getElementById("oddsInput").value = "1.2"; 
    $odds.click() 
    } 
} 

if(inDynamicEditMode == 1){ 
    payx = function() { 
    $pay.click() 
    document.getElementById("oddsInput").value = "5.2"; 
    $odds.click() 
    } 
} 

Если и спросить, почему вы должны сделать это, он эффективен при вызове функции часто.

Answer 2

Ну, для начала, можно определить одну payx() функцию, которая принимает параметр inDynamicEditMode в качестве аргумента, например так:

function payx(inDynamicEditMode) { 
    if (inDynamicEditMode === 0) { 
    // do stuff 
    } 
    if (inDynamicEditMode === 1) { 
    // do some other stuff 
    } 
} 

В качестве альтернативы, вы можете просто присвоить выражение функции для payx() как так:

// somewhere above 
var payx = function() { 
    // do stuff, maybe default? 
}; 

if (inDynamicEditMode === 0) { 
    payx = function() { 
    // do stuff 
    }; 
} 

if (inDynamicEditMode === 1) { 
    payx = function() { 
    // do other stuff 
    }; 
} 

в приведенном выше примере необходимо будет вызываться каждый раз, когда вы подозреваете изменения в inDynamicEditMode.

Answer 3

Почему бы не использовать одну функцию (без переопределения) и использовать тройной оператор внутри этой функции, чтобы определить, какое значение для назначения:

function payx() { 
    $pay.click(); 
    document.getElementById("oddsInput").value = inDynamicEditMode ? "5.2" : "1.2"; 
    $odds.click(); 
}