how does url createobjecturl differ from filereader

1const fileSelect = document.getElementById("fileSelect"),
2    fileElem = document.getElementById("fileElem"),
3    fileList = document.getElementById("fileList");
4
5fileSelect.addEventListener("click", function (e) {
6  if (fileElem) {
7    fileElem.click();
8  }
9  e.preventDefault(); // prevent navigation to "#"
10}, false);
11
12fileElem.addEventListener("change", handleFiles, false); 
13
14function handleFiles() {
15  if (!this.files.length) {
16    fileList.innerHTML = "<p>No files selected!</p>";
17  } else {
18    fileList.innerHTML = "";
19    const list = document.createElement("ul");
20    fileList.appendChild(list);
21    for (let i = 0; i < this.files.length; i++) {
22      const li = document.createElement("li");
23      list.appendChild(li);
24      
25      const img = document.createElement("img");
26      img.src = URL.createObjectURL(this.files[i]);
27      img.height = 60;
28      img.onload = function() {
29        URL.revokeObjectURL(this.src);
30      }
31      li.appendChild(img);
32      const info = document.createElement("span");
33      info.innerHTML = this.files[i].name + ": " + this.files[i].size + " bytes";
34      li.appendChild(info);
35    }
36  }
37}
38