Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

JavaScript 101

5,101 views

Published on

An introduction to JavaScript that includes side-by-side comparisons with Python -- for journalism students. Based on the free JavaScript exercises/lessons at Codecademy: http://www.codecademy.com/tracks/javascript (Students in this course spent 4 weeks learning Python before they were introduced to JavaScript.)

Published in: Education
  • My struggles with my dissertation were long gone since the day I contacted Emily for my dissertation help. Great assistance by guys from ⇒⇒⇒WRITE-MY-PAPER.net ⇐⇐⇐
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hi there! I just wanted to share a list of sites that helped me a lot during my studies: .................................................................................................................................... www.EssayWrite.best - Write an essay .................................................................................................................................... www.LitReview.xyz - Summary of books .................................................................................................................................... www.Coursework.best - Online coursework .................................................................................................................................... www.Dissertations.me - proquest dissertations .................................................................................................................................... www.ReMovie.club - Movies reviews .................................................................................................................................... www.WebSlides.vip - Best powerpoint presentations .................................................................................................................................... www.WritePaper.info - Write a research paper .................................................................................................................................... www.EddyHelp.com - Homework help online .................................................................................................................................... www.MyResumeHelp.net - Professional resume writing service .................................................................................................................................. www.HelpWriting.net - Help with writing any papers ......................................................................................................................................... Save so as not to lose
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hello! I can recommend a site that has helped me. It's called ⇒ HelpWriting.net ⇐ So make sure to check it out!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Check the source ⇒ HelpWriting.net ⇐ This site is really helped me out gave me relief from headaches. Good luck!
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • The Insider's Edge You've Been Looking For....  http://t.cn/A6hP86vM
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

JavaScript 101

  1. 1. JavaScript 101 Review from Codecademy exercises Parts 1–12 http://www.codecademy.com/tracks/javascript
  2. 2. Comparison JavaScript Python var animal = "elephant" animal.length 8 console.log(animal) elephant 2 + 3 * 5 17 // a comment animal = "elephant" len(animal) 8 print animal elephant 2 + 3 * 5 17 # a comment
  3. 3. Comparison JavaScript Python function myfunction(a, b) { var answer = a + b; return answer; } console.log(myfunction(3, 5)); 8 def myfunction(a, b): answer = a + b return answer print (myfunction(3, 5)) 8 var myfunction = function(a, b) { var answer = a + b; return answer; } console.log(myfunction(3, 5)); 8 also JavaScript
  4. 4. Alert, Confirm, Prompt An alert dialog box gives a message to the user. It only allows the user to click OK. A confirm dialog box allows the user to choose between OK and Cancel. So the text should ask a question, and clicking OK should cause something to happen. A prompt dialog box allows the user to type something and click OK, or the user may cancel to close the dialog.
  5. 5. Alert, Confirm, Prompt We will do an exercise with these later.
  6. 6. Booleans: Comparison JavaScript Python 10 > 3 true 10 < 3 false 10 > 3 True 10 < 3 False Note that case is significant in JavaScript (just as it is in Python). The Boolean values in Python must be uppercase. In JavaScript, the Boolean values must be lowercase.
  7. 7. If–Else JavaScript Python if (x == y) { console.log("They are equal."); } else if (x > y) { console.log("x is more."); } else { console.log("x is less."); } if (x == y): print "They are equal." elif (x > y): print "x is more." else: print "x is less."
  8. 8. For Loop JavaScript Python for ( i = 0; i < 10; i++ ) { console.log(i); } for i in range(0, 10): print i // this will print the numbers from 0 through 9 # this will print the numbers from 0 through 9
  9. 9. For Loop (2) Python JavaScript
  10. 10. While Loop JavaScript Python var n = 0; while (n < 3) { console.log("Looping."); n++; } n = 0 while (n < 3): print "Looping." n += 1 Looping. Looping. Looping. Looping. Looping. Looping.
  11. 11. “Incrementing” JavaScript i++ is the same as i = i + 1 i-- is the same as i = i - 1 Python i += 1 is the same as i = i + 1 i -= 1 is the same as i = i - 1
  12. 12. Extracting a substring JavaScript Python var mystring = "the word swagger" mystring = "the word swagger" console.log(mystring.s ubstring(9,13)); print mystring[9:13] swag swag
  13. 13. The switch statement switch (//Some expression) { case 'option1': // Do something break; case 'option2': // Do something else break; default: // Do yet another thing break; }
  14. 14. Switch statement example
  15. 15. switch (album) { case "asbury": songfile = "clips/spiritinthenight.mp3"; track = "Spirit in the Night"; album = "Greetings from Asbury Park"; break; case "wild": songfile = "clips/fourth.mp3"; track = "4th of July, Asbury Park (Sandy)"; album = "The Wild, the Innocent, and the E Street Shuffle"; break; case "borntorun": songfile = "clips/thunderroad.mp3"; track = "Thunder Road"; album = "Born to Run"; break; . . . . . . . . . . };
  16. 16. Arrays (Lists) JavaScript var mylist = ["red", "white", "blue"]; console.log(mylist[2]); blue Python mylist = ["red", "white", "blue"] print mylist[2] blue
  17. 17. Math.random() If we declare a variable and make it equal to Math.random(), that variable will equal a number between 0 and 1. Note: In JavaScript, the capital M in all Math methods is significant. No lowercase!
  18. 18. Note that if you use Math.random() to create the value of a variable, that value will not change randomly. But if you run Math.random() again and again, it will generate a new number between 0 and 1 each time. To use the JavaScript console in Chrome (shown here), open the View menu > Developer > JavaScript Console
  19. 19. What is happening here?
  20. 20. What would this code be good for? (Think about games.) Note: Math.floor() rounds a number down to the nearest integer. It conveniently cuts off the decimal places. We add 1 because otherwise our numbers would go from 0 to 5. By adding 1, they range from 1 to 6 instead.
  21. 21. Guessing a number • In-class assignment: Create a little game with an HTML page, a confirm dialog box and JavaScript. • Your game will use Math.Random() to pick a number between 1 and … ? (You choose.) • Then the user has to guess the number, by typing it into the confirm dialog. • A new alert box will open and tell the user if the guess is right or wrong.
  22. 22. Alert, Confirm, Prompt Download this: https://github.com/maclo o/javascript_beginners
  23. 23. JavaScript 101 Review from Codecademy exercises Parts 1–12 http://www.codecademy.com/tracks/javascript

×