introduction to programming in javascript n.
Skip this Video
Loading SlideShow in 5 Seconds..
Introduction to Programming (in JavaScript) PowerPoint Presentation
Download Presentation
Introduction to Programming (in JavaScript)

Loading in 2 Seconds...

play fullscreen
1 / 44

Introduction to Programming (in JavaScript) - PowerPoint PPT Presentation

  • Uploaded on

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.

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about 'Introduction to Programming (in JavaScript)' - honora

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.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
introduction to programming in javascript

Introduction to Programming(in JavaScript)

David Stotts

Computer Science Department

UNC Chapel Hill

how you now see your may self
How you now see your May self

Afraid you will

become this guy 

ok ok no more fun this is science
Ok, Ok… no more fun… this is science

Class webpage

the big six
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)

model of a computer
Model of a Computer

No not this…

model of a computer1
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
model of unc
Model of UNC


Do 4 or 5 times

Pay tuition

Take fall classes

Take spring classes

Get 1.7 mil emails from Alumni Assoc


model of the solar system
Model of the Solar System

What can we study here?

What can we not study?


Scale Model of the Solar System

Scale = 1:14,000,000,000

I miss Pluto … don’t you?

m emory hierarchy
Memory Hierarchy
  • storage size increases
  • access time increases
  • cost decreases (per bit)
  • persistence increases
  • decreasing frequency of access by processor

The “cloud”





Disk drives, DVD




Main memory


what happens when you power on your computer
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

Data output

wireless, usb, net, print port,

sound, video

User input





Data to programs



Kernel talks to disk

CPU runs programs

CPU runs full OS



OS loads

CPU runs kernel

Main memory


main memory layout
Main Memory Layout

Intructions and data

all stored

in main memory (RAM)

binary representation
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:
binary representation1
Binary Representation
  • We group the 0’s and 1’s into chunks to represent different forms of information
von neumann revisited
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”
von neumann revisited1
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
0 1 bits
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
more on bits
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
powers of 2
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

powers of 21
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

binary representation2
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)


these together

first program
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



well done
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)
for next time
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