Javascript 覆盖属性时的自定义元素升级前使用捕获

我最近遇到了以下情况，我正在寻找一个非常棘手的不当行为的建议/优雅的解决方案，IMHO

假设我在文件

bible reference.js

中创建了以下自定义元素定义：

class BibleReference extends HTMLElement {
    constructor() {
        super();
    }
    get value() { return this._value; }
    set value(newValue) { this._value = newValue; }
}

customElements.define('bible-reference', BibleReference);

我们已经定义了新元素，并且有一个

值

属性getter/setter与该元素的值交互。请注意，getter/setter将在元素的

原型

对象上找到，这本身是正常的

现在，让我们回顾一下我的案例中的以下HTML布局：

<bible-reference id='elem-1'></bible-reference>
<script src="starter.js"></script>
<script src="bible-reference.js"></bible-reference>

值

是在未升级的元素上设置的，因此调用的不是getter/setter，而是向元素添加了一个新属性。在对象本身上设置此属性后，即使在升级完成后，

值

的getter/setter对于此元素实例也无法访问，因为在到达原型之前有一个（覆盖的）

值

属性可用

我同时通过添加

删除this.value解决了这个问题到构造函数，但是。。。真讨厌

任何见解都值得赞赏。
处理此问题的另一种方法是在
构造函数（）的闭包中定义
值
属性



设br=document.getElementById（'elem-1'）；
br.value='Genesis 1:1'；
类BibleReference扩展了HtmleElement{
构造函数（）{
超级（）
var _值=此.value
Reflect.defineProperty（此“值”{
获取：（）=>\u值，
set:newValue=>\u value=newValue
})
}
}
自定义元素。定义（'bible-reference'，BibleReference）；
console.log（br.value）
这是一个黑客行为，但它是一个好的合法行为，那么问题出在哪里呢？您可以在删除属性之前添加一个条件，并可能将
值
的值复制到
中。我正在考虑任何意外情况（在与CE合作了很长一段时间后，我遇到了这种情况，可能这一次我不够敏锐：）和不可预测（想想另一个贡献者在应用程序的初始化周期中添加了一些脚本，甚至没有意识到可能会破坏某些东西）-本质上是不好的，必须改进，我认为为任何自定义属性添加这样的
delete
逻辑（以防万一）是荒谬的，但不可避免的，因为这些属性甚至可能被第三方/第二方访问，就像我在这种情况下使用自己的MVVC库时遇到的那样。好吧，这绝对不是ES的方式类属性是要定义的，但实际上我可能认为这一个比
delete
-至少这里发生的事情是清楚的，而对于未经培训的人来说
delete
看起来至少有点奇怪，对于私有
\u值+1在类语法中是不可能的
let br = document.getElementById('elem-1');
br.value = 'some value';