1. Mastering Javascript operators JAVASCRIPT OPERATORS BITWISE OPERATORS AND WHAT THEY DO USING TRACE TABLES TO PREDICT OUTPUT

2. Did you know? It was developed as a language in just 10 days! JavaScript was originally developed by Brendan Eich, while he was working for Netscape Communications Corporation Although it was developed under the name Mocha, the language was officially called LiveScript when it first shipped in beta releases of Netscape Navigator 2.0 in September 1995, but it was renamed JavaScript Eich also co-founded the Mozilla project, with a website at mozilla.org.

3. Game development and Javascript The game is pure JavaScript & XHTML. There is a nice use of CSS sprites in this particular game implementation.

4. Game development and Javascript A RPG engine written in Javascript that has items to be picked, monsters & more.

5. Game development and Javascript …and of course there is MINECRAFT. You might be interested in the following link if you’re interested in programming in Minecraft https://github.com/walterhiggins/ScriptCraft/blob/master/docs/YoungPersonsGuideToProgrammingMinecraft.md …and of course there is MINECRAFT. You might be interested in the following link if you’re interested in programming in Minecraft https://github.com/walterhiggins/ScriptCraft/blob/master/docs/YoungPersonsGuideToProgrammingMinecraft.md

6. Predict the output ? ? MooseYOUTPUT 3 3 2 2 2 2 2 2 That was easy enough – let’s try another one

7. Using trace tables Trace tables help you to predict the output using a structured method The first thing you need to do is list all the variables in the columns Trace the code and fill in the values for the variables as you go along a a b b c c output 1 1 2 2 3 3 3 3

8. Making a note of key terms Line 6 contains an operation, namely that c is being given the new value of a+b In this case, a and b are the operands, in other words the values being operated on The plus sign (+) is the operator X * Y X and Y are the? And the * is the: operands operator

9. Predict the output ? ? MooseYX 3 3 2 2 4 4 6 6 Output = 6 Again, quite straightforward. A harder one now.

10. Here we are using MOD. Predict output! MooseGooseOutput 10 6 6 Moose = 10 MOD 6 10 MOD 6 basically checks to see if 6 goes into 10 and gives the remainder. In this case Moose = 4 (the remainder is 4) Output = 4

11. Try another MOD prediction: MooseGooseOutput 32 8 8 Moose = 32 MOD 8 32 MOD 8 checks to see if 8 goes into 32 and gives the remainder. In this case there is no remainder because 8 goes perfectly into 32 Output = 0

12. Use of the = assignment operator MooseGooseOutput 3 3 5 5 5 5 3 3 3 3 3 3 It would be useful for you to note that the = sign can also be used in a different way (as a checking for equivalence (comparison). In this case however, it is an assignment operator

13. What’s happening here? Try this yourself and you’ll notice something peculiar 3 3 The aim of the program is to produce an output of moose ONLY if moose = goose (they are not equal in this case) You’ll notice the output for this program is 3 (which isn’t what you expect). What is the problem? The wrong operator was used! In JavaScript the “ = = “ is the equal to operator Notice the double equals sign!

14. Working with bitwise operators

15. You may need a pen to work this one out! ? ? MooseYOutput? 3 3 2 2 ? ? We need to know what the <<= operator does.

16. Predict the output We know that in “Moose+y”, the + operator is adding the value of Moose to y What does the <<= operator do to y?

17. The left shift operator <<= MooseYOutput? 3 3 2 2 ? ? 1. The binary value of moose is being shifted to the left by y (shifting in zeroes from the right) 2. The operator is called the left shift bitwise operator

18. The left shift operator <<= MooseYOutput? 3 3 2 2 Shifts moose in binary representation y (< y) bits to the left, shifting in zeroes from the right.

19. The left shift operator <<= MooseYOutput? 3 3 2 2 First convert Moose (3) to Binary The Binary for Decimal 3 = 011 Now, apply the left shift of y. y = 2 so add 2 zeroes on from the right, to move the number along to the left

20. The left shift operator <<= The Binary for Decimal 3 = 011 Left shift 2 gives you: 01100 Find out what the new value is in Binary! 01100 = 12!

21. Change the inputs: Predict the output The Binary for Moose =1 or 01 or 000001 Left shift moose binary value = 01 by y (y = 1) 01  add one zero to the right which will shift it to the left That gives you 010. 010 in Binary is 2 The output is 2!

22. JavaScript's Operators Let’s start with the blatantly obvious operators. See if you can guess what each one does. Note that the + operator can also be used as a string operator (used to concatenate two strings together) p+ig = pig Let’s start with the blatantly obvious operators. See if you can guess what each one does. Note that the + operator can also be used as a string operator (used to concatenate two strings together) p+ig = pig ? ? ? ? ? ? ? ? ? ? ? ? ? ?

23. JavaScript's Assignment Operators ? ? ? ? ? ? ? ? ? ? ? ? ? ?

24. Comparison and logical operators ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ?

25. JavaScript's Bitwise operators #1 OperatorUsageDescription Bitwise ANDa & b Returns a one in each bit position for which the corresponding bits of both operands are ones. Bitwise ORa | b Returns a one in each bit position for which the corresponding bits of either or both operands are ones. Bitwise And Bitwise OR

26. JavaScript's Bitwise operators #2 Bitwise XORa ^ b Returns a one in each bit position for which the corresponding bits of either but not both operands are ones. Bitwise NOT~ a Inverts the bits of its operand. Left shifta << b Shifts a in binary representation b (< 32) bits to the left, shifting in zeroes from the right. Bitwise XOR Bitwise NOT Left Shift

27. JavaScript's Bitwise operators #3 Sign-propagating right shift a >> b Shifts a in binary representation b (< 32) bits to the right, discarding bits shifted off. Zero-fill right shifta >>> b Shifts a in binary representation b (< 32) bits to the right, discarding bits shifted off, and shifting in zeroes from the left. Sign propagating right shift Zero fill right shift

28. Try it yourself: Task Use the operators given to create your own programs. Screenshot your results with a trace table and explanation of the operator’s function.

29. Here we have used Dreamweaver and the SPLIT, LIVE view