-1

Looking at a javascript expression:

return product.id === +id;

I've never seen a + sign in front of a variable like this before...Thoughts?

Ole
  • 29,797
  • 32
  • 110
  • 232
  • 1
    look at type coercion in javascript - or even unary `+` – Jaromanda X Aug 08 '18 at 23:11
  • Ah so the `+` turns the type of `id` into the type of `product.id`? – Ole Aug 08 '18 at 23:14
  • 2
    No, it turns it into a number regardless of what `product.id` is. – Mark Aug 08 '18 at 23:14
  • 1
    It's basically a silly way to "force" JS to do the right thing. Whoever wrote this is using `===` to make sure that JS does **not** use coercion, and then they immediately force it to coerce the value of `id` to a number using a coercive expression. The proper intentful code equivalent would be `product.id === parseInt(id, 10);` – Mike 'Pomax' Kamermans Aug 08 '18 at 23:15
  • 1
    actually you'd parseFloat not parseInt to be (almost) equivalent, as unary + does not make an integer, it makes a Number - except `+"123bob" === NaN` and `pareFloat("123bob") === 123` - so it's not `equivalent` it's `similar but not the same` – Jaromanda X Aug 08 '18 at 23:16
  • 1
    parseFloat only makes sense in a context where product identifiers use fractional values. That's almost never, so: the obvious choice here is `parseInt(id, 10)`, but depending on context, it _could_ be `parseFloat(id)`, too. – Mike 'Pomax' Kamermans Aug 08 '18 at 23:18
  • compare `123 === +"123.45"` with `123 === parseInt("123.45", 10)` or `123.45 === +"123.45"` with `123.45 === parseInt("123.45", 10)` ... now, tell me which one is correct? :D – Jaromanda X Aug 08 '18 at 23:19

2 Answers2

2

It converts a variable to a Number, if success: +id equals Number(id). If the conversion fails, it will return NaN

TheCoon
  • 83
  • 9
1

The plus sign in front of your variable is called a Unary Operator and it's used to convert a variable into a number. If the value is numeric, the result of the operation will be a number, otherwise NaN.

You can roughly equate the + operator's functionality to parseFloat. However, note that the former can only parse a numeric string, while the latter can extract the numeric value even if it's followed by another one that's not.

Example:

var a = "0x";

console.log("Unary Operator:", +a);
console.log("parseFloat:", parseFloat(a, 16));

In your particular case, it's used to make sure that, if turned into a number, the id is strictly equal to product.id. If id isn't numeric the function will return false, because product.id != NaN, even if product.id itself equals NaN.

Example:

var
  id1 = 13,
  id2 = "13",
  id3 = "a13";

console.log("number:", id1);
console.log("numeric string:", +id2);
console.log("non-numeric string:", +id3);
console.log("NaN !== NaN:", +id3 !== +id3);

Just a Note:

Despite NaN literally meaning "Not a Number", if you use typeof NaN the result will be "number", even though NaN isn't a number in the mathematical sense of the word.

Relevant Threads:

Angel Politis
  • 9,949
  • 12
  • 43
  • 62