Czym jest właściwość valueAsNumber?

Właściwość valueAsNumber dostarcza wartość elementu input lub option jako liczbę zmiennoprzecinkową. Przydatne dla pól wejściowych typu numerycznego (type="number", type="range") lub do pobierania wartości numerycznej z atrybutu value elementu option.

// Pobranie wartości numerycznej z input typu "number"
const inputNumber = document.getElementById('myNumberInput');
const numberValue = inputNumber.valueAsNumber;
console.log(typeof numberValue); // Wyświetli 'number'

// Pobranie wartości numerycznej z opcji
const selectElement = document.getElementById('mySelect');
const selectedOption = selectElement.options[selectElement.selectedIndex];
const optionNumberValue = selectedOption.valueAsNumber;
console.log(typeof optionNumberValue); // Wyświetli 'number'

Jeśli element nie ma wartości numerycznej, valueAsNumber zwróci NaN. Może się tak zdarzyć dla nie-numerycznych typów input lub gdy wartość nie może zostać przekształcona na liczbę.

Element	Typ	Opis
HTMLInputElement	number, range	Zwraca wartość numeryczną wprowadzoną przez użytkownika.
HTMLOptionElement	Dowolny	Zwraca wartość numeryczną atrybutu value.