Как мне получить intellisense для моего анонимного обработчика событий? - PullRequest
Новая
       35

Как мне получить intellisense для моего анонимного обработчика событий?

0 голосов
/ 05 мая 2020

Я создал javascript Worker. Он отправляет сообщения обратно на главную страницу. Эти сообщения обрабатываются обработчиками событий как обычно.

Свойство messages events data будет содержать объект, определенный как: 

{
    knapId: '',
    html: ''
}

Чтобы «обмануть» intellisense, я создал это class , где я определяю свойство data: 

class SvarEvent extends MessageEvent
{
    constructor()
    {
        super('message');
        this.data =
        {
            knapId: '',
            html: ''
        }
    }
}

Я никогда не буду создавать экземпляр этого class. Он будет передан в параметре event обработчика событий.

Теперь я хочу, чтобы мой event в анонимном обработчике событий предоставлял intellisense для типа SvarEvent и его data property

Я сделал несколько неудачных попыток, например: 

/** 
 *  @param {SvarEvent} event 
 */
window.addEventListener("message", function (event)
{
    event.data.       <= Here I want to list 'knapId' and 'html'
});

Как мне сделать это правильно, чтобы я получил intellisense?

1 Ответ

0 голосов
/ 07 мая 2020

Теперь я понял.

Спецификация @type должна быть прямо перед объявлением функции!

В данном случае это означает внутри список параметров обработчика событий, например: 

window.addEventListener("message",  /**@type function(SvarEvent)*/ function (event)
{
    event.data.       <= Here I want to list 'knapId' and 'html'
});

Теперь он работает, когда я набираю 'event.data.', я получаю список: 'knapId' и 'html' .

Обновление: (что я в итоге сделал)

Вместо того, чтобы определять целый новый класс в javascript для MessageEvent (который я бы никогда не создал в любом случае), я закончил тем, что определил новый объект только в JsDoc comments для свойства data: 

/**
 * @typedef {object} MessageData
 * @property {string} knapId
 * @property {string} html
*/

и, используя ES2015 destructuring, теперь я могу сделать это: 

window.addEventListener("message", function (event)
{
    /**
     * @type {MessageData}
     */
    let { knapId, html } = event.data;
});

Теперь у меня есть полное intellisense, и я могу легко получить доступ к свойствам data объектов как переменным способом typesafe.

...