Сколько JavaScript перестает работать, когда в какой-либо строке браузера появляется ошибка? - PullRequest
0 голосов
/ 09 сентября 2018

JS на веб-странице состоит из нескольких тегов, которые загружают файлы и исполняют их или выполняют код непосредственно в случае встроенных тегов. Теперь, если предположить, что один из них прекращает выполнение в определенной строке из-за ошибки, другие сценарии также останавливаются? Другими словами, действие браузера по приостановке интерпретации и выполнения фрагмента кода при возникновении ошибки выполняется на уровне тегов или на глобальном уровне?

1 Ответ

0 голосов
/ 09 сентября 2018

Другими словами, действие браузера по приостановке интерпретации и выполнения фрагмента кода при возникновении ошибки выполняется на уровне тега или на глобальном уровне?

Это зависит.

Синтаксические ошибки означают, что весь скрипт, загруженный данным тегом script, не будет работать, поскольку код не может быть проанализирован.

Ошибки времени выполнения только означает, что все, что происходило, когда произошла ошибка, будет прервано (если оно не обработало ошибку).Но только задание, которое активно выполнялось при возникновении ошибки, прекращается;другой код, загруженный этим же тегом script, продолжит работать.

Пример: в этом коде есть синтаксическая ошибка, поэтому ни один из кодов не работает:

document.getElementById("btn").addEventListener("click", function() {
  console.log("Clicked");
}, false);

// This is the syntax error:
if
Clicking this button doesn't do anything:
<br><input type="button" id="btn" value="Click me">

При этом возникает ошибка runtime между подключением первого обработчика события и подключением второго.Как следствие, второй обработчик никогда не подключается, но первый продолжает работать:

document.getElementById("btn1").addEventListener("click", function() {
  console.log("Button 1 clicked");
}, false);

// This is the runtime error:
null.foo();

document.getElementById("btn2").addEventListener("click", function() {
  console.log("Button 2 clicked");
}, false);
<div>Clicking this button works:</div>
<input type="button" id="btn1" value="Button 1">

<div>Clicking this button doesn't do anything:</div>
<input type="button" id="btn2" value="Button 2">

В обоих случаях это влияет только на код, загруженный этим элементом script, потому что выполнение этого задания;запуск содержимого любого последующего элемента script является новым заданием.Таким образом, кнопки первая и третья здесь работают, а вторая - нет, потому что третья подключена отдельным заданием:

<div>Clicking this button works:</div>
<input type="button" id="btn1" value="Button 1">

<div>Clicking this button doesn't do anything:</div>
<input type="button" id="btn2" value="Button 2">

<div>Clicking this button works:</div>
<input type="button" id="btn3" value="Button 3">

<script>
// First job
document.getElementById("btn1").addEventListener("click", function() {
  console.log("Button 1 clicked");
}, false);

// This is the runtime error:
null.foo();

document.getElementById("btn2").addEventListener("click", function() {
  console.log("Button 2 clicked");
}, false);
</script>

<script>
// Second job
document.getElementById("btn3").addEventListener("click", function() {
  console.log("Button 3 clicked");
}, false);
</script>

Конечно, если последующие script опирались на что-то в более ранних script, которые не работали, ну, это не будет работать правильно - нокод будет (пытаться) работать.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...