将箭头 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