Почему функция tableRender() возвращает undefined?

Есть публичный метод tableRender(arr), он получает на вход массив значений товаров и рендерит по нему таблицу. Вообще функция tableRender() ничего не возвращает, она просто манипулирует с DOM, создает элементы и вставляет в них значения переданного массива.

При фильтрации по значениям в инпуте, если строка поиска становится пустой выводится правильное количество товаров, но все значения в ячейках undefined. В чем дело? В других случаях когда я передаю в эту функцию глобальную переменную с массивом значений товаров, то все выводится без проблем.

Переменные this.searchArr и this.discardedArr берутся из функции фильтрации this.filtering(). При этом если убрать self. перед переменной, то вообще ничего не выведется. alert(self.returnedArr) внутри oninput выводит все правильно, переменная не undefined. Все переменные внутри функции имеют значения, ни одна из них не равна undefined.

let self = this;
let filter = document.querySelector('input.filter');
filter.value = '';
this.returnedArr = [];                            
filter.oninput = function(event) {                  
    self.returnedArr = self.searchArr.concat(self.discardedArr);     
    if (event.target.value === '') {                                               
        self.tableRender(self.returnedArr);  //undefined. Как исправить?
    }
};