Vadimster
Vadimster

Reputation: 119

Variables not treated as numbers

I was explaining some basic javascript stuff to someone and found myself very embarrassed when a variable was not treated as a number, albeit being a number.

There are no NaN checks here, but we only input numbers.

var number1 = prompt("choose any number");
var number2 = prompt("choose another number");
alert("thank you I will multiply your numbers now!");
var multiplication = function(a, b) {
    var c = a * b;
    alert("the product of " + number1 + " and " + number2 + " is: " + c);
    var number3 = prompt("please choose a number to add to the product.");
    var sum = c + number3;
    alert(sum);
};

multiplication(number1, number2);

It seems that variable "number3" is not treated as a number and the last alert does not give a sum but rather treats "number3" as a string.

Things get better when I use trivial

var sum = c + +number3;

I cannot understand why number3 is not treated as a number, any ideas? I could not explain this to my friend and had to retreat in disgrace.

Tired on Chrome and Firefox with the same effect.

Upvotes: 1

Views: 660

Answers (6)

Guffa
Guffa

Reputation: 700212

The prompt method always returns a string, it doesn't try to convert the text that you entered into a number even if it looks like it could be a number.

When you use the multiplication operator on two strings, both will implicitly be converted to numbers, because the multiplication operator only accepts numbers.

When you use the + operator on a number (c) and a string (number3), it will do string concatenation, not addition, because at least one of the operands is a string. It will convert the number to a string and concatenate it to the other string.

Using the unary + operator on the number3 variable will implicitly convert the string into a number, because the unary plus operation can only be done on a number. It's clearer to use a function that explicitly converts the string to a number than using implicit conversion:

var number1 = parseFloat(prompt("choose any number"));
var number2 = parseFloat(prompt("choose another number"));
alert("thank you I will multiply your numbers now!");
multiplication(number1, number2);

function multiplication(a, b) {
  var c = a * b;
  alert("the product of " + number1 + " and " + number2 + " is: " + c);
  var number3 = parseFloat(prompt("please choose a number to add to the product."));
  var sum = c + number3;
  alert(sum);
};

Upvotes: 1

ncubica
ncubica

Reputation: 8475

As everybody explained you are working withstrings returning by the prompt.

And just for the sake of fun/quirks things that javascript have. look how you can turn that strings in numbers

multiplying by number 1 will automatically turn all the string in numbers. so in the prompt side you could you multiply the result of prompt1 and prom2 * 1 and you will not have that problem

also you can do "1" * 1 -> 1 integer

more interesting hide javascript features Hidden Features of JavaScript?

Upvotes: 0

vol7ron
vol7ron

Reputation: 42099

The + operator is overloaded as a arithmetic addition operator and as a string concatenation operator.

For the majority of cases, a value added to a string results in a string. Because prompt() returns a string, that is what's happening. You can use the unary + to turn the string back into a number (+number3), thus removing all the strings from the equation.

Note: Order of Operation does Matter

4 + 5 + '1' + 1     // '911'

The 4 and 5 are operated on first (both not strings) so arithmetic addition is executed. Then the first '1' is encountered, which is a string, so a string is involved going forward and every + will be a string concatenation.

Upvotes: 0

Stuart
Stuart

Reputation: 9858

The specification helps explain how automatic type conversion is working here. + performs string concatenation if one of the operands is a string, while * only performs numeric multiplication, and so converts the operands to numbers.

Upvotes: 0

Scimonster
Scimonster

Reputation: 33399

prompt() returns a string, simple as that. The * operator apparently casts the first two cases into numbers, but + is also the concatenation operator. So what happens is that now you have number + string = string. When you do +number3, that (the unary +) casts to a number. So now you have number + number = number, which is what you want.

Upvotes: 1

dfsq
dfsq

Reputation: 193261

Window.prompt always returns a String, event if it's numeric like "5". Still string. You need to perform casting from string type to number. For example using Number constructor:

var number1 = Number(prompt("choose any number"));
var number2 = Number(prompt("choose another number"));

Upvotes: 1

Related Questions