title: Accessing a boolean property of an object in javascript always returns false?
body: <p>I'm losing my mind. I have an array of objects called <code>allAvailabilities</code></p>
  <pre><code>console.log(allAvailabilities[0]);
  </code></pre>
  <p>results in a object with various properties, one of which is:</p>
  <pre><code>...
  isTrainee: true
  ...
  </code></pre>
  <p>but</p>
  <pre><code>console.log(allAvailabilities[0]['isTrainee']);
  console.log(allAvailabilities[0].isTrainee);
  </code></pre>
  <p>results in</p>
  <pre><code>false
  false
  </code></pre>
  <p>I'm not understanding what is preventing me from accessing the actual <code>isTrainee</code> value of the object property:</p>
  <pre><code>console.log(typeof(allAvailabilities[0]['isTrainee']));
  console.log(typeof(allAvailabilities[0].isTrainee));
  console.log(allAvailabilities[0]['isTrainee'].toString());
  console.log(allAvailabilities[0].isTrainee.toString());
  </code></pre>
  <p>results in:</p>
  <pre><code>boolean
  boolean
  false
  false
  </code></pre>
  <p>How is this possible? Am I overlooking a fundamental piece of Javascript syntax? Does this have to do with the <code>Boolean</code> class as described here:
  <a href="https://stackoverflow.com/questions/8695341/why-does-new-booleanfalse-equals-false-in-javascript">Why does !new Boolean(false) equals false in JavaScript?</a></p>
  <p><a href="https://i.stack.imgur.com/kQDy6.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/kQDy6.png" alt="enter image description here" /></a></p>
  <p>The snippet works fine, what does this mean?
  <div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var allAvailabilities = [{_id: '605a5dd76f007e84f28e35fd', begin: '2021-04-03T18:00:00.000Z', end: '2021-04-03T20:30:00.000Z', season: 'regular', hostModel: 'users', isTrainee: true, season: "regular"}];
  
  
              console.log(allAvailabilities[0]);
              console.log(typeof(allAvailabilities[0]['isTrainee']));
              console.log(typeof(allAvailabilities[0].isTrainee));
              console.log(allAvailabilities[0]['isTrainee'].toString());
              console.log(allAvailabilities[0].isTrainee.toString());</code></pre>
  </div>
  </div>
  </p>
  <p>How can this be?
  <a href="https://i.stack.imgur.com/fDEr1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fDEr1.png" alt="enter image description here" /></a></p>
  <p>The original <code>allAvailabilities</code> array comes from an API, and each object in the array is modified to have the <code>isTrainee</code> property like so, immediately before calling the code I am having problems with:</p>
  <p><a href="https://i.stack.imgur.com/9X8jB.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/9X8jB.png" alt="enter image description here" /></a></p>