Question

我需要以这种方式添加一个附加到节点的函数：

myElement = querySelector('#myElement');
myElement.moveMe = () =>{
    //move Me Code;
}

但是我不知道如何记录此函数（并防止出现皮棉错误），我尝试将@extend与@typedef一起使用，但是它说它仅适用于构造函数。

Answer 1

我可能建议正确的方法是自己创建一个list2对象，但是如果必须扩展，它看起来像这样：

{el: myElement, moveMe: ()=>{}}

Error free

Answer 2

（不确定您的堆栈，只是注意到我最近（2019-Q1）个人 VSCode JSDoc挣扎的2C成绩。）

理论上，似乎应该可以将简单的@typedef与“父”类型声明一起使用：（这不起作用）

/**
 * @typedef {HTMLElement} movableElement
 * @property {function} moveMe
 */
/** @type movableElement */
var myElement = document.querySelector('#myElement');
myElement.moveMe; // NOPE, not present for some reason :(
myElement.tabIndex; // ok, this is from HTMLElement

使用自定义属性扩展本机HTML元素的最接近意图是&的“交叉点类型表示法”，我是使用辅助类型从this comment中学到的：

/**
 * @typedef movable
 * @property {function} moveMe
 */
/**
 * @typedef {HTMLElement & movable} movableElement
 */
/** @type movableElement */
var myElement = document.querySelector('#myElement');
myElement.moveMe; // ok
myElement.tabIndex; // ok (HTMLElement properties are present as well)

或者甚至没有辅助类型，也可以直接交集：

/**
 * @typedef {HTMLElement & {moveMe: function}} movableElement
 */
/* ... */

奇怪的是，添加到这种扩展类型的任何@property声明似乎都被完全忽略了（就像第一次失败尝试中的属性一样，我仍然不确定为什么）。

我一直在努力实现类似的目标-在VSCode中使用JavaScript中的一些骇客的自定义属性扩展HTMLElement-在详尽的SO / github / docs潜水之后，这种解决方法的解决方案对我来说很有效。

如何在jsDoc中记录HTML节点函数？

2 个答案: