javascript - validacion - Cadenas y números de conversión de tipo de atributo de datos HTML5*.

validar formulario javascript html5

Question

¿Por qué el valor de data-value="2.0" envía a una Cadena y el valor de data-value="2.5" a un Número? Puedo manejar esto bien dentro de mi función. Solo trato de entender un poco más acerca de cómo Javascript maneja Numbers and Strings. Este tipo de me pilló desprevenido.

<a data-value="2.0">2.0</a>
<a data-value="2.5">2.5</a>

$("a").click(function() {
    alert(typeof $(this).data( "value"));   
});

[Fiddle With It]

Answer 1

Al examinar el código fuente de jQuery, identifiqué la razón.

Lo analizará como un número, si, y solo si, al hacerlo no cambia la cadena. Fuente: https://github.com/jquery/jquery/blob/master/src/data.js#L36

(+"2.0") + "" === "2" // !== the original string
(+"2.1") + "" === "2.1" // == the original string

Answer 2

Como mencionó tymeJV, esto parece un problema con la forma en que jquery maneja la autoconversión. Si usas "2", también da un número, así que supongo que es solo un caso extraño sobre cómo manejan las cosas. Me gustaría simplemente utilizar .attr (''xxx'') y analizar sus datos a su tipo conocido.

Answer 3

Creo que es más una pregunta sobre cómo jquery identifica los números. Si usa la alert(typeof(this.getAttribute("data-value"))); , escupe que es una cadena en ambas ocasiones (lo que se espera). Hasta donde yo sé, todo en un atributo html se considera una cadena, solo las diferentes bibliotecas pueden tener un comportamiento predeterminado que las interprete de manera diferente.

Además, una forma abreviada de obtener un número sería algo así como ...

var someNumber = +$(someElt).data("value");

el + causará coerción de tipo si el valor devuelto es una cadena, o déjalo solo si ya es un número.

Answer 4

Esos valores son simplemente cadenas para vainilla javascript; no está intentando ninguna conversión por sí mismo.

[...document.querySelectorAll("a")].forEach(a =>
    console.log("type: %s, value: %o", 
                typeof a.dataset.value, 
                a.dataset.value)
);

<a data-value="2.0">2.0</a>
<a data-value="2.5">2.5</a>

jQuery, por otro lado, intenta determinar y convertir al tipo apropiado al acceder a los atributos de data() través de data() . Es (discutiblemente) un problema con su implementación. Su documentación (el énfasis es mío) realmente aborda esto:

Se hace todo lo posible para convertir la cadena a un valor de JavaScript (esto incluye booleanos, números, objetos, matrices y nulo). Un valor solo se convierte en un número si hacerlo no cambia la representación del valor. Por ejemplo, "1E02" y "100.000" son equivalentes a números (valor numérico 100) pero al convertirlos se alteraría su representación, por lo que se dejan como cadenas. El valor de cadena "100" se convierte al número 100.

_{Ver también HTMLElement. dataset HTMLElement. dataset}

Answer 5

Parece tratar esa extensión ".0" del número como una cadena.

Si todos sus valores de datos van a entrar en ese formato, simplemente azote un parseFloat() en los retoños de esta manera:

$("a").click(function() {
    alert(typeof parseFloat($(this).data( "value")));   
});

De esta forma, no importará si son cadenas o números, siempre se tratarán como números (decimales intactos).

Answer 6

Por defecto, cualquier elemento analizado de un atributo será una cadena, necesitará convertirlo a un número si necesita usarlo como un número. La mejor manera en que he podido manejar esto es envolviéndolo con la función Número (javascript nativo)

var number = Number($(this).data("value")); parseInt devolverá un número entero (número entero), por lo que si desea mantener sus valores decimales deberá usar Number. Palabra de advertencia con parseInt, siempre es mejor especificar la base si desea analizar un int, parseInt ($ (this) .data ("value"), 10);