код не работает в IE 11, отлично работает в Chrome

Question

Следующий код может работать без проблем в Chrome, но выдает следующее сообщение об ошибке в Internet Explorer 11.

Объект не поддерживает свойство или метод 'startsWith'

Я сохраняю идентификатор элемента в переменной. В чем проблема?

function changeClass(elId) { 
 
    var array = document.getElementsByTagName('td'); 
 
    
 
    for (var a = 0; a < array.length; a++) { 
 
    var str = array[a].id; 
 
    
 
    if (str.startsWith('REP')) { 
 
     if (str == elId) { 
 
     array[a].style.backgroundColor = "Blue"; 
 
     array[a].style.color = "white"; 
 
     } else { 
 
     array[a].style.backgroundColor = ""; 
 
     array[a].style.color = ""; 
 
     } 
 
    } else if (str.startsWith('D')) { 
 
     if (str == elId) { 
 
     array[a].style.backgroundColor = "Blue"; 
 
     array[a].style.color = "white"; 
 
     } else { 
 
     array[a].style.backgroundColor = ""; 
 
     array[a].style.color = ""; 
 
     } 
 
    } 
 
    } 
 
}

<table> 
 
    <tr> 
 
    <td id="REP1" onclick="changeClass('REP1');">REPS</td> 
 
    <td id="td1">&nbsp;</td> 
 
    </tr> 
 
    <tr> 
 
    <td id="td1">&nbsp;</td> 
 
    <td id="D1" onclick="changeClass('D1');">Doors</td> 
 
    </tr> 
 
    <tr> 
 
    <td id="td1">&nbsp;</td> 
 
    <td id="D12" onclick="changeClass('D12');">Doors</td> 
 
    </tr> 
 
</table>

Answer 1

String.prototype.startsWith является стандартным методом в последней версии JavaScript, ES6.

Посмотрите на таблицу совместимости ниже, мы видим, что она поддерживается на всех современных основных платформах, кроме версий Internet Explorer.

╔═══════════════╦════════╦═════════╦═══════╦═══════════════════╦═══════╦════════╗ 
║ Feature ║ Chrome ║ Firefox ║ Edge ║ Internet Explorer ║ Opera ║ Safari ║ 
╠═══════════════╬════════╬═════════╬═══════╬═══════════════════╬═══════╬════════╣ 
║ Basic Support ║ 41+ ║  17+ ║ (Yes) ║ No Support  ║ 28 ║  9 ║ 
╚═══════════════╩════════╩═════════╩═══════╩═══════════════════╩═══════╩════════╝ 

Вы должны реализовать .startsWith себя. Вот polyfill:

if (!String.prototype.startsWith) { 
    String.prototype.startsWith = function(searchString, position) { 
    position = position || 0; 
    return this.indexOf(searchString, position) === position; 
    }; 
} 

Answer 2

text.indexOf("newString") является лучшим методом вместо startsWith.

Пример:

var text = "Format"; 
if(text.indexOf("Format") == 0) { 
    alert(text + " = Format"); 
} else { 
    alert(text + " != Format"); 
} 

Answer 3

Если это происходит в угловых приложении 2+, вы можете просто раскомментировать струнные polyfills в polyfills.ts:

import 'core-js/es6/string'; 

Answer 4

Как уже сказал StartsWith и endWith являются частью ES6 и недоступны в IE11. Наша компания всегда использует библиотеку lodash в качестве решения для многоуровневых приложений для IE11. https://lodash.com/docs/4.17.4

_.startsWith([string=''], [target], [position=0]) 

Answer 5

Добавление ниже код в JS файл работал для меня:

if (!String.prototype.startsWith) { 
    String.prototype.startsWith = function(searchString, position) { 
    position = position || 0; 
    return this.indexOf(searchString, position) === position; 
    }; 
} 

Answer 6

Хотя пост Оки работает прекрасно, это может быть немного устарели. Я понял, что lodash может решить его с помощью одной функции. Если у вас установлен lodash, это может сэкономить вам несколько строк.

Просто попробуйте:

import { startsWith } from lodash; 

. . .

if (startsWith(yourVariable, 'REP')) { 
     return yourVariable;   
    return yourVariable; 
     }  
    }