/Intro2Programming

Short course for introduction to programming with javascript

Introduction to Programming

  1. What is programming ==> The act or process of planning or writing a program, a process that leads from an original formulation of a computing problem to executable programs.
  2. What is program ==> a plan of action to accomplish a specified end, a plan or schedule of activities, proceduares to be followed.

#HTML ##Hello World

Basic html elements

<html>,<head>,<title>,<body>
<div>
<h1><h2><h3>...
<input>
<button>
  • Example 1: Basic html page
  • Lab 1: create your own page

#Javascript

JQuery

jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML

##Hello World in javascript

  • Example 2: Say hello (text field and a button)
  • Lab 2: Say hello with time

#Programming ##Variable In computer programming, a variable or scalar is a storage location and an associated symbolic name (an identifier) which contains some known or unknown quantity or information, a value. We can think variable as a grid on a shelf, and we can label it with a name.

Psudo code example: imagine in a small shop, you use a shelf to organize your income and bills, by the end of the day

first grid of the shelf is to store money earned from selling goods , give it a name "Earning"
second grid of the shelf is to store money made from vending machine:  give it a name "VendingMachine"
third grid of the to put a list of bills need to be paid, give it a name "Bills"
fourth grid is to store the money made for the past a few days, give it a name "Safe"
fifth grid has a note book which we can write number on, give it a name "Sum"

A simple program need to be run by the cashier by the end of the day is:
1. Put Earning into Safe
2. Put VendingMachine into Safe
3. Write 0 on Sum
4. For each of the bill, add the amount to Sum and write it on Sum
5. Take out "Sum" amount of money from the safe to pay bills

First operator "=" the assignment operator.

Simple data types

  1. Number: Numeric values 0, 1, 2, 3.... -1, -2, -3 0.1, 0.01, 0.001, -0.1 .... It can be written as exponential form: 100 = 1e2 (means 1 * 10^2), 0.01 = 1e-2

Math operators: +-*/%, ++,--

  1. String: Strings are useful for holding data that can be represented in text form. "Hello World", 'This is a line of text", "http://www.xinchejian.com/" ...

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String

Common string operations: +: "hello" + "world" gives "helloworld" "hello".length == 5 "hello".charAt(0) == 'h'

  1. Boolean: Logical value, can only be true or false 3<5 : true 2== 4: false "hello" == "world" : false
  • Example 3 and lab 3 to a. use a variable to get input b. create a counter to count how many times the button has been clicked. b. display the counter with the greeting.

Control flow

if

if(a > b) { b++; }else { a++; }

loop

for loop

for(var i = 0; i < 10; i ++) {
	// this would be run 10 times with i = 1, 2, 3, 4, 5, 6, 7, 8, 9 (but not 10)
}

while loop

var tasks = 10;
while(tasks > 0){
	// Work on the task
	task --;
}

do while loop

do {
	// something here
} while(finished == false);

p

Idea for tasks

multiplication table ==> loop

find cube root find prime numbers