Почему нельзя использовать hasOwnProperty для экземпляра HTMLInputElement? - PullRequest
Новая
       41

Почему нельзя использовать hasOwnProperty для экземпляра HTMLInputElement?

6 голосов
/ 04 ноября 2019

Я хочу проверить, является ли элемент ввода флажком или типом текста.

Я знаю, что могу сделать это: 

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

Но мой вопрос: почему делают hasOwnPropertyвозвращает false?

Я просто хочу использовать: 

input.hasOwnProperty("checked")

, но каждый раз возвращает false.

Разве 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" />

Документация о HTMLInputElement , флажок только для типа имеет свойство checked:

1 Ответ

5 голосов
/ 04 ноября 2019

"checked" in input возвращает true, поскольку in оценивает все перечислимые свойства. Напротив, .hasOwnProperty() вернет true, только если свойство является членом самого объекта. Он возвращает false, если он унаследован или является членом prototype.

. В этом случае checked является геттером на HTMLInputElement.prototype, не член 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">
...