title: reading image as arraybuffer using uint8 and uint16 array
body: <p>Here is a piece of code to check the uploaded image mime type by checking for desired <strong><em>magic number</em></strong>(i still don't understand them clearly yet). when i supply the blob file to uint8Array it works, the array populates. But if i use uint16array it gives an error. What might be the reason for this error. It says invalid argument. </p>
  
  <p>I have two question on this topic.</p>
  
  <p><strong><em>1. why i can't i use uint16array instead uint8array ?</em></strong></p>
  
  <p><strong><em>2. i read wikipedia. But it contains lots of technical stuff. Can you shed some light on 'magic number' so that i can understand what it really is(in a nutshell)</em></strong></p>
  
  <p><a href="https://i.stack.imgur.com/XYg5c.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XYg5c.png" alt="enter image description here"></a></p>
  
  <pre><code>var upload=document.getElementById('upload');
  upload.addEventListener('change',function(e){
  
  
  
      if(window.File &amp;&amp; window.FileReader &amp;&amp;  window.FileList){
  
                      var file=e.target.files[0];
                      console.log(file.type);
  
                      var fileReader=new FileReader();
  
                      fileReader.onload= function(e){
                               var arr = (new Uint8Array(e.target.result));
  
                               console.log(arr);
                               var arr2=(new Uint16Array(e.target.result));
                               console.log(arr2);
  
                      };
               fileReader.readAsArrayBuffer(file);
               }else{
                   alert('file api not compatible with your browser');
               }  
  
      });
  </code></pre>