#javascript #prototype #getter #setter
Вопрос:
Для тестирования: мне нужно переопределить собственный доступ к свойствам HTMLElement в JavaScript, но сохранить собственную функциональность.
Следующий код переопределяет offsetWidth
свойство HTMLElement
, но я не могу понять, как зарегистрировать результат собственного геттера.
// How can I call this from within the getter?
var nativeOffsetWidth = HTMLElement.prototype.offsetWidth;
// Overrides the native access
Object.defineProperty(HTMLElement.prototype, 'offsetWidth', {
get: () => {
// This part does not work! I need to access the native property here.
var value = nativeOffsetWidth.call(this);
console.log(value);
return value;
}
});
Я также хотел бы изменить результат, как только смогу получить правильный value
.
Заранее спасибо!
Ответ №1:
Вы можете получить исходное значение свойства с помощью Object.getOwnPropertyDescriptor
Используйте его вот так:
const nativeOffsetWidth = Object.getOwnPropertyDescriptor(
HTMLElement.prototype,
'offsetWidth'
).get;
nativeOffsetWidth.call(document.body /* example html element */);
Комментарии:
1. Спасибо за ответ! Однако я не смог получить код, предоставленный для получения результата. Я изучу getOwnPropertyDescriptor и посмотрю, смогу ли я заставить его работать с некоторыми изменениями.
2. Я протестировал свой код как в Chrome, так и в Firefox, не зная, почему он иногда не работает
3. Я отлично работаю с document.body, но я не могу заставить его работать с ключевым словом «this» из геттера, например nativeOffsetWidth.call(это).
4. А, я понимаю твою проблему.
this
Ключевое слово не работает как обычно в функциях со стрелками. Используйте обычную функцию, и она должна работать так, как ожидалось5. @mousetail я проверяю, и это тоже происходит со свойствами, вот пример: pastebin.com/00kUEBbD совсем не понимаю, почему бы не начать с этого