Búsqueda de sitios web

javascript - ¿Cuál es la diferencia entre Unary Plus/Number(x) y parseFloat(x)?

Estoy preguntando esto solo por el hecho de ahorrar unos pocos bytes.

Sé que puedo usar +x (más unario) en lugar de Number(x). ¿Hay alguna diferencia entre esos y parseFloat?

Respuesta #1

La diferencia entre parseFloat y Number

parseFloat/parseInt es para analizar una cadena, mientras que Number/+ es para forzar un valor a un número. Se comportan de manera diferente. Pero primero veamos dónde se comportan igual:

parseFloat('3'); // => 3
Number('3'); // => 3
parseFloat('1.501'); // => 1.501
Number('1.501'); // => 1.501
parseFloat('1e10'); // => 10000000000
Number('1e10'); // => 10000000000

Así que mientras tengas una entrada numérica estándar, no hay diferencia. Sin embargo, si tu entrada comienza con un número y luego contiene otros caracteres, parseFloat trunca el número de la cadena, mientras que Number devuelve NaN (no es un número):

parseFloat('1x'); // => 1
Number('1x'); // => NaN

Además, Number entiende la entrada hexadecimal mientras que parseFloat no lo hace:

parseFloat('0x10'); // => 0
Number('0x10'); // => 16

Pero Number se comporta de manera extraña con cadenas vacías o cadenas que contienen solo espacios en blanco:

parseFloat(''); // => NaN
Number(''); // => 0
parseFloat(' \r\n\t'); // => NaN
Number(' \r\n\t'); // => 0

En general, encuentro que Number es más razonable, así que casi siempre uso Number personalmente (y descubrirás que muchas de las funciones internas de JavaScript también usan Number). Si alguien escribe '1x', prefiero mostrar un error en lugar de tratarlo como si hubiera escrito '1'. La única vez que realmente hago una excepción es cuando estoy convirtiendo un estilo a un número, en cuyo caso parseFloat es útil porque los estilos vienen en una forma como '3px', en cuyo caso quiero eliminar la parte 'px' y solo obtener el 3, así que encuentro parseFloat útil aquí. Pero realmente cuál eliges depende de ti y de qué formas de entrada quieras aceptar.

Tenga en cuenta que usar el operador unario + es exactamente lo mismo que usar Number como función:

Number('0x10'); // => 16
+'0x10'; // => 16
Number('10x'); // => NaN
+'10x'; // => NaN
Number('40'); // => 40
+'40'; // => 40

Así que normalmente solo uso + para abreviar. Mientras sepas lo que hace, me resulta fácil de leer.

Respuesta #2

En estos ejemplos puedes ver la diferencia:

Number('') = 0;
Number(false) = 0;
Number('1a') = NaN;

parseFloat('') = NaN;
parseFloat(false) = NaN;
parseFloat('1a') = 1;

parseFloat es un poco más lento porque busca la primera aparición de un número en una cadena, mientras que el constructor Number crea una nueva instancia de número a partir de cadenas que contienen valores numéricos con espacios en blanco o que contienen valores falsos.

Respuesta #3

La diferencia es lo que sucede cuando la entrada no es un "número adecuado". Number devuelve NaN, mientras que parseFloat analiza "lo que puede". Si se llama con la cadena vacía, Number devuelve 0, mientras que parseFloat devuelve NaN.

Por ejemplo:

Number("") === 0               // also holds for false
isNaN(parseFloat("")) === true // and null

isNaN(Number("32f")) === true
parseFloat("32f") === 32

Artículos relacionados