Forum Moderators: open

Message Too Old, No Replies

javascript complete newbie - increments

         

quartzy

1:34 am on Jan 11, 2009 (gmt 0)

10+ Year Member



Hi
Can anyone explain increments and the behaviours of them, as I am self learning and I keep getting stuck as I dont understand, how they work. And of course decrements, it is essential that I understand these operators as they are used alot in js.

methode

6:29 am on Jan 11, 2009 (gmt 0)

10+ Year Member



The incrementing and decrementing is just like in PHP if you refer to arithmetic.
Let's see the incrementing first, decrementing is its exact opposite:

Declare a variable, say

var x = 2;

If you want to increment it by one, you can use
x++; //x will be 3

If you want to increment it and assign the value to a new variable, then
y=++x; //y will be 3

As i said, the decrementing is the exact opposite, so
y=--x; //y will be 1

It's that simple

quartzy

11:51 pm on Jan 11, 2009 (gmt 0)

10+ Year Member



Thanks for getting back to me, but I am none the wiser on how to do it. What you say sounds easy enough but I still cant do this sum.

They are unary and conubial operators

var a = 9; Value (9) I understand this
var b = 0; Value (0) understand this too
b = a; Value (9) and understand this
b = ++a; Value (11) dont understand how this became 11
b = a++; Value (12) dont understand how this became 12
b = a++; Value (13) dont understand how this became 13

keep going over it, but still cant work it out. Unless this is wrong. Can you help?

quartzy

11:52 pm on Jan 11, 2009 (gmt 0)

10+ Year Member



by the way I dont know php just starting out with the javascript first.

methode

8:27 am on Jan 12, 2009 (gmt 0)

10+ Year Member



Try this script in HTML page:

<script type='text/javascript'>
var a = 9;
var b = 0;
b = a;
document.write('b now is: (b=a=>) ' + b+'<br />');
b = ++a;
document.write('b now is: (b=++a=>) ' + b+'<br />');
b = a++;
document.write('b now is: (b=a++=>) ' + b+'<br />');
b = a++;
document.write('b now is: (b=a++=>) ' + b+'<br />');
</script>

The result on win64 + Firefox 3 (but this really doesn't matter... well, shouldn't), is:


b now is: (b=a=>) 9
b now is: (b=++a=>) 10
b now is: (b=a++=>) 10
b now is: (b=a++=>) 11

The first is obvious. The second is obvious too, because 'a' was incremented and evaluated to the incremented value. The third case is interesting: it increments 'a' but evaluates to the un incremented value, which is the value of 'b' at that point (assigned in the second line, so it's 10). The fourth is the same as the third, but b's initial value is now 10 (assigned in the 3rd line) so the result will be 11.

Somebody, how can this be explained better?

[edited by: engine at 11:44 am (utc) on Jan. 12, 2009]

quartzy

10:55 am on Jan 12, 2009 (gmt 0)

10+ Year Member



Yes I can understand how you incremented, I guess the sum I had originally which is wrong threw me. Thanks for your help.

quartzy

10:57 am on Jan 12, 2009 (gmt 0)

10+ Year Member



Is the sum wrong, in the example I gave?

methode

12:01 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



Well, I don't really understand how did you get those results either.

quartzy

12:12 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



They were off a training CD

methode

12:29 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



Well...What should I say?

I reproduced in the 5th post what you wrote in the third post. Copy/paste it in a HTML page's body and test it. If the results will match the results taken from the training CD i will call myself an idiot publicly on the Times Square because I couldn't copy/paste the results from my test page.
However in the case the results will not match the results taken from the CD, then I'll get a beer, savor a stake and state that I can copy/paste better than the creators of the CD.

I'd be quite interested of where did you get that Tutorial CD and who are the authors.

quartzy

1:31 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



Hi
The authors are cbt nuggets, quite an expert I gather. That must be why I got it cheap, as it had errors. I have tested it, but I thought it was a different one, as it has different symbols, I see now it is the same one.

jpope

6:17 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



Yeah, methode's stuff has the correct numbers. I'd guess there's a typo in the book you're reading. Hope it all makes sense now.

astupidname

7:07 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



Somebody, how can this be explained better?

To take it a little further, let's take some var's for a loop and alert and see comments: (a and b were already beat to death, so I skipped them - lol)

var c = 0;
var d = 0;
var e = 0;
var f = 0;
var g = 0;
var h = 0;
var j = 0;
var k = 0;
var m = 0;
var n = 0;
for (var i = 0; i < 6; i++) {
c++; // c and d will be 6, value is being declared and evaluated instantly
++d;
f = e++; //f and h will be 5 because the increment evaluation occurs after f and h have been assigned a value
h = g; g++; //g will be 6, just like c and d, but h will be 5 because the increment of g happens after assignment of h's value, just like f
k = ++j; //k and j will both be 6, j is incremented first, then value assigned to k also
n = 1 + m++; //n and m will be 6, instead of n being 5 like f and h, because we cheated with the 1 + , without that, m would be 6 and n would be 5, just like f is 5 and e is 6
}

//c:6, d:6, e:6, f:5, g:6, h:6, j:6, k:6, m:6, n:6
alert("c: "+c+"\nd: "+d+"\ne: "+e+"\nf: "+f+"\ng: "+g+"\nh: "+h+"\nj: "+j+"\nk: "+k+"\nm: "+m+"\nn: "+n);

So what this shows really, is that incrementing when applied directly to a var is evaluated immediately. But, if assignment of value is being done using = the evaluation of the incrementing is done either before or after the assignment of value depending on whether the ++ is before or after the var being incremented.

astupidname

7:12 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



//c:6, d:6, e:6, f:5, g:6, h:6, j:6, k:6, m:6, n:6

that was supposed to be:

//c:6, d:6, e:6, f:5, g:6, h:5, j:6, k:6, m:6, n:6

quartzy

7:23 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



er thanks for all that code but I barely know increments, never mind looping.

astupidname

7:29 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



O.k, so now that you have seen what's happening there in the previous code I posted, let's revisit a and b.
The important things to note about my previous code is the wrap-up at the end where I said:
So what this shows really, is that incrementing when applied directly to a var is evaluated immediately. But, if assignment of value is being done using = the evaluation of the incrementing is done either before or after the assignment of value depending on whether the ++ is before or after the var being incremented.

So when you realize that, then the following makes perfect sense:

var a = 9;
var b = 0;
b = a; //b = 9
b = ++a; //b = 10, a = 10, a was incremented before b was assigned value
b = a++; //b = 10, a = 11, when b was evaluated, a was still worth 10, then a incremented after b was assigned value
b = a++; //b = 11, a = 12, a incremented after b assigned value
alert("a: "+a+"\nb: "+b); //a:12, b:11

methode

8:07 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



b = a++; //b = 10, a = 11
b = a++; //b = 11, a = 12

I forgot to add those /*slaps himself with a trout*/

er thanks for all that code but I barely know increments, never mind looping.

It's not that bad as it seems to be. Honest. In fact, they make your life heaven combined with a pack of beer (with a bit of exaggeration) in the easiest way possible :)

Waiting the day when you'll ask about loops and switches :)

astupidname

8:43 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



Waiting the day when you'll ask about loops and switches

Nothing a good trout upside the head won't fix! lol

quartzy

9:31 pm on Jan 12, 2009 (gmt 0)

10+ Year Member



I get it now, thanks to you all. Can get back to learning the javascript, and yes I will probably be back. All this talk of beer and trouts, where am I