title: Could someone explain this code to me? Concerning conditionally disabling inputs
body: <p><strong>Update:</strong>
  What exactly is the filter part of the checkedCount expression doing? I understand that we are getting the property names from state and calculating the length, but what is the filter portion doing?  When I remove it, everything works until &quot;disabled&quot; becomes true.  Then it will not go back to false.</p>
  <p><strong>Original</strong>
  I am trying to accomplish what the <a href="https://stackoverflow.com/a/51717797/11420464">accepted answer</a> to <a href="https://stackoverflow.com/q/51717752/11420464">this question</a> is doing: rendering a number of checkboxes that disables any unchecked boxes after a certain number is reached.  I was able to use what is posted to solve my problem, but I am not sure of what all is going on.</p>
  <p>I understand that an array of inputs is being rendered, and their keys are being set to this.state.checked in order to toggle checked or unchecked. I understand that when checkedCount is greater than 1, the inputs are then disabled. I am a bit confused on the details though.  Would someone be able to break down what is going on? I'd like to wrap my head around this.</p>
  <pre><code>class App extends React.Component {
    state = { checked: {} };
  
    onSelectedChange = index =&gt; {
      this.setState(previousState =&gt; ({
        checked: {
          ...previousState.checked,
          [index]: !previousState.checked[index]
        }
      }));
    };
  
    render() {
      const { checked } = this.state;
      const checkedCount = Object.keys(checked).filter(key =&gt; checked[key]).length;
      const disabled = checkedCount &gt; 1;
  
      return (
        &lt;div&gt;
          {Array.from({ length: 5 }, (_element, index) =&gt; (
            &lt;input
              key={index}
              onChange={() =&gt; this.onSelectedChange(index)}
              type=&quot;checkbox&quot;
              checked={checked[index] || false}
              disabled={!checked[index] &amp;&amp; disabled}
            /&gt;
          ))}
        &lt;/div&gt;
      );
    }
  }
  
  ReactDOM.render(&lt;App /&gt;, document.getElementById(&quot;root&quot;));
  </code></pre>