Ссылка на холст потеряна при изменении размера

Question

У меня есть класс «класс», который прослушивает изменение размера событий в окне и вызывает функцию, которая прямо сейчас просто регистрирует ссылку на элемент DOM. Доступ к элементу перед изменением размера работает отлично, и он работает так же, как и после, но во время моего обратного вызова события изменения размера он не определен. Что дает?

function Grid (el) { 
    this.el = document.querySelector(el); 
    this.init(); 
} 

Grid.prototype.init = function() { 
    window.addEventListener('resize', this.resizeCanvas, false); 
} 

Grid.prototype.resizeCanvas = function() { 
    console.log(this.el); 
} 

Когда я изменяю размер браузера, регистрируется undefined.

Answer 1

resizeCanvas не вызывается с контекстом Grid. Одним из вариантов было бы сделать что-то вроде этого, вместо:

Grid.prototype.init = function() { 
    var self = this; 
    window.addEventListener('resize', function() { 
    self.resizeCanvas(); 
    }, false); 
}