7

Assignment a number to an attribute using the += operator gives me NaN in JavaScript.

This code works as expected:

> var result = {};
undefined
> result['value'] = 10;
10
> result['value'] += 10;
20

But here we get NaN:

> var test = {};
undefined
> test['value'] += 10;
NaN

Why does JavaScript behave like this? How can I get this to work without initializing result['value'] = 0?

Marco Bonelli
  • 55,971
  • 20
  • 106
  • 115
jsbisht
  • 8,093
  • 7
  • 46
  • 52

8 Answers8

11

This line test['value'] += 10 equals to test['value'] = undefined + 10, which is NaN (Not a Number).

Marco Bonelli
  • 55,971
  • 20
  • 106
  • 115
Lewis
  • 13,134
  • 12
  • 62
  • 81
7

You can't add a number to undefined in JavaScript. If you don't want to initialize the number, you need to test if it's undefined before incrementing it:

test['value'] = (typeof test['value']==='undefined') ? 10 : test['value']+10;
Community
  • 1
  • 1
Blazemonger
  • 86,267
  • 25
  • 136
  • 177
6

This happens because you're trying to add 10 to an undefined property of your object, so your line will result in doing:

test['value'] = undefined + 10; // NaN

Every numerical expression which causes an unknown value turns into NaN (not a number) in JavaScript. To make it work, you should check if that property exists and has a numerical value, then add some number to it; otherwise you'll have to create it. Plus, since that you're working with an object, you can use test.value instead of test['value'].

Here is an example:

if (Number(test.value)) test.value += 10;
else test.value = 10;

// Or more neatly:
test.value = +test.value ? test.value + 10 : 10;
Marco Bonelli
  • 55,971
  • 20
  • 106
  • 115
3

Because test['value'] is undefined. Adding a number to undefined will give you NaN (which stand for "Not a Number"). You need to initialize the value before adding to it:

var test = {};
test['value'] = 0;
test['value'] += 10;

Since you are using an object you can also use the dot notation:

var test = {};
test.value = 0;
test.value += 10;
Sverri M. Olsen
  • 12,718
  • 3
  • 34
  • 50
1
test['value'] += 10;

is equivalent to
test['value'] = test['value'] + 10;
but, test['value'] is undefined, because you haven't initialized it yet

taesu
  • 4,398
  • 3
  • 22
  • 41
1

Why does JavaScript behave like this?

Because when the property does not exist, accessing it defaults to undefined; and when adding a number to undefined you get NaN back.

How can I get this to work without initializing result['value'] = 0?

If you don't want to (or can't) initialize it once, you will need to check every time whether the property exists, basically:

test.value = ('value' in test ? test.value : 0) + 10;

Another approach would be to cast the property to a number every time before adding to it:

test.value |= 0;
test.value += 10;
Bergi
  • 572,313
  • 128
  • 898
  • 1,281
0

Check if test value is not undefined before adding the value:

test['value']? test['value']+=10 : test['value']=10
lifeisfoo
  • 13,908
  • 5
  • 68
  • 110
  • Technically, this only tests if its value is "falsey". – Blazemonger Feb 06 '15 at 14:26
  • Ecmascript5 definition of the conditional operator: http://www.ecma-international.org/ecma-262/5.1/#sec-11.12 `LogicalORExpression ? AssignmentExpression : AssignmentExpression` then the `AssignmentExpression` is defined here http://www.ecma-international.org/ecma-262/5.1/#sec-11.13 – lifeisfoo Feb 07 '15 at 13:02
0

Because NaN can't be added. You need to have a number to use +=