javascript - 如何在对象原型(prototype)中设置多功能

如何设置具有多种功能的对象第二个代码示例是我要尝试执行的操作

Object.defineProperty(NodeList.prototype, 'each', {
    value: function (fn) {
        return Array.from(this).forEach((node, index) => fn(node, index))
    }
});

//下面不起作用

HTMLElement.prototype = {
   hasClass: function(selector) {
   },
   next: function(selector) {
   }
}

最佳答案

使用Object.assign代替：

Object.assign(HTMLElement.prototype, {
  hasClass(selector) {
    return this.classList.contains(selector);
  },
  next(selector) {
    const { nextElementSibling } = this;
    return nextElementSibling && nextElementSibling.matches(selector)
    ? nextElementSibling
    : null;
  }
});

const div = document.querySelector('div');
console.log(div.hasClass('foo'));
console.log(div.next('div'));

<div class="foo"></div>

（也就是说，请注意，对内置原型进行突变不是很好的做法，并且可能会导致问题，尤其是当您开始在页面上包含其他脚本时-更好地定义独立函数，或者为要封装的元素创建自己的包装器有这样的方法）

您也可以使用Object.defineProperties一次定义多个属性，但是所需的代码处理时间更长。

关于javascript - 如何在对象原型(prototype)中设置多功能，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/55681764/