title: Swap elements in array with various data types
body: <p>So I was looking around SO for an answer, and I did get some insight, but can't quite get to a desired solution. My issue is this:</p>
  
  <p>So I have a keypad with number 1 through 5, and when I select one of the number keys, it moves it to an array called <code>numberPad</code>, as an object, like so: </p>
  
  <pre class="lang-js prettyprint-override"><code>[
    { number: 1, alias: 'one', checked: true, option: 'Option for key 1' },
    { number: 4, alias: 'four', checked: true, option: 'Option for key 4' }
  ]
  </code></pre>
  
  <p>And then it renders each index of <code>numberPad</code> as a styled card, and each <code>number</code> is its own clickable dropdown button. When clicking on the rendered number, a separate list of buttons (* also 1 through 5*) becomes visible, and if, on that new list of buttons, a number is clicked that is not in the <code>numberPad</code> array, then that data is pushed to <code>numberPad</code>. If the number exists in <code>numberPad</code>, this where I need to make something happen...</p>
  
  <p>So let's say 1 and 4 are rendered, and I click on the number 4  to open the list of buttons. If I now select 1, since it is already in the data array, I want to swap just the <code>option</code> value between the two.</p>
  
  <p>So, I click on 4, the button list opens, and I click on 1, I want my array to look like this:</p>
  
  <pre><code>[
    { number: 1, alias: 'one', checked: true, option: 'Option for key 4' },
    { number: 4, alias: 'four', checked: true, option: 'Option for key 1' }
  ]
  </code></pre>
  
  <p>I am having some trouble getting there. I have seen many answers on SO about a swap function, but those seem to swap the entire index with another index, where as I only want to swap one key/value pair on a click.</p>
  
  <p>Does anyone have any advice here please...? Thanks in advance!!</p>