Cos'è la proprietà valueAsNumber?

La proprietà valueAsNumber è disponibile negli elementi HTML <input>. Restituisce la rappresentazione numerica del valore del campo di input, se il browser è riuscito a interpretarlo come un numero. In caso contrario, restituisce NaN.

Questa proprietà è particolarmente utile per i tipi <input type="number">, <input type="range">, <input type="date"> e <input type="time">, poiché gestisce automaticamente la conversione del valore stringa in valore numerico o rappresentazione numerica di data/ora.

Esempio di utilizzo:

// Ottenere l'elemento input
const numberInput = document.getElementById('myNumberInput');

// Ottenere il valore numerico
const valueAsNumber = numberInput.valueAsNumber;

// Verificare se la conversione in numero ha successo
if (isNaN(valueAsNumber)) {
  console.log('Il valore non è un numero.');
} else {
  console.log('Valore numerico:', valueAsNumber);
}

Se l'input ha tipo date o time, valueAsNumber restituirà il numero di millisecondi dall'inizio dell'epoca (1 gennaio 1970, 00:00:00 UTC).

// Ottenere l'elemento input di tipo date
const dateInput = document.getElementById('myDateInput');

// Ottenere il timestamp in millisecondi
const timestamp = dateInput.valueAsNumber;

console.log('Timestamp:', timestamp);

// Convertire il timestamp in un oggetto Date
const dateObject = new Date(timestamp);
console.log('Oggetto Date:', dateObject);

È importante notare che valueAsNumber considera automaticamente le impostazioni locali di formattazione di numeri e date durante l'analisi, semplificando il lavoro con applicazioni web internazionalizzate rispetto all'analisi manuale di value.