Почему TypeError?
list1
list2
list3
Изменить цвет!function Manipulate (idBtn, idUl){
this.btn = document.getElementById(idBtn) ;
this.ul = document.getElementById(idUl);
};
Manipulate.prototype.clicked = function(){
this.btn.onclick = function(){
console.log('Onclick working!'); // working!
this.ul.style.color = 'red'; //TypeError: this.ul is undefined
};
};
const add = new Manipulate('bt', 'list');
add.clicked();
console.log('ul' in add); //true
Почему TypeError?
list1
list2
list3
Изменить цвет!function Manipulate (idBtn, idUl){
this.btn = document.getElementById(idBtn) ;
this.ul = document.getElementById(idUl);
};
Manipulate.prototype.clicked = function(){
this.btn.onclick = function(){
console.log('Onclick working!'); // working!
this.ul.style.color = 'red'; //TypeError: this.ul is undefined
};
};
const add = new Manipulate('bt', 'list');
add.clicked();
console.log('ul' in add); //true
list1
list2
list3
Изменить цвет!function Manipulate (idBtn, idUl){
this.btn = document.getElementById(idBtn) ;
this.ul = document.getElementById(idUl);
};
Manipulate.prototype.clicked = function(){
this.btn.onclick = function(){
console.log('Onclick working!'); // working!
this.ul.style.color = 'red'; //TypeError: this.ul is undefined
};
};
const add = new Manipulate('bt', 'list');
add.clicked();
console.log('ul' in add); //true
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Интересные статьи из справочника
Поможем написать учебную работу
Отвечай на вопросы, зарабатывай баллы и трать их на призы.
Подробнее
Подробнее
TypeError возникает потому, что внутри функции обратного вызова onclick, this больше не указывает на объект Manipulate, а указывает на глобальный объект (window). Поэтому this.ul не определено внутри этой функции.
Один из способов решить эту проблему - использовать стрелочные функции, которые сохраняют контекст родительской функции:
Manipulate.prototype.clicked = function(){this.btn.onclick = () => {
console.log('Onclick working!');
this.ul.style.color = 'red';
};
};
После этого изменения, код должен работать правильно и ошибки TypeError не должно возникать.