Використання `window.location.hash.includes` кидає" Об'єкт не підтримує властивість або метод "включає" "в IE11

Я перевіряю URL-адресу, щоб побачити, чи містить вона чи містить ?у ній, щоб контролювати хеш-поп-стан у вікні. Усі інші браузери не мають проблеми, лише IE.

Відладчик дає мені цю помилку, коли я намагаюся завантажувати таким чином:

Об'єкт не підтримує властивість чи метод ' includes'

Я не отримую помилок, коли завантажую сторінку через popstate.

    $(document).ready(function(e) {
        if(window.location.hash) {
            var hash;
            if(window.location.hash.includes("?")) {
                alert('I have a ?');
                hash = window.location.hash.substring(window.location.hash.indexOf('#') + 0,window.location.hash.indexOf('?'));
            }else {
                hash = window.location.hash;
            };
            if (hash=="#DRS" || hash=="#DRP" || hash=="#DFFI" || hash=="#DCI" || hash=="#DCP" || hash=="#DRP" || hash=="#DRMA" || hash=="#EICS" || hash=="#ORG"){
                $(hash+'Content').addClass('pageOn').removeClass('pageOff');
            }else {
                $('#homeContent').addClass('pageOn').removeClass('pageOff');
            };
        } else {
            $('#homeContent').addClass('pageOn').removeClass('pageOff');
        }
        $(window).on('popstate', function() {
            var hash;
            if(window.location.hash.includes("?")) {
                hash = window.location.hash.substring(window.location.hash.indexOf('#') + 0,window.location.hash.indexOf('?'));
            }else {
                hash = window.location.hash;
            };
            if (hash=="#DRS" || hash=="#DRP" || hash=="#DFFI" || hash=="#DCI" || hash=="#DCP" || hash=="#DRP" || hash=="#DRMA" || hash=="#EICS" || hash=="#ORG"){
                $(this).navigate({target: $(hash+'Content')});
                if(window.location.hash.includes("?")) {
                }else{
                    location.href = location.href+'?';
                }
            }else {
                $(this).navigate({target: $('#homeContent')});
            };
        });
});

Згідно довідкової сторінки MDN , includesвін не підтримується в Internet Explorer. Найпростіша альтернатива - це використовувати indexOf:

if(window.location.hash.indexOf("?") >= 0) {
    ...
}

IE11 реалізує String.prototype.includes, так чому б не використовувати офіційний Polyfill?

  if (!String.prototype.includes) {
    String.prototype.includes = function(search, start) {
      if (typeof start !== 'number') {
        start = 0;
      }

      if (start + search.length > this.length) {
        return false;
      } else {
        return this.indexOf(search, start) !== -1;
      }
    };
  }

Джерело: джерело поліфункції

Додавання import 'core-js/es7/array';до моєї polyfill.tsвирішеної проблеми для мене.

У мене був аналогічний випуск із проектом Angular. У моєму polyfills.ts мені довелося додати обидва:

    import "core-js/es7/array";
    import "core-js/es7/object";

На додаток до всіх інших за замовчуванням IE 11. (Дивіться коментарі в polyfills.ts, якщо використовуєте кутовий)

Після додавання цього імпорту помилка усунулася, і дані моїх об’єктів заповнилися за призначенням.

Як і в Internet Explorer, метод javascript "включає" не підтримує, що призводить до помилки, як показано нижче

dijit.form.FilteringSelect TypeError: Об'єкт не підтримує властивість або метод "включає"

Таким чином, я змінив рядовий метод JavaScript з "включає" на "indexOf", як показано нижче

//str1 doesn't match str2 w.r.t index, so it will try to add object
var str1="acd", str2="b";
if(str1.indexOf(str2) == -1) 
{
  alert("add object");
}
else 
{
 alert("object not added");
}

Я використав, includesз Lodashякого насправді схожий на рідний.

Я використовую ReactJs і використовую import 'core-js/es6/string';на початку, index.jsщоб вирішити свою проблему.

Я також використовую import 'react-app-polyfill/ie11';для підтримки запуску React в IE11.

react-app-polyfill

Цей пакет включає полізаповнення для різних браузерів. Він включає мінімальні вимоги та часто використовувані мовні функції, які використовуються проектами Create React App.

https://github.com/facebook/create-react-app/blob/master/packages/react-app-polyfill/README.md

Це запитання та його відповіді привели мене до власного рішення (за допомогою SO), хоча деякі кажуть, що ви не повинні підробляти власні прототипи:

  // IE does not support .includes() so I'm making my own:
  String.prototype.doesInclude=function(needle){
    return this.substring(needle) != -1;
  }

Тоді я просто замінив все .includes()на .doesInclude()і моя проблема була вирішена.