为什么不能在 instanceof HTMLInputElement 上使用 "hasOwnProperty"？

Question

我想检查输入元素是复选框还是文本类型。

我知道我能做到：

//Type of input..
if ( input.type === "checkbox" ) 
//Contains the property..
if ( "checked" in input )

但我的问题是：为什么 hasOwnProperty returns 是假的？

我只想使用：

input.hasOwnProperty("checked")

但它 returns 每次都是错误的。

input不是对象吗？
我不这么认为，但是 typeof 说是：

typeof input // returns "object"

所以这是怎么回事？！

代码示例：

const input = document.querySelector("input")
 if ( input instanceof HTMLInputElement ) {
    console.dir(input);
    console.info(typeof input);
    console.log("with 'hasOwnProperty'",input.hasOwnProperty("checked"));
    console.log("with 'in'","checked" in input);
    console.log("with 'type'",input.type === "checkbox");
}

<input type="checkbox" />

The documentation about HTMLInputElement, 只有类型复选框有属性 checked:

Answer 1

"checked" in input returns true 因为 in 评估所有可枚举属性。相反，仅当属性是对象本身的成员时，.hasOwnProperty() 才会 return true。它 returns false 如果它是继承的或对象的成员 prototype.

在这种情况下，checked 是 HTMLInputElement.prototype 上的 getter，不是 input 的成员。

const checkbox = document.getElementById("c");
const descriptor = Object.getOwnPropertyDescriptor(HTMLInputElement.prototype, 'checked');

console.log("'checked' is property of input:", "checked" in checkbox);
console.log("'checked' is own-property of input:", checkbox.hasOwnProperty("checked"));
console.log("'checked' is member of prototype:", HTMLInputElement.prototype.hasOwnProperty("checked"));
console.log("'checked' is getter:", descriptor.get !== undefined);

<input type="checkbox" id="c">

为什么不能在 instanceof HTMLInputElement 上使用 "hasOwnProperty"？

Why can't "hasOwnProperty" be used on instanceof HTMLInputElement?

javascript

hasownproperty