title: Why does __proto__ not update when prototype is set to null
body: <p>I've been trying to learn the differences between the <code>.__proto__</code> and the <code>.prototype</code> properties. From what I have read, the <code>.__proto__</code> property is available on instances, which points to a reference of the protoype object that was used to construct it. With that in mind, I pictured it behaving something like so:</p>
  <p><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>let prototype = {};
  let proto = prototype;
  prototype = null;
  console.log(prototype); // null (expected)
  console.log(proto); // {} (expected)</code></pre>
  </div>
  </div>
  </p>
  <p>When I set <code>prototype</code> to <code>null</code>, the <code>proto</code> variable still holds a reference to the original <code>prototype</code> object, so the last log prints <code>{}</code> as expected, this is how I currently understand the below code to function, and prints out the expected result:</p>
  <p><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>function Foo() {
    this.x = 1;
  }
  
  Foo.prototype = null; // same as prototype = null above
  const obj = new Foo();
  console.log(obj.__proto__); // still points to default object (expected, based on above snippet behaviour)</code></pre>
  </div>
  </div>
  </p>
  <p>However, with the above in mind, what confuses me why does assigning the prototype also change <code>__proto__</code>. When we assigned <code>.prototype</code> to a new object reference , shouldn't <code>__proto__</code> keep hold of the previous object it was refering and not change to the new object?</p>
  <p><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>function Foo() {
    this.x = 1;
  }
  
  Foo.prototype = {y: 2}; // same as prototype = null above
  const obj = new Foo();
  console.log(obj.__proto__); // expected {}, but instead got {y: 2}</code></pre>
  </div>
  </div>
  </p>
  <p>Why isn't the above <code>.__proto__</code> pointing to the original prototype object (like it does in the second code snippet), but instead pointing to the newly assinged <code>prototype</code> object?</p>