title: JavaScript - Is it a bad practice to override a function by adding it to the last loaded external script?
body: <p>I have a JavaScript function that is triggered when clicking a button that is included in a partial view that is common to all pages of the website. What I would like is, when I'm on page "D" the function has to perform a different operation. What's the best practice to do that? </p>
  
  <p>What I tried was to add a second external script for that page and include the function with the same name but different operations, then call the script AFTER the main script.</p>
  
  <p>Partial View</p>
  
  <pre><code>&lt;button id="btnSubmit" onclick="buttonClicked()"&gt; Submit &lt;/button&gt;
  </code></pre>
  
  <p>When I'm on pages "A", "B", "C", the function have to perform like this:</p>
  
  <pre><code>//JavaScript common file across all 3 pages:
  function buttonClicked()
  {
  console.log(5);
  }
  </code></pre>
  
  <p>When I'm on page "D" the function have to perform like this:</p>
  
  <pre><code>//JavaScript new file that is only used on Page D:
  function buttonClicked()
  {
  console.log(10);
  }
  </code></pre>
  
  <p>This is just a simple example. The functionality is much more complex and the website is already operational . Is this a bad practice? Right now it works fine, but is it possible that it will cause any issues(e.g different browsers)?</p>
  
  <p>Thanks</p>