为什么我只在readyState为4时得到响应？

Question

我做了一个简单的例子，其中我试图将响应打印到<div>的HTML中，因为状态从2变为4.但不知何故，我只得到了响应4.为什么？

function func() {
  var xhr = new XMLHttpRequest();

  xhr.onreadystatechange = function() {
    if (this.readyState == 2) {
      document.getElementById("resp").innerHTML = "Response 2";
    } else if (this.readyState == 3) {
      document.getElementById("resp").innerHTML = "Response 3";
    } else(this.readyState == 4) {
      document.getElementById("resp").innerHTML = "Response 4 : " + this.responseText;
    }

  }
  xhr.open("GET", "back.php", true);
  xhr.send();
}

<div id="resp"></div>
<input type="submit" onclick="func()" name="name" value="name" id="name">