將箭頭 function 更改為正常 function？

Question

我有一個簡單的 function 使用箭頭 function 播放上一個視頻

這是我的解決方案

  $('#interactive-layers').on('click', ".go_back", function () {
        videohistory.pop();
        var hist = videohistory[videohistory.length - 1];
        videohistory.pop();


        if (hist[0].movieid == 4) {

            let movieData = movies.find(({
                movieid
            }) => movieid == 23);
            hist.push(movieData);
            playVideo(hist[3], hist[1], hist[2]);
        } else {
            playVideo(hist[0], hist[1], hist[2]);
        }
    });

這在 chrome、safari、firefox 中工作正常，但在 Internet Explorer 中，我收到以下錯誤。

SCRIPT1003: Expected ':'

如何更改此 function 使其與所有瀏覽器兼容？

Answer 1

嘗試這個，

$('#interactive-layers').on('click', ".go_back", function () {
        videohistory.pop();
        var hist = videohistory[videohistory.length - 1];
        videohistory.pop();

        if (hist[0].movieid == 4) {

            // Here I change the Arrow function with the es5 normal one.
            /*
               let movieData = movies.find(({ movieid }) => movieid == 23);
             */
            let movieData = movies.find(function(movieid){
              return movieid == 23;
            });
            hist.push(movieData);
            playVideo(hist[3], hist[1], hist[2]);
        } else {
            playVideo(hist[0], hist[1], hist[2]);
        }
    });

Answer 2

您需要將其轉換為普通的function而不是箭頭 function。 但請記住，您在array.find()中使用了參數解構，因此您需要在轉換時正確處理它，如下所示：

let movieData = movies.find(function(entry) { return entry.movieid == 23; });

另外，我不會使用let來確保它可以在所有 IE 瀏覽器上運行。 MDN 聲明它對 IE 有部分支持，所以...使用var來支持所有 IE 瀏覽器。

上面提到的另一件事是 IE 不支持array.find()本身，所以需要導入一個polyfill