Document
  • return function(e)裡的e是甚麼
  • for迴圈{}後的(file)是什麼意思
  • reader.readAsDataURL(file);為甚麼是放在最後面
  • evt所接收到的是change事件嗎?
  • for迴圈的三個部份:`for(宣告變數及其初始值表示式 ; 迴圈結束條件表示式 ; 每次迴圈結束時要做的運算表示式) {...}` 迴圈結束條件表示式是依照最後運算結果是true還是false來判斷,在本例就是file變數的值。當i的值超過files陣列大小時,file變數的值就是undefined,undefined轉換成布林值就是false,所以就跳出迴圈。

    <input type="file"> 選擇檔案後,產生 change 事件。
    因此 function handleFileSelect(evt) 的 evt 會有該事件的相關資訊
    evt.target 代表事件發生的元素,也就是 <input type="file"> 本身
    所以 evt.target.files 會是一個類似陣列(array like)的資料
    裡面的每個元素 (evt.target.files[i]) 代表選擇的其中一個檔案
    所以你問的 file 就是 evt.target.files[i]

  • reader.readAsDataURL(file);為甚麼是放在最後面
  • 這是非同步處理的狀況,javascript 常常會遇到非同步處理
    (例如 setTimeout、ajax 等)
    這時我們會先告訴程式(員工)說「當你完成了XXX之後,要做些甚麼」(reader.onload=....)
    然後才說「我說完了,去做你的工作吧」(reader.readAsDataURL)

  • evt所接收到的是change事件嗎?
  • 是,剛剛第 2 點提到了。