Что означает ошибка: TypeError: ‘undefined’ is not an object — Журнал «Код» программирование без снобизма

Ситуация: вы пишете скрипт, в котором вам нужно выяснить расстояние от верха экрана до начала нужного элемента. У этого элемента есть класс .entry-content, и вы используете jQuery, чтобы достучаться до него:

// …
var dh;
dh = $('.entry_content').offset().top;

После запуска скрипта браузер выдаёт ошибку:

❌ TypeError: ‘undefined’ is not an object

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

Что это значит: браузер при виде точки понимает, что перед ним — объект, у которого есть какие-то свойства. Эта ошибка означает, что вы пытаетесь обратиться к свойствам несуществующего объекта.

Когда встречается: когда программист делает опечатки в имени объекта, неправильно объявляет его или начинает работать с чем-то, что точно не объект.

В нашем примере программист неправильно указал имя раздела при вызове, и вот что произошло:

Браузер знает, что на странице есть элемент с классом entry-content, который написан через дефис.
Программист увлёкся и поставил знак подчёркивания вместо дефиса.
Скрипт попытался найти этот класс, но не смог, поэтому вернул значение undefined.
После этого команда стала выглядеть так: dh = undefined.offset().top, но undefined.offset() — это не объект, а что-то неопределённое, у которого нет свойства top.
Браузер выдаёт ошибку, что вообще-то это не объект и работать с ним он не будет.

Что делать с ошибкой TypeError: ‘undefined’ is not an object

Эта ошибка означает, что вы пытаетесь использовать как объект то, что им не является. Чтобы исправить эту ошибку, проверьте:

нет ли у вас опечаток в именах и названиях (скорее всего);
правильно ли вы определили нужный объект;
в jQuery нужно будет дополнительно проверить, не теряется ли значение this или $ при использовании внутри функции;
есть ли внутри вашей переменной или объекта вообще что-нибудь, с чем можно работать.

$ is not defined в jQuery: что это значит и что делать

Попробуйте сами

У вас есть страница с элементом <h1 id="text-test"></h1> и JavaScript-кодом. При повторном запуске анимации он падает с нашей ошибкой. Попробуйте выяснить, почему так происходит.

document.addEventListener('DOMContentLoaded', function (event) {
  var dataText = ["Test", "Hello", "Salut", "Bonjour"];
  function typeWriter(text, i, fnCallback) {
    if (i < (text.length)) {
      document.getElementById("text-test").innerHTML = text.substring(0, i + 1) + '<span aria-hidden="true"></span>';
      setTimeout(function () {
        typeWriter(text, i + 1, fnCallback)
      }, 100);
    }
    else if (typeof fnCallback == 'function') {
      setTimeout(fnCallback, 700);
    }
  }
  function StartTextAnimation(i) {
    if (typeof dataText[i] == 'undefined') {
      setTimeout(function () {
        StartTextAnimation(0);
      }, 10000);
    }
    // ВОТ ТУТ ОШИБКА ↓
    if (i < dataText[i].length) {
      typeWriter(dataText[i], 0, function () {
        StartTextAnimation(i + 1);
      });
    }
  }
  StartTextAnimation(0);
});