1 / 44

Introduction to Programming (in JavaScript)

Introduction to Programming (in JavaScript). David Stotts Computer Science Department UNC Chapel Hill. Everyone have a great break?. How people see me when I tell them I’m a Programmer. How My Mom sees Me. How I see Myself. How I Really Am …. How you now see your May self.

honora
Download Presentation

Introduction to Programming (in JavaScript)

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Introduction to Programming(in JavaScript) David Stotts Computer Science Department UNC Chapel Hill

  2. Everyone have a great break?

  3. How people see me when I tell them I’m a Programmer

  4. How My Mom sees Me

  5. How I see Myself

  6. How I Really Am …

  7. How you now see your May self Afraid you will become this guy 

  8. How you will really be …

  9. Ok, Ok… no more fun… this is science Class webpage http://www.cs.unc.edu/~stotts/COMP110-s14/

  10. The Big Six 1. data storage (variables, assignment) 2. data retrieval (expressions, evaluation) 3. repetition (loops) 4. decision making (conditionals) 5. procedure abstraction (functions) 6. data abstraction (arrays)

  11. Model of a Computer No not this…

  12. Model of a Computer • A “model” is a simplification of something complex… an abstraction • We take out some detail to show the basics of something in simple form • Details we remove are irrelevant to the aspects we wish to emphasize or explain in the model

  13. Model of UNC enroll Do 4 or 5 times Pay tuition Take fall classes Take spring classes Get 1.7 mil emails from Alumni Assoc graduate

  14. Model of the Solar System What can we study here? What can we not study?

  15. Model of the Solar System

  16. Model of the Solar System

  17. Scale Model of the Solar System Scale = 1:14,000,000,000 I miss Pluto … don’t you?

  18. Von Nuemann Model of a Computer John

  19. Von Nuemann Model of a Computer

  20. Von Nuemann Model of a Computer

  21. Von Nuemann Model of a ComputerCOMP 411 style

  22. Von Nuemann Model of a Computersuper COMP 411 style

  23. Motherboard Layoutintel 486

  24. Von Nuemann Model of a Computerback to COMP 110

  25. Memory Hierarchy • storage size increases • access time increases • cost decreases (per bit) • persistence increases • decreasing frequency of access by processor The “cloud”

  26. Network, cloud USB Disk drives, DVD CPU regs cache Main memory RAM

  27. What happens when you power on your computer? • A minimum amount of information is read from secondary memory into main memory • Control is transferred to that area of main memory; this code reads the core of the OS, called the kernel • The kernel executes the initial process • This process loads a full OS off disk (or cloud) • Called bootstrapping (pulling oneself up by one’s bootstraps)… the computer “boots up” • OS then runs all the other programs you write and use… including JavaScript

  28. Data output wireless, usb, net, print port, sound, video User input Keyboard Mic camera kernel Data to programs Disk CPU Kernel talks to disk CPU runs programs CPU runs full OS kernel OS OS loads CPU runs kernel Main memory RAM

  29. Main Memory Layout Intructions and data all stored in main memory (RAM)

  30. Basic “Fetch-Execute” Cycle

  31. Binary Representation • Internally a computer stores information in binary form, or base 2 • Here’s what a program in memory looks like if you could peek in:

  32. “The Matrix”

  33. Binary Representation • We group the 0’s and 1’s into chunks to represent different forms of information

  34. Von Neumann revisited Programs and their data all stored together in memory • Some 0’s 1’s chunks stand for numbers • Some stand for characters, text • Some stand for images, videos, etc. • Some stand for memory locations • Some stand for program instructions like “add 2 numbers” or “save register 5 to memory location 2145768”

  35. Von Neumann revisited • Computer sorts it all out during the fetch-execute cycle • When we “program” the computer we express the computations we want in a “high level” language like JavaScript • A compiler or translator converts our human-readable program into a big pile of binary… puts it in memory for the computer to then sort out and run

  36. 0, 1 … bits • “0” and “1” are the way computers express information because of physics • A light switch is on, or it is off • A wire has current in it, or it does not • A spot on a disk surface is magnetic, or it is not • A hole is punched in a card, or it is not • “0” is really “absent” or “off” • “1” is really “present” or “on” • We also often think of “0” as false, “1” as true

  37. More on bits • With two physical states in a circuit (on, off) we must build all information from a notation with 2 units, or base 2 • We call this binary • We think of the units as the digits 0 and 1 • A single unit of information is a bitwhich is short for binary digit • We clump bits together into chunks sized by powers of 2

  38. Powers of 2 2^0 is 1 2^4 is 16 2^7 is 128 2^1 is 2 2^5 is 32 2^8 is 256 2^2 is 4 2^6 is 64 2^9 is 512 2^3 is 8  special… we call 8 bits a byte 2^10 is 1024  kilo, 1 kilobit, or 1 Kb 2^20 is 2^10 * 2^10 mega,~ 1 million , 1 megabit, or 1 Mb 2^30 is 1 gigabit or ~ 1 billion bits 2^40 is 1 terabit or ~ 1 trillion bits

  39. Powers of 2 We can do this with bytes too 8 bits is 1 byte 2^10 bytes is 1024 bytes is 1 kilobyte (KB) 2^20 is 1024 * 2^10 bytes is 1 megabyte or 1 MB 2^30 bytes is 1 gigabyte or 1 BG 2^40bytes is 1 terabyte or 1 TB

  40. Binary Representation • Binary for numbers is base 2 • 1 1 0 1 (base 2) is 1 times 2^3 … 8 (base 10) 1 times 2^2 … 4 0 times 2^1 … 0 1 times 2^0 … 1 13 (base 10) add these together

  41. First Program • Here is a Web page with a JavaScript program • Here is the program source code <script type=text/javascript> function simpleFunc( ) { //put your program text below the dashed line //---------------------------------------------- alert("Hello from your first program !"); //---------------------------------------------- //put your program text above the dashed line } </script>

  42. Well Done • You know what a model is • Using the von neumann computer model, you know about the insides of the computer you will program • You have run your first program • You know that computers store information (data, programs) internally in binary form (base 2)

  43. For Next Time • Review math: base 2 and powers of 2 • Read intro, chap. 1 in text • Download first program HTML doc to your PC and make sure you can • edit it, esp. <script> … </script> • make the browser browse it • run the program

More Related