MECHIR BANDA TEAM (MBT): Handouts

Introduction to Computing CS101 book HANDOUTS in pdf 
 
Handouts | Lectures | Contents | Books 
<div>
 </div>
<div>
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEaSmdKcQtI68P_MUNPCt9k31FBOjSIhUC35KpgxSBdwedrr6XsgB7hF-EA63kN8ybnjMgAWW_ILEhlJXLqspIeDvTQ4VSwRCGOUBsMXKSHxFBFFio5c_FKUUNIFvwykBH0i8uj3v5h8k/s1600/CS101%252BIntroduction%252Bto%252BComputing%252BLecture%252B11%252BOperating%252BSystems.jpg" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEaSmdKcQtI68P_MUNPCt9k31FBOjSIhUC35KpgxSBdwedrr6XsgB7hF-EA63kN8ybnjMgAWW_ILEhlJXLqspIeDvTQ4VSwRCGOUBsMXKSHxFBFFio5c_FKUUNIFvwykBH0i8uj3v5h8k/s1600/CS101%252BIntroduction%252Bto%252BComputing%252BLecture%252B11%252BOperating%252BSystems.jpg" /></a></div>
<div>
 </div>
<div>
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
1 
Table of Contents: 
Lecture 1 .......................................................................................................... 9 
Introduction ..................................................................................................... 9 
Lecture 2 ........................................................................................................ 13 
Evolution of Computing ................................................................................. 13 
2.2 The “Turing test” ........................................................................... 13 
2.3 Vacuum Tube – 1904: ...................................................................... 13 
2.4 ABC – 1939 ..................................................................................... 14 
2.6 ENIAC – 1946: ................................................................................ 14 
2.7 Transistor – 1947............................................................................. 14 
2.8 Floppy Disk – 1950.......................................................................... 14 
2.9 UNIVAC 1 – 1951 ............................................................................ 14 
2.11 ARPANET – 1969 ....................................................................... 15 
2.12 Intel 4004 – 1971 .......................................................................... 15 
2.13 Altair 8800 – 1975......................................................................... 15 
2.14 Cray 1 – 1 976 .............................................................................. 16 
2.15 IBM PC – 1981 ............................................................................ 16 
2.16 Apple Macintosh – 1984............................................................... 16 
2.17 World Wide Web -1989 ................................................................ 16 
2.18 Quantum Computing with Molecules.......................................... 17 
Lecture 3 ....................................................................................................... 18 
3.1 Browser .......................................................................................... 18 
3.2 URL................................................................................................... 18 
3.3 What is a Web site?............................................................................. 18 
3.4 What is Home Page of a web site? ...................................................... 19 
3.5 Who invented the Web & Why? .......................................................... 19 
3.6 Future of the Web: Semantic Web....................................................... 20 
3.7 Useful Web page ................................................................................ 20 
Lecture 4 ........................................................................................................ 21 
4.1 Computer Types According to Capability............................................ 21 
4.2 Supercomputers ................................................................................. 21 
4.3 Mainframe Computers........................................................................ 21 
4.4 Servers / Minicomputers .................................................................... 21 
4.5 Desktops............................................................................................ 21 
4.6 Portables............................................................................................ 21 
4.7 Ranking w.r.t. installed number.......................................................... 22 
4.8 All computers have the following essential hardware components:....... 22 
4.9 Input Devices..................................................................................... 23 
4.10 What is Port? .................................................................................... 24 
4.11Many Types of Ports .......................................................................... 24 
4.12 Processor.......................................................................................... 24 
4.13 Memory/Storage .............................................................................. 24 
4.14 Classifying Memory/Storage............................................................. 25 
4.15 Output Devices................................................................................. 25 
4.16 Modem............................................................................................. 25 
1.1 
1.2 
1.3 
2.5 Harvard Mark 1 – 1943:.................................................................... 14 
2.10 Compiler - 1952 ........................................................................... 15 
Charles Babbage (1791-1871)................................................................. 9 
The Analytical Engine.......................................................................... 9 
Ada, Countess of Lovelace(1815-52) ...................................................... 9 
1.4 Course Contents & Structure .............................................................. 10 
2.1 Turing Machine – 1936.................................................................... 13 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
2 
Lecture 5........................................................................................................27 
5.1 PC Parts..............................................................................................27 
5.2 Inside of the CPU ...............................................................................27 
5.3 The Processor Module ........................................................................27 
Lecture 6.........................................................................................................28 
6.1 To develop your personal Web page ....................................................28 
Lecture 7.........................................................................................................31 
7.1 Microprocessor ...................................................................................31 
7.2 Integrated Circuits..............................................................................31 
7.3 Devices...............................................................................................31 
7.4 Microprocessor system.......................................................................33 
7.5 Micro-controllers ................................................................................33 
7.6 The Main Memory Bottleneck ............................................................33 
7.7 Cache .................................................................................................33 
7.8 Microprocessors Building Blocks ........................................................34 
Lecture 8.........................................................................................................39 
Binary Numbers & Logic Operations ..............................................................39 
8.1 Why binary .........................................................................................42 
8.2 Boolean Logic Operations...................................................................43 
8.3 Truth Table for the XOR Operation ....................................................45 
8.4 STRATEGY: Divide & Conquer.........................................................45 
Lecture 9.........................................................................................................47 
HTML Lists & Tables (Web Development Lecture 3).....................................47 
9.1 Single Tags .........................................................................................47 
9.2 Types of Lists .....................................................................................52 
9.3 Ordered List Types.............................................................................52 
9.4 Useful URL ........................................................................................57 
Lecture 10 .......................................................................................................59 
Computer Software..........................................................................................59 
10.1 Machine Language............................................................................59 
10.2 Language Translators........................................................................59 
10.3 Software Development.......................................................................59 
10.4 Major Types of SW............................................................................60 
10.5 System SW are programs that … ........................................................60 
10.6 Operating System..............................................................................60 
10.7 Utilities: ............................................................................................61 
10.8 Language Translators........................................................................61 
10.9 Device Drivers...................................................................................61 
10.10 Application SW ................................................................................61 
10.11 Another way of classifying SW ..........................................................62 
10.12 Who Owns Software? .......................................................................62 
10.13 Main types of SW licensees ..............................................................62 
10.14 Proprietary SW License ....................................................................62 
10.15 Freeware SW License .......................................................................63 
10.16 Open-Source SW License .................................................................63 
10.17 Shareware SW License .....................................................................63 
10.18 Trialware .........................................................................................63 
Lecture 11........................................................................................................65 
Operating Systems ..........................................................................................65 
11.1 Why Have OSes? ...............................................................................65 
11.2 Core Tasks of an OS ..........................................................................65 
11.3 OS Components ................................................................................66 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
3 
11.4 Kernel ............................................................................................... 67 
11.5Types of OS’es ................................................................................... 67 
11.6 Another Way of Classifying................................................................ 67 
11.7 How many different OS’es are there?................................................. 67 
11.8 Comparing Popular OS’es ................................................................. 68 
Lecture 12....................................................................................................... 69 
Interactive Forms (Web Development Lecture 4)............................................ 69 
12.1 Server-Side Scripts............................................................................. 71 
12.2 Checkbox Input Element .................................................................. 76 
12.3 Radio Button Input Element............................................................. 77 
12.4 Select from a (Drop Down) List......................................................... 78 
12.5 File Upload Input Element ............................................................... 79 
Lecture 13....................................................................................................... 81 
Application Software....................................................................................... 81 
13.1 Two Major Types of Software ............................................................ 81 
13.2 Application Software ......................................................................... 81 
13.3 Classification According to the Mode ................................................ 81 
13.4 Classification According to Application Area ..................................... 81 
13.5 Scientific/Engineering/Graphics Apps ............................................. 81 
13.6 Scientific SW..................................................................................... 82 
13.7 Engineering SW................................................................................ 82 
13.8 Graphics & Animation SW (1) ........................................................... 82 
13.9 Business Applications ....................................................................... 82 
13.10 E-Commerce Software..................................................................... 82 
13.11 ERP (Enterprise Resource Planning) SW ......................................... 83 
13.12 DSS (Decision Support Systems) SW................................................ 83 
13.13 Productivity SW............................................................................... 83 
13.14 Word Processors.............................................................................. 83 
13.15 Web Page Development SW............................................................. 83 
13.16 Spreadsheet SW (1) .......................................................................... 83 
13.17 Spreadsheet SW (2).......................................................................... 83 
13.18 Presentation Development SW......................................................... 83 
13.19 Small-Scale Databases SW (1) .......................................................... 84 
13.20 Small-Scale Databases SW (2).......................................................... 84 
13.21 Productivity SW Suites..................................................................... 84 
13.22 Document-Centered Computing (DCC) - 1 ...................................... 84 
13.23 Document-Centered Computing (DCC) - 2...................................... 84 
13.24 Entertainment SW........................................................................... 84 
13.25 Music & Video Players .................................................................... 84 
13.26 Music Generation & Movie Editing SW........................................... 84 
13.27 Games ............................................................................................ 84 
13.28 Educational SW .............................................................................. 85 
13.29 Electronic Encyclopedias ................................................................ 85 
13.30 On-Line Learning ........................................................................... 85 
13.31 Interactive CD’s .............................................................................. 85 
13.32 Attributes of Good Application Software .......................................... 85 
13.33 Most Popular Application Software Categories................................. 85 
Lecture 14....................................................................................................... 87 
Word Processing............................................................................................. 87 
14.1 Word Processor................................................................................. 87 
14.2 Types: WYSIWYG-based & Markup-based ....................................... 88 
14.3 Desktop Publishing (DTP) ............................................................... 88 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
4 
14.4 Word Processors for the Web .............................................................88 
14.5 Let’s try to use MS Word for creating a CV.........................................90 
Lecture 15 .......................................................................................................91 
More on Interactive Forms (Web Development Lecture 5) ..............................91 
15.1 Single-Line Text Input Field..............................................................91 
15.2 Password Input Field ........................................................................91 
15.3 Hidden Input ....................................................................................91 
15.4 Checkbox Input Element...................................................................91 
15.5 Radio Button Input Element .............................................................91 
15.6 File Upload Input Element ................................................................91 
15.7 Reset Button Input Element ..............................................................92 
15.8 Submit Button Input .........................................................................92 
15.9 Multi-Line Text Input Area ...............................................................92 
15.10 Select from a (Drop Down) List........................................................92 
15.11 Client-Side Scripting is a viable alternate ..........................................94 
15.12 Server-Side Scripts: Review...............................................................94 
15.13 Why JavaScript? ...............................................................................96 
Lecture 16 .......................................................................................................99 
Algorithms......................................................................................................99 
16.1 Algorithm for Decimal-to-Binary Conversion ...................................100 
16.2 Algorithm (Better Definition) ..........................................................100 
16.3 Why Algorithms are Useful?.............................................................101 
16.4 Analysis of Algorithms.....................................................................101 
16.5 Al-Khwarzmi ...................................................................................101 
16.6 Greedy Algorithm............................................................................102 
16.7 Deterministic Algorithm (1) .............................................................102 
16.8 Randomized Algorithm (1) ..............................................................102 
16.9 Randomized Algorithm (2) ..............................................................102 
16.10 Deterministic Algorithm (2) ...........................................................102 
16.11 Heuristic........................................................................................102 
16.12 The Brute Force Strategy (1)...........................................................103 
16.13 The Brute Force Strategy (2) ..........................................................103 
16.14 A Selection of Algorithmic Application Areas..................................103 
16.15 Flowchart ......................................................................................104 
Lecture 17 .....................................................................................................106 
Algorithms II ................................................................................................106 
17.1 Algorithm Building Blocks ..............................................................106 
17.2 Solution in Pseudo Code..................................................................108 
17.3 Tips on Writing Good Pseudo Code.................................................108 
17.4 Pros and Cons of Flowcharts (1).......................................................117 
17.5 Pros and Cons of Flowcharts (2) ......................................................117 
17.6 Pros and Cons of Pseudo Code (1) ...................................................117 
17.7 Pros and Cons of Pseudo Code (2) ...................................................117 
Lecture 18 .....................................................................................................118 
Objects, Properties, Methods (Web Development Lecture 6).........................118 
18.1 New Concept: Client-Side Scripts ....................................................119 
18.2 Advantages of Client-Side Scripting .................................................119 
18.3 Disadvantages.................................................................................119 
18.4 JavaScript........................................................................................119 
18.5 Client-Side JavaScript ......................................................................120 
18.6 Properties........................................................................................121 
18.7 Event Handlers ...............................................................................128 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
5 
Lecture 19..................................................................................................... 129 
Programming Languages.............................................................................. 129 
19.1 Batch Programs .............................................................................. 129 
19.2 Event-Driven Programs .................................................................. 129 
19.3 Types of Prog. Languages............................................................... 130 
19.4 Programming SW Development ...................................................... 131 
19.5 Object Oriented Design .................................................................. 131 
19.6 Structured Design........................................................................... 131 
19.7 Object-Oriented Languages............................................................ 132 
Lecture 20 .................................................................................................... 133 
SW Development Methodology..................................................................... 133 
Lecture 21..................................................................................................... 142 
Data Types & Operators (Web Development Lecture 7) ............................... 142 
21.1 JavaScript Data Types.................................................................... 143 
21.2 Declaring Variables........................................................................ 144 
21.3 JavaScript Operators ...................................................................... 148 
21.4 Comparison Operators.................................................................... 148 
21.5 Logical Operators .......................................................................... 148 
21.6 Elements of JavaScript Statements ................................................. 149 
Lecture 22 .................................................................................................... 151 
Spreadsheets................................................................................................. 151 
22.1 Business Plan for a New Software Development Company .............. 151 
22.2 The Structure of A Spreadsheet ....................................................... 152 
22.3 Goal Seek ....................................................................................... 154 
Lecture 23 .................................................................................................... 158 
Flow Control & Loops (Web Development Lecture 8).................................. 158 
JavaScript Variables are Dynamically Typed .......................................... 158 
Lecture 24 .................................................................................................... 166 
Design Heuristics......................................................................................... 166 
24.1 Heuristic ........................................................................................ 166 
24.2 System............................................................................................ 166 
24.3 System Architecture........................................................................ 166 
24.4 Heuristics for system architecting ................................................... 166 
Lecture 25 .................................................................................................... 170 
Web Design for Usability .............................................................................. 170 
25.2 SPEED: ......................................................................................... 170 
25.3 Elements of Website Design: .......................................................... 171 
25.4 Website Navigation: ....................................................................... 171 
25.5 A Few Navigation Design Heuristics: ............................................. 171 
25.6 Navigation Design Heuristics (contd.):........................................... 171 
25.7 Good designs assist the user in recovering from errors..................... 173 
25.8 Assisting the User Recover from Errors: .......................................... 173 
25.9 A few constructive recommendations .............................................. 173 
25.10 Making Display Elements Legible:................................................ 175 
25.11 Ensuring Text is Readable:............................................................ 175 
25.12 Using Pictures & Illustrations: ...................................................... 176 
25.13 Using Motion................................................................................ 176 
Arrays (Web Development Lecture 9) ........................................................... 177 
26.1 Arrays in JavaScript......................................................................... 178 
26.2 Array Identifiers................................................................................ 180 
26.3 The ‘length’ Property of Arrays ....................................................... 181 
26.4 Array Methods: sort( ) 26.5 Sorts the elements in alphabetical order . 181 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
6 
26.6 Array Methods: reverse( ) 26.7 Reverses the order of the elements ....181 
26.7 Pseudo Code...................................................................................182 
Lecture 27 .....................................................................................................185 
Computer Networks......................................................................................185 
27.1 Private Networks.............................................................................186 
27.2 Public Networks .............................................................................186 
27.3 VPN: Virtual Private Network (1) ....................................................187 
27.4 Network Topologies .......................................................................188 
27.5 Networking Protocols .....................................................................190 
27.6 Types of Communication Channels.................................................191 
27.7 Network Security ............................................................................191 
Lecture 28 .....................................................................................................193 
Introduction to the Internet ...........................................................................193 
28.1 Internet: Network of Networks ...........................................................196 
28.2 Internet Networking Protocols ........................................................196 
Lecture 29 .....................................................................................................199 
Functions & Variable Scope (Web Development Lecture 10) .........................199 
29.1 Function .........................................................................................199 
29.2 Advantages of Functions .................................................................200 
29.3 Function Identifiers ........................................................................201 
29.4 Arguments of a Function.................................................................201 
29.5 Event Handlers...............................................................................203 
29.6 Scope of Variable ............................................................................204 
Lecture 30 .....................................................................................................209 
Internet Services............................................................................................209 
30.1 Internet Addressing.........................................................................210 
30.2 DNS: Domain Name System...........................................................210 
30.3 Internet Services .............................................................................210 
30.3 How does an eMail system work? ....................................................213 
30.4 Using Instant Messaging ................................................................215 
30.5 VoIP: Voice over IP.........................................................................220 
Lecture 31 .....................................................................................................221 
Developing Presentations..............................................................................221 
31.1 Presentations: ..................................................................................221 
31.2 The Structure of A Presentation: ......................................................224 
31.3 Presentation Development SW:........................................................224 
Lecture 32 .....................................................................................................226 
Event Handling (Web Development Lecture 11)............................................226 
32.1 What is Event Handling? ....................................................................228 
32.2 In-Line JavaScript Event Handling :................................................229 
Lecture 33 .....................................................................................................234 
Graphics & Animation ..................................................................................234 
33.1 Computer Graphics: ........................................................................235 
33.2 Displaying Images: .........................................................................235 
33.3 Pixel Colors :...................................................................................235 
33.4 Color Mapping : ..............................................................................235 
33.5 Dithering: .......................................................................................236 
33.6 Aliasing: .........................................................................................236 
33.7 Anti-Aliasing:..................................................................................236 
33.8 Graphics File Formats: ....................................................................237 
33.9 Vector or Object-Oriented Graphics: ...............................................237 
33.10 Bit-Mapped or Raster Graphics:.....................................................237 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
7 
33.11 File Formats Popular on the Web (1): ............................................. 237 
33.12 Image Processing:......................................................................... 237 
33.13-D Graphics: .................................................................................. 238 
33.14 Animation: .................................................................................... 238 
Lecture 34 .................................................................................................... 240 
Intelligent Systems ....................................................................................... 240 
34.1 (Artificial) Intelligent Systems: ........................................................ 241 
34.2 Fuzzy Logic: .................................................................................. 242 
34.3 Robotics: ........................................................................................ 244 
Lecture 35 .................................................................................................... 245 
Mathematical Methods (Web Development Lecture 12)................................ 245 
35.1 Problems & Solutions: .................................................................... 246 
35.2 Mathematical Functions in JavaScript: ............................................ 248 
Lecture 36 .................................................................................................... 251 
Data Management ........................................................................................ 251 
36.1 BholiBooks.com : ........................................................................... 252 
36.2 Issues in Data Management:........................................................... 252 
36.3 DBMS : .......................................................................................... 253 
36.4 OS Independence: .......................................................................... 254 
36.5 The Trouble with Flat-File Databases: ............................................ 257 
Lecture 37 .................................................................................................... 259 
Database Software ........................................................................................ 259 
37.1 RDBMS.......................................................................................... 262 
37.2 Some Terminology ......................................................................... 263 
Lecture 38 .................................................................................................... 264 
String Manipulations (Web Development Lecture 13) ................................... 264 
38.1 String Manipulation in JavaScript.................................................... 267 
Lecture 39 .................................................................................................... 274 
Cyber Crime ................................................................................................. 274 
39.1 07 February 2000 ............................................................................. 275 
39.2 DoS Attack: A Cyber Crime............................................................ 276 
39.3 More cybercrimes … ...................................................................... 276 
39.4 Viruses ........................................................................................... 277 
39.5 Other Virus-Like Programs............................................................. 278 
Lecture 40 .................................................................................................... 279 
Social Implications of Computing ................................................................. 279 
40.1 Introduction ................................................................................... 280 
40.2 Powerful Global Corporations ......................................................... 280 
40.3 The Network Organization............................................................. 280 
40.4 Working from Home ...................................................................... 281 
40.5 From Mass- to Personalized-Marketing .......................................... 281 
40.6 The Political Process ...................................................................... 282 
Lecture 41..................................................................................................... 284 
Images & Animation (Web Development Lecture 14) ................................... 284 
41.1 Images in JavaScript ....................................................................... 286 
41.2 Flash Animation ............................................................................. 293 
Lecture 42 .................................................................................................... 294 
The Computing Profession ........................................................................... 294 
42.1 IT: Information Technology............................................................ 295 
42.2 Organization: A Collection of Teams .............................................. 296 
Lecture 43 .................................................................................................... 302 
The Future of Computing ............................................................................. 302 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
8 
Lecture 44 .....................................................................................................308 
Programming Methodology (Web Development Lecture 15) .........................308 
44.1 Design Guidelines ...........................................................................309 
44.2 Coding Guidelines ..........................................................................309 
44.3 Guidelines for Developing Short Programs ......................................310 
44.4 Design & Code Reviews..................................................................311 
44.5 Testing & Debugging .....................................................................312 
44.6 Helpful Editors ...............................................................................314 
Lecture 45 .....................................................................................................316 
Review & Wrap-Up .......................................................................................316 
Course Objectives ..................................................................................323 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
9 
Lecture 1 
Introduction 
1.1. Charles Babbage (1791-1871) 
Creator of the Analytical Engine - the first general-purpose digital computer (1833) 
The Analytical Engine was not built until 1943 (in the form of the Harvard Mark I) 
1.2. The Analytical Engine 
A programmable, mechanical, digital machine 
Could carryout any calculation 
Could make decisions based upon the results of the previous calculation 
Components: input; memory; processor; output 
1.3. Ada, Countess of Lovelace(1815-52) 
Babbage: the father of computing 
Ada: the mother? 
Wrote a program for computing the Bernoulli’s sequence on the Analytical Engine - 
world’s 1st computer program 
Ada: A programming language specifically designed by the US Dept of Defense for 
developing military applications was named Ada to honor her contributions towards 
computing 
A lesson that we all can learn from Babbage’s Life 
Charles Babbage had huge difficulties raising money to fund his research 
As a last resort, he designed a clever mathematical scheme along with Ada, the Countess 
of Lovelace 
It was designed to increase their odds while gambling. They bet money on horse races 
to raise enough money to support their research experiments 
Guess what happened at the end? The lost every penny that they had. 
Fast 
Bored 
Storage 
Here is a fact: 
In 1997 Deep Blue, a supercomputer designed by IBM, beat Gary Kasparov, the World 
Chess Champion 
That computer was exceptionally fast, did not get tired or bored. It just kept on 
analyzing the situation and kept on searching until it found the perfect move from its 
list of possible moves … 
Goals for Today: 
To develop an appreciation about the capabilities of computing 
To find about the structure & policies of this course 
It could analyze up to 300 billion chess moves in 
three minutes 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
10 
CS101 Introduction to Computing 
1.4 Course Contents & Structure 
Course Objectives 
To build an appreciation for the fundamental concepts in computing 
To achieve a beginners proficiency in Web page development 
To become familiar with popular PC productivity software 
Readings 
W 
e 
e 
k 
Lecture 1 Lecture 
2 
Lecture 
3 
Web 
Dev 
UC JS 
Assignment 
1 
2 
3 
4 
5 
6 
7 
8 Midterm 
Exam 
9 
10 
11 
12 
13 
14 
15 
Finals Week 
Intro to computing 
Evolution of computing 
Computer organization 
Building a PC 
Microprocessors 
Binary numbers & logic 
Computer software 
Operating systems 
Application software 
Algorithms 
Flowcharts 
Programming languages 
Development methodology 
Design heuristics 
Web design for usability 
Computer networks 
Intro to the Internet 
Internet services 
Graphics & animation 
Intelligent systems 
Data management 
Cyber crime 
Social implications 
The computing profession 
The future of computing 
Fundamental concepts 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
11 
Web page development 
Web Development 
The World Wide Web 
Making a Web page 
Lists & tables 
Interactive forms 
Objective & methods 
Data types & operators 
Flow control & loops Arrays 
Built-in functions 
User-defined functions 
Events handling 
String manipulation 
Images & graphics 
Programming methodology 
Productivity Applications 
Word processor 
Spreadsheet 
Presentation software 
Database 
Instructor: 
Altaf Khan 
Course Web Page: 
UC - Understanding Computers (2000 ed.) 
JS - Learn JavaScript in a Weekend 
Reading Assignments 
Please make sure to read the assigned material for each week before the commencement 
of the corresponding week 
Reading that material beforehand will help you greatly in absorbing with ease the matter 
discussed during the lecture 
Check your e-mail often for announcements related to this and other VU courses 
Marks 
distribution … 
Assignments (15%) 
Almost one every week, 13 in all 
No credit for late submissions 
The lowest 2 assignment grades will be dropped 
Midterm Exam (35%) 
During the 8th week 
Duration: One hour 
Will cover all material covered during the first seven weeks 
Final Exam (50%) 
During the 16th week 
Will cover the whole of the course with a slight emphasis on the material covered after 
the midterm exam 
Duration: 2 hours 
First Assignment 
cs101@vu.edu.pk 
http://vulms.vu.edu.pk/ 
Textbooks: 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
12 
Send an email message to me at altaf@vu.edu.pk with the subject “Assignment 1” giving 
me some information (in around 50 words) about what you see yourself doing ten years 
from now 
Go to the CS101 message board and post a message (consisting of approx. 50 words) 
about how we could make the contents of this course more suitable for your individual 
needs. The subject for this message should be “Assignment 1” 
Consult the CS101 syllabus for the submission deadline 
A suggestion about unfamiliar terms 
We try not to use any new terms without explaining them first 
However, it is not possible to do that all the time 
If you encounter any unfamiliar terms during the lectures, please note them down and 
consult the GLOSSARY provided at the end of the “Understanding Computers” text 
book for their meaning 
Let’s summarize the things that we have covered today? 
A few things about: 
the very first digital computer & its inventor 
the capability of modern computers 
the structure and contents of CS101 
In the Next Lecture … 
We’ll continue the story of the evolution of digital computers form the Analytical Engine 
onwards. 
We’ll discuss many of the key inventions and developments that he lead to the shape of 
the current field of computing. 
Homew 
ork 
Assign 
ments 
15% 
Midterm 
Examin 
ation 
35% 
Final 
Examin 
ation 
50% 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
13 
Lecture 2 
Evolution of Computing 
Today’s Goal 
To learn about the evolution of computing 
To recount the important and key events 
To identify some of the milestones in computer development 
Babbage’s Analytical Engine - 1833 
Mechanical, digital, general-purpose 
Was crank-driven 
Could store instructions 
Could perform mathematical calculations 
Had the ability to print 
Could punched cards as permanent memory 
Invented by Joseph-Marie Jacquard 
2.1 Turing Machine – 1936 
Introduced by Alan Turing in 1936, Turing machines are one of the key abstractions 
used in modern computability theory, the study of what computers can and cannot do. A 
Turing machine is a particularly simple kind of computer, one whose operations are 
limited to reading and writing symbols on a tape, or moving along the tape to the left or 
right. The tape is marked off into squares, each of which can be filled with at most one 
symbol. At any given point in its operation, the Turing machine can only read or write 
on one of these squares, the square located directly below its "read/write" head. 
2.2 The “Turing test” 
A test proposed to determine if a computer has the ability to think. In 1950, Alan Turing 
(Turing, 1950) proposed a method for determining if machines can think. This method is 
known as The Turing Test. 
The test is conducted with two people and a machine. One person plays the role of an 
interrogator and is in a separate room from the machine and the other person. The 
interrogator only knows the person and machine as A and B. The interrogator does not 
know which the person is and which the machine is. 
Using a teletype, the interrogator, can ask A and B any question he/she wishes. The aim 
of the interrogator is to determine which the person is and which the machine is. 
The aim of the machine is to fool the interrogator into thinking that it is a person. If the 
machine succeeds then we can conclude that machines can think. 
2.3 Vacuum Tube – 1904: 
Interrogator 
asking 
questions 
Human 
providing 
answers 
Computer 
on its own 
providing 
answers 
Terminal 
Terminal 
Computer 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
14 
A vacuum tube is just that: a glass tube surrounding a vacuum (an area from which all 
gases has been removed). What makes it interesting is that when electrical contacts are 
put on the ends, you can get a current to flow though that vacuum. 
A British scientist named John A. Fleming made a vacuum tube known today as a diode. 
Then the diode was known as a "valve," 
2.4 ABC – 1939 
The Atanasoff-Berry Computer was the world's first electronic digital computer. It was 
built by John Vincent Atanasoff and Clifford Berry at Iowa State University during 1937- 
42. It incorporated several major innovations in computing including the use of binary 
arithmetic, regenerative memory, parallel processing, and separation of memory and 
computing functions. 
2.5 Harvard Mark 1 – 1943: 
Howard Aiken and Grace Hopper designed the MARK series of computers at Harvard 
University. The MARK series of computers began with the Mark I in 1944. Imagine a 
giant roomful of noisy, clicking metal parts, 55 feet long and 8 feet high. The 5-ton 
device contained almost 760,000 separate pieces. Used by the US Navy for gunnery and 
ballistic calculations, the Mark I was in operation until 1959. 
The computer, controlled by pre-punched paper tape, could carry out addition, 
subtraction, multiplication, division and reference to previous results. It had special 
subroutines for logarithms and trigonometric functions and used 23 decimal place 
numbers. Data was stored and counted mechanically using 3000 decimal storage wheels, 
1400 rotary dial switches, and 500 miles of wire. Its electromagnetic relays classified the 
machine as a relay computer. All output was displayed on an electric typewriter. By 
today's standards, the Mark I was slow, requiring 3-5 seconds for a multiplication 
operation 
2.6 ENIAC – 1946: 
ENIAC I (Electrical Numerical Integrator And Calculator). The U.S. military sponsored 
their research; they needed a calculating device for writing artillery-firing tables (the 
settings used for different weapons under varied conditions for target accuracy). 
John Mauchly was the chief consultant and J Presper Eckert was the chief engineer. 
Eckert was a graduate student studying at the Moore School when he met John Mauchly 
in 1943. It took the team about one year to design the ENIAC and 18 months and 
500,000 tax dollars to build it. 
The ENIAC contained 17,468 vacuum tubes, along with 70,000 resistors and 10,000 
capacitors. 
2.7 Transistor – 1947 
The first transistor was invented at Bell Laboratories on December 16, 1947 by William 
Shockley. This was perhaps the most important electronics event of the 20th century, as 
it later made possible the integrated circuit and microprocessor that are the basis of 
modern electronics. Prior to the transistor the only alternative to its current regulation 
and switching functions (TRANSfer resISTOR) was the vacuum tubes, which could only 
be miniaturized to a certain extent, and wasted a lot of energy in the form of heat. 
Compared to vacuum tubes, it offered: 
smaller size 
better reliability 
lower power consumption 
lower cost 
2.8 Floppy Disk – 1950 
Invented at the Imperial University in Tokyo by Yoshiro Nakamats 
2.9 UNIVAC 1 – 1951 
UNIVAC-1. The first commercially successful electronic computer, UNIVAC I, was 
also the first general purpose computer - designed to handle both numeric and textual 
information. It was designed by J. Presper Eckert and John Mauchly. The 
implementation of this machine marked the real beginning of the computer era. 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
15 
Remington Rand delivered the first UNIVAC machine to the U.S. Bureau of Census in 
1951. This machine used magnetic tape for input. 
first successful commercial computer 
design was derived from the ENIAC (same developers) 
first client = U.S. Bureau of the Census 
$1 million 
48 systems built 
2.10 Compiler - 1952 
Grace Murray Hopper an employee of Remington-Rand worked on the NUIVAC. She 
took up the concept of reusable software in her 1952 paper entitled "The Education of a 
Computer" and developed the first software that could translate symbols of higher 
computer languages into machine language. (Compiler) 
2.11 ARPANET – 1969 
The Advanced Research Projects Agency was formed with an emphasis towards 
research, and thus was not oriented only to a military product. The formation of this 
agency was part of the U.S. reaction to the then Soviet Union's launch of Sputnik in 
1957. (ARPA draft, III-6). ARPA was assigned to research how to utilize their 
investment in computers via Command and Control Research (CCR). Dr. J.C.R. 
Licklider was chosen to head this effort. 
Developed for the US DoD Advanced Research Projects Agency 
60,000 computers connected for communication among research organizations and 
universities 
2.12 Intel 4004 – 1971 
The 4004 was the world's first universal microprocessor. In the late 1960s, many 
scientists had discussed the possibility of a computer on a chip, but nearly everyone felt 
that integrated circuit technology was not yet ready to support such a chip. Intel's Ted 
Hoff felt differently; he was the first person to recognize that the new silicon-gated MOS 
technology might make a single-chip CPU (central processing unit) possible. 
Hoff and the Intel team developed such architecture with just over 2,300 transistors in 
an area of only 3 by 4 millimeters. With its 4-bit CPU, command register, decoder, 
decoding control, control monitoring of machine commands and interim register, the 
4004 was one heck of a little invention. Today's 64-bit microprocessors are still based on 
similar designs, and the microprocessor is still the most complex mass-produced product 
ever with more than 5.5 million transistors performing hundreds of millions of 
calculations each second - numbers that are sure to be outdated fast. 
2.13 Altair 8800 – 1975 
By 1975 the market for the personal computer was demanding a product that did not 
require an electrical engineering background and thus the first mass produced and 
marketed personal computer (available both as a kit or assembled) was welcomed with 
open arms. Developers Edward Roberts, William Yates and Jim Bybee spent 1973-1974 
to develop the MITS (Micro Instruments Telemetry Systems ) Altair 8800. The price was 
$375, contained 256 bytes of memory (not 256k),but had no keyboard, no display, and 
no auxiliary storage device. Later, Bill Gates and Paul Allen wrote their first product for 
the Altair -- a BASIC compiler (named after a planet on a Star Trek episode). 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
16 
2.14 Cray 1 – 1 976 
It looked like no other computer before, or for that matter, since. The Cray 1 was the 
world's first "supercomputer," a machine that leapfrogged existing technology when it 
was introduced in 1971. 
And back then, you couldn't just order up fast processors from Intel. "There weren't any 
microprocessors," says Gwen Bell of The Computer Museum History Center. "These 
individual integrated circuits that are on the board performed different functions." 
Each Cray 1, like this one at The Computer Museum History Center, took months to 
build. The hundreds of boards and thousands of wires had to fit just right. "It was really 
a hand-crafted machine," adds Bell. "You think of all these wires as a kind of mess, but 
each one has a precise length." 
2.15 IBM PC – 1981 
On August 12, 1981, IBM released their new computer, re-named the IBM PC. The 
"PC" stood for "personal computer" making IBM responsible for popularizing the term 
"PC". 
The first IBM PC ran on a 4.77 MHz Intel 8088 microprocessor. The PC came equipped 
with 16 kilobytes of memory, expandable to 256k. The PC came with one or two 160k 
Floppy Disks Drives and an optional color monitor. The price tag started at $1,565, 
which would be nearly $4,000 today. 
2.16 Apple Macintosh – 1984 
Apple introduced the Macintosh to the nation on January 22, 1984. The original 
Macintosh had 128 kilobytes of RAM, although this first model was simply called 
"Macintosh" until the 512K model came out in September 1984. The Macintosh retailed 
for $2495. It wasn't until the Macintosh that the general population really became aware 
of the mouse-driven graphical user interface. 
2.17 World Wide Web -1989 
"CERN is a meeting place for physicists from all over the world, who collaborate on 
complex physics, engineering and information handling projects. Thus, the need for the 
WWW system arose "from the geographical dispersion of large collaborations, and the 
fast turnover of fellows, students, and visiting scientists," who had to get "up to speed 
on projects and leave a lasting contribution before leaving." 
CERN possessed both the financial and computing resources necessary to start the 
project. In the original proposal, Berners-Lee outlined two phases of the project: 
First, CERN would "make use of existing software and hardware as well as 
implementing simple browsers for the user's workstations, based on an analysis of the 
requirements for information access needs by experiments." 
Second, they would "extend the application area by also allowing the users to add new 
material." 
Berners-Lee expected each phase to take three months "with the full manpower 
complement": he was asking for four software engineers and a programmer. The 
proposal talked about "a simple scheme to incorporate several different servers of 
machine-stored information already available at CERN." 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
17 
Set off in 1989, the WWW quickly gained great popularity among Internet users. For 
instance, at 11:22 am of April 12, 1995, the WWW server at the SEAS of the University 
of Pennsylvania "responded to 128 requests in one minute. Between 10:00 and 11:00 
2.18 Quantum Computing with Molecules 
by Neil Gershenfeld and Isaac L. Chuang 
Factoring a number with 400 digits--a numerical feat needed to break some security 
codes--would take even the fastest supercomputer in existence billions of years. But a 
newly conceived type of computer, one that exploits quantum-mechanical interactions, 
might complete the task in a year or so, thereby defeating many of the most 
sophisticated encryption schemes in use. Sensitive data are safe for the time being, 
because no one has been able to build a practical quantum computer. But researchers 
have now demonstrated the feasibility of this approach. Such a computer would look 
nothing like the machine that sits on your desk; surprisingly, it might resemble the cup of 
coffee at its side. 
Several research groups believe quantum computers based on the molecules in a liquid 
might one day overcome many of the limits facing conventional computers. Roadblocks 
to improving conventional computers will ultimately arise from the fundamental physical 
bounds to miniaturization (for example, because transistors and electrical wiring cannot 
be made slimmer than the width of an atom). Or they may come about for practical 
reasons--most likely because the facilities for fabricating still more powerful microchips 
will become prohibitively expensive. Yet the magic of quantum mechanics might solve 
both these problems. 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
18 
Lecture 3 
Today’s Goal is to … 
Become familiar with the World Wide Web 
Become familiar with the Web’s structure and how the Web works 
Learn about its genesis, its evolution, and its future 
About its impact on computing, society, commerce 
3.1 Browser 
A browser is an application program that provides a way to look at and interact with all 
the information on the World Wide Web. The word "browser" seems to have originated 
prior to the Web as a generic term for user interfaces that let you browse (navigate 
through and read) text files online. By the time the first Web browser with a graphical 
user interface was generally available (Mosaic, in 1993), the term seemed to apply to Web 
content, too. Technically, a Web browser is a client program that uses the Hypertext 
Transfer Protocol (HTTP) to make requests of Web servers throughout the Internet on 
behalf of the browser user. 
3.2 URL 
URL (Uniform Resource Locator, previously Universal Resource Locator) - pronounced 
YU-AHR-EHL or, in some quarters, UHRL - is the address of a file (resource) 
accessible on the Internet. The type of file or resource depends on the Internet 
application protocol. Using the World Wide Web's protocol, the Hypertext Transfer 
Protocol (HTTP), the resource can be an HTML page (like the one you're reading), an 
image file, or any other file supported by HTTP. The URL contains the name of the 
protocol required to access the resource, a domain name that identifies a specific 
computer on the Internet, and a pathname (hierarchical description of a file location) on 
the computer. 
On the Web (which uses the Hypertext Transfer Protocol), an example of a URL is: 
http://www.ietf.org/rfc/rfc2396.txt 
Which describes a Web page to be accessed with an HTTP (Web browser) application 
that is located on a computer named www.ietf.org. The pathname for the specific file in 
that computer is /rfc/rfc2396.txt. 
An HTTP URL can be for any Web page, not just a home page, or any individual file. 
Examples: 
http://dawn.com 
http://www.vu.edu.pk 
http://www.smeda.org.pk 
3.3 What is a Web site? 
A Web site is a related collection of World Wide Web (WWW) files that includes a 
beginning file called a home page. A company or an individual tells you how to get to 
their Web site by giving you the address of their home page. From the home page, you 
can get to all the other pages on their site. For example, the Web site for IBM has the 
home page address of http://www.ibm.com. IBM's home page address leads to 
thousands of pages but a web site can also be just of few pages. 
http://www.vu.edu.pk/ 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
19 
3.4 What is Home Page of a web site? 
1) For a Web user, the home page is the first Web page that is displayed after starting a 
Web browser like Netscape's Navigator or Microsoft's Internet Explorer. The browser is 
usually preset so that the home page is the first page of the browser manufacturer. 
However, you can set it to open to any Web site. For example, you can specify that 
"http://www.yahoo.com" or "http://whatis.com" be your home page. You can also 
specify that there be no home page (a blank space will be displayed) in which case you 
choose the first page from your bookmark list or enter a Web address. 
2) For a Web site developer, a home page is the first page presented when a user selects 
a site or presence on the World Wide Web. The usual address for a Web site is the home 
page address, although you can enter the address (Uniform Resource Locator) of any 
page and have that page sent to you. 
3.5 Who invented the Web & Why? 
"CERN is a meeting place for physicists from all over the world, who collaborate on 
complex physics, engineering and information handling projects. Thus, the need for the 
WWW system arose "from the geographical dispersion of large collaborations, and the 
fast turnover of fellows, students, and visiting scientists," who had to get "up to speed 
on projects and leave a lasting contribution before leaving." 
CERN possessed both the financial and computing resources necessary to start the 
project. In the original proposal, Berners-Lee outlined two phases of the project: 
First, CERN would "make use of existing software and hardware as well as 
implementing simple browsers for the user's workstations, based on an analysis of the 
requirements for information access needs by experiments." 
Second, they would "extend the application area by also allowing the users to add new 
material." 
Berners-Lee expected each phase to take three months "with the full manpower 
complement": he was asking for four software engineers and a programmer. The 
proposal talked about "a simple scheme to incorporate several different servers of 
machine-stored information already available at CERN." 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
20 
Set off in 1989, the WWW quickly gained great popularity among Internet users. For 
instance, at 11:22 am of April 12, 1995, the WWW server at the SEAS of the University 
of Pennsylvania "responded to 128 requests in one minute. Between 10:00 and 11:00 
3.6 Future of the Web: Semantic Web 
The Semantic Web is an idea of World Wide Web inventor Tim Berners-Lee that the 
Web as a whole can be made more intelligent and perhaps even intuitive about how to 
serve a user's needs. Berners-Lee observes that although search engines index much of 
the Web's content, they have little ability to select the pages that a user really wants or 
needs. He foresees a number of ways in which developers and authors, singly or in 
collaborations, can use self-descriptions and other techniques so that contextunderstanding 
programs can selectively find what users want. 
3.7 Useful Web page 
Web page for our “Understanding Computers” text book 
http://www.hbcollege.com/infosys/parker2000 
What have we learnt today? 
What is the World Wide Web? 
How does it work? 
About its expected evolution into the Semantic Web 
The impact of the Web on computing, society, and commerce 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
21 
Lecture 4 
Today’s Goal 
To learn to classify computers according to their capability and targeted applications 
To find out about the essential building blocks that make up a modern computer 
Computer Types According to Capability 
4.1 Computer Types According to Capability 
4.2 Supercomputers 
A supercomputer is a computer that performs at or near the currently highest 
operational rate for computers. A supercomputer is typically used for scientific and 
engineering applications that must handle very large databases or do a great amount of 
computation (or both). At any given time, there are usually a few well-publicized 
supercomputers that operate at the very latest and always incredible speeds. 
Perhaps the best-known builder of supercomputers has been Cray Research, now a part 
of Silicon Graphics. Some supercomputers are at "supercomputer center," usually 
university research centers, some of which, in the United States, are interconnected on 
an Internet backbone (A backbone is a larger transmission line that carries data gathered 
from smaller lines that interconnect with it) known as vBNS or NSFNet. 
At the high end of supercomputing are computers like IBM's "Blue Pacific," announced 
on October 29, 1998. Built in partnership with Lawrence Livermore National Laboratory 
operations per second), 15,000 times faster than the average personal computer. It 
consists of 5,800 processors containing a total of 2.6 trillion bytes of memory and 
interconnected with five miles of cable. 
4.3 Mainframe Computers 
A very large and expensive computer capable of supporting hundreds, or even 
thousands, of users simultaneously. In the hierarchy that starts with a simple 
microprocessor (in watches, for example) at the bottom and moves to supercomputers at 
the top, mainframes are just below supercomputers. In some ways, mainframes are more 
powerful than supercomputers because they support more simultaneous programs. But 
supercomputers can execute a single program faster than a mainframe. The distinction 
between small mainframes and minicomputers is vague (not clearly expressed), 
depending really on how the manufacturer wants to market its machines. 
4.4 Servers / Minicomputers 
A midsized computer. In size and power, minicomputers lie between workstations and 
mainframes. In the past decade, the distinction between large minicomputers and small 
mainframes has blurred, however, as has the distinction between small minicomputers 
and workstations. But in general, a minicomputer is a multiprocessing system capable of 
supporting from 4 to about 200 users simultaneously. 
4.5 Desktops 
These are also called microcomputers. Low-end desktops are called PC’s and high-end 
ones “Workstations”. These are generally consisting of a single processor only, some 
times 2, along with MB’s of memory, and GB’s of storage. PC’s are used for running 
productivity applications, Web surfing, messaging. Workstations are used for more 
demanding tasks like low-end 3-D simulations and other engineering & scientific apps. 
These are not as reliable and fault-tolerant as servers. Workstations cost a few thousand 
dollars; PC around a $1000. 
4.6 Portables 
Portable computer is a personal computer that is designed to be easily transported and 
relocated, but is larger and less convenient to transport than a notebook computer. The 
earliest PCs designed for easy transport were called portables. As the size and weight of 
most portables decreased, they became known as laptop computer and later as notebook 
computer. Today, larger transportable computers continue to be called portable computers. 
Most of these are special-purpose computers - for example, those for use in industrial 
environments where they need to be moved about frequently. 
in California, Blue Pacific is reported to operate at 3.9 teraflop (trillion floating point 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
22 
PDA (personal digital assistant) is a term for any small mobile hand-held device that 
provides computing and information storage and retrieval capabilities for personal or 
business use, often for keeping schedule calendars and address book information handy. 
The term handheld is a synonym. Many people use the name of one of the popular PDA 
products as a generic term. These include Hewlett-Packard's Palmtop and 3Com's 
PalmPilot. 
Most PDAs have a small keyboard. Some PDAs have an electronically sensitive pad on 
which handwriting can be received. Apple's Newton, which has been withdrawn from 
the market, was the first widely-sold PDA that accepted handwriting. Typical uses 
include schedule and address book storage and retrieval and note-entering. However, 
many applications have been written for PDAs. Increasingly, PDAs are combined with 
telephones and paging systems. 
Some PDAs offer a variation of the Microsoft Windows operating system called 
Windows CE. Other products have their own or another operating system. 
4.7 Ranking w.r.t. installed number 
PC’s 
PDA’s 
Workstations 
Servers 
Wearable (picture is provided) 
Mainframes 
Supercomputers 
At the highest level, two things are required for computing 
Hardware 
Computer equipment such as a CPU, disk drives, CRT, or printer 
Software 
A computer program, which provides the instructions which enable the computer 
hardware to work 
4.8 All computers have the following essential hardware components: 
Input 
The devices used to give the computer data or commands are called Input devices. 
Includes keyboard, mouse, scanner, etc 
Processor 
A processor is the logic circuitry that responds to and processes the basic instructions 
that drive a computer. 
The term processor has generally replaced the term central processing unit (CPU). The 
processor in a personal computer or embedded in small devices is often called a 
microprocessor. 
Short for microprocessor, the central processing unit in a computer. The processor is the 
logic of a computer and functions comparably to a human central nervous system, 
directing signals from one component to another and enabling everything to happen 
Memory 
Memory is the electronic holding place for instructions and data that your computer's 
microprocessor can reach quickly. When your computer is in normal operation, its 
memory usually contains the main parts of the operating system and some or all of the 
application programs and related data that are being used. Memory is often used as a 
shorter synonym for random access memory (RAM). This kind of memory is located on 
one or more microchips that are physically close to the microprocessor in your 
computer. Most desktop and notebook computers sold today include at least 16 
megabytes of RAM, and are upgradeable to include more. The more RAM you have, the 
less frequently the computer has to access instructions and data from the more slowly 
accessed hard disk form of storage. 
Memory is also called primary or main memory. 
Storage 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
23 
Computer storage is the holding of data in an electromagnetic form for access by a 
computer processor. It is also called secondary storage. In secondary storage data resides 
on hard disks, tapes, and other external devices. 
Primary storage is much faster to access than secondary storage because of the proximity 
of the storage to the processor or because of the nature of the storage devices. On the 
other hand, secondary storage can hold much more data than primary storage. 
Output 
The devices to which the computer writes data are called Output devices. Often converts 
the data into a human readable form. Monitor and printer are output devices. 
4.9 Input Devices 
Mouse 
A mouse is a small device that a computer user pushes across a desk surface in order to 
point to a place on a display screen and to select one or more actions to take from that 
position. The mouse first became a widely-used computer tool when Apple Computer 
made it a standard part of the Apple Macintosh. Today, the mouse is an integral part of 
the graphical user interface (GUI) of any personal computer. The mouse apparently got 
its name by being about the same size and color as a toy mouse. 
Keyboard 
On most computers, a keyboard is the primary text input device. A keyboard on a 
computer is almost identical to a keyboard on a typewriter. Computer keyboards will 
typically have extra keys, however. Some of these keys (common examples include 
Control, Alt, and Meta) are meant to be used in conjunction with other keys just like 
shift on a regular typewriter. Other keys (common examples include Insert, Delete, 
Home, End, Help, function keys, etc.) are meant to be used independently and often 
perform editing tasks. 
Joystick 
In computers, a joystick is a cursor control device used in computer games. The joystick, 
which got its name from the control stick used by a pilot to control the ailerons and 
elevators of an airplane, is a hand-held lever that pivots on one end and transmits its 
coordinates to a computer. It often has one or more push-buttons, called switches, 
whose position can also be read by the computer. 
Digital Camera 
A digital camera records and stores photographic images in digital form that can be fed 
to a computer as the impressions are recorded or stored in the camera for later loading 
into a computer or printer. Currently, Kodak, Canon, and several other companies make 
digital cameras. 
Microphone 
A device that converts sound waves into audio signals. These could be used for sound 
recording as well as voice chatting through internet. 
Scanner 
A scanner is a device that captures images from photographic prints, posters, magazine 
pages, and similar sources for computer editing and display. Scanners come in hand-held, 
feed-in, and flatbed types and for scanning black-and-white only, or color. Very high 
resolution scanners are used for scanning for high-resolution printing, but lower 
Keyboard Mouse 
Memory Printer 
Hard 
Disk 
Memory 
Bus 
System Bus 
Monitor 
Compact 
Disk 
Processor 
Integer 
Unit 
Control 
Unit 
Cache 
Memory 
Floating 
Point 
Unit 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
24 
resolution scanners are adequate for capturing images for computer display. Scanners 
usually come with software, such as Adobe's Photoshop product, that lets you resize and 
otherwise modify a captured image 
4.10 What is Port? 
On computer and telecommunication devices, a port (noun) is generally a specific place 
for being physically connected to some other device, usually with a socket and plug of 
some kind. Typically, a personal computer is provided with one or more serial ports and 
usually one parallel port. 
4.11Many Types of Ports 
Parallel 
An interface on a computer that supports transmission of multiple bits at the same time; 
almost exclusively used for connecting a printer. On IBM or compatible computers, the 
parallel port uses a 25-pin connector. 
Serial 
It is a general-purpose personal computer communications port in which 1 bit of 
information is transferred at a time. In the past, most digital cameras were connected to 
a computer's serial port in order to transfer images to the computer. Recently, however, 
the serial port is being replaced by the much faster USB port on digital cameras as well as 
computers. 
SCSI 
A port that's faster than the serial and parallel ports but slower and harder to configure 
than the newer USB port. Also know as the Small Computer System Interface. 
A high-speed connection that enables devices, such as hard-disk drives and network 
adapters, to be attached to a computer. 
USB 
USB (Universal Serial Bus) is a plug-and-play hardware interface for peripherals such as 
the keyboard, mouse, joystick, scanner, printer and modem. USB has a maximum 
bandwidth of 12 Mbits/sec and up to 127 devices can be attached. With USB, a new 
device can be added to your computer without having to add an adapter card. It typically 
is located at the back of the PC 
Firewire 
FireWire is simply a really fast port that lets you connect computer peripherals and 
consumer electronics to your computer without the need to restart. It is a simple 
common plug-in serial connector on the back of your computer. 
It has the ability to chain devices together in a number of different ways without 
terminators for example, simply join 2 computers with a FireWire cable for instant highspeed 
networking. 
4.12 Processor 
Pentium 
Celeron 
Athlon 
PowerPC 
StrongARM (PDA) 
Crusoe (Laptops) 
SPARC (Workstations) 
4.13 Memory/Storage 
RAM 
RAM (random access memory) is the place in a computer where the operating system, 
application programs, and data in current use are kept so that they can be quickly 
reached by the computer's processor. RAM is much faster to read from and write to than 
the other kinds of storage in a computer, the hard disk, floppy disk, and CD-ROM. 
However, the data in RAM stays there only as long as your computer is running. When 
you turn the computer off, RAM loses its data. When you turn your computer on again, 
your operating system and other files are once again loaded into RAM, usually from your 
hard disk. 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
25 
Punch cards 
A card on which data can be recorded in the form of punched holes. 
ROM 
ROM is "built-in" computer memory containing data that normally can only be read, not 
written to. ROM contains the programming that allows your computer to be "booted 
up" or regenerated each time you turn it on. Unlike a computer's random access memory 
(RAM), the data in ROM is not lost when the computer power is turned off. 
The ROM is sustained by a small long-life battery in your computer. 
Hard disk 
Hard disk is a computer storage device which saves and retrieves the data when 
required. Its capacity is much greater than the computer memory (RAM, ROM). Data on 
hard disk is stored and retrieved from electromagnetically charged surface. 
Today we can save huge amount of data on a single hard disk. Now hard disks can 
contain several billion bytes. 
Floppy disk 
A diskette is a random access, removable data storage medium that can be used with 
personal computers. The term usually refers to the magnetic medium housed in a rigid 
plastic cartridge measuring 3.5 inches square and about 2 millimeters thick. Also called a 
"3.5-inch diskette," it can store up to 1.44 megabytes (MB) of data. 
Tape 
In computers, tape is an external storage medium, usually both readable and writable, 
can store data in the form of electromagnetic charges that can be read and also erased. A 
tape drive is the device that positions, writes from, and reads to the tape. 
CD 
A compact disc [sometimes spelled disk] (CD) is a small, portable, round medium for 
electronically recording, storing, and playing back audio, video, text, and other 
information in digital form. 
DVD 
DVD (digital versatile disc) is an optical disc technology that is expected to rapidly 
replace the CD-ROM disc (as well as the audio compact disc) over the next few years. 
The digital versatile disc (DVD) holds 4.7 gigabyte of information on one of its two 
sides, or enough for a 133-minute movie. 
4.14 Classifying Memory/Storage 
Electronic (RAM, ROM), magnetic (HD, FD, Tape), optical (CD, DVD) 
Volatile (RAM), non-volatile (HD) 
Direct access (RAM, HD), serial access (Tape) 
Read/write (HD, RAM), read-only (CD) 
4.15 Output Devices 
Printer 
Plotter 
Speakers 
Monitor 
4.16 Modem 
Modem is output as well as input device at the same time. It receives the data (analog 
signal) coming through telephone line, converts them to digital signals and sends them to 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
26 
computer to which it is attached. It also receives the data from computer and changes it 
to analog signals. 
What have we learnt today? 
What are the various types of computers with respect to their size, capability, 
applications (FIVE TYPES) 
The five essential components of any computer are input devices, processor, memory, 
storage and output devices 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
27 
Lecture 5 
Today’s goal is quite simple … 
To learn about the various components of the popular personnel computer. 
How those things are put together to form a PC 
5.1 PC Parts 
Monitor 
Keyboard 
Mouse 
Speaker/headphone 
Microphone 
CPU 
Front buttons 
Backside ports, fan, slots, cables 
5.2 Inside of the CPU 
Power supply/fan & connectors 
Motherboard 
Bus 
Edge connectors 
Ports 
Video card 
Modem 
Network card 
Sound card 
ROM 
RAM 
Slots 
DIMM’s 
5.3 The Processor Module 
The slot on the motherboard 
The housing 
Fan 
Heat sink 
Pins (256?), Transistors (10 million?) 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
28 
Lecture 6 
Learning Goals for Today 
6.1 To develop your personal Web page 
To upload your Web page to VU’s Web server so that it becomes visible on the Internet 
as http://www.vu.edu.pk/~xxxxxxx/ 
where xxxxxxx is your user ID 
http://www.vu.edu.pk/~altaf 
HTML 
Hyper Text Markup Language 
<HTML> 
<HEAD> 
<TITLE>Altaf Khan's Home Page</TITLE> 
</HEAD> 
<BODY> 
<H1>Altaf Khan</H1> 
Adjunct Lecturer in Computer Science 
<A HREF="http://www.vu.edu.pk/">Virtual University</A> 
Building 1, 3rd Floor, Aiwan-e-Iqbal, Lahore 
+92 42 555 1212 
<A HREF="mailto:altaf@vu.edu.pk">altaf@vu.edu.pk</A> 
I teach the <A HREF="http://www.vu.edu.pk/cs101/">Introduction to 
Computing</A> course. 
</BODY> 
</HTML> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
29 
http://www.vu.edu.pk/~altaf/index.html 
http://www.vu.edu.pk/~altaf 
http://www.vu.edu.pk/~xxxxxxx 
where xxxxxxx is your user ID 
<HTML> 
… 
… 
</HTML> 
<HEAD> 
… 
… 
</HEAD> 
<TITLE> … </TITLE> 
<BODY> 
… 
… 
</BODY> 
 … 
Paragraph 
 
Line break 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
30 
 … 
Bold text 
<A HREF = “action” > label </A> 
http:// 
example: “http://www.vu.edu.pk” 
mailto: 
example: “mailto:altaf@vu.edu.pk” 
HTML Code 
I am at the 
<A HREF=“http://www.vu.edu.pk”>Virtual University</A>. You can send me an 
e-mail by clicking 
<A HREF=“mailto:bhola@vu.edu.pk”>here</A>. 
Browser Display 
I am at the Virtual University. You can send me an e-mail by clicking here. 
What have we learned today? 
We now know how Web pages are built using HTML 
We also know how to make our personal Web pages available to everyone on the Internet 
Useful URL’s 
HTML for the Conceptually Challenged 
http://www.arachnoid.com/lutusp/html_tutor.html 
NCSA’s Beginner's Guide to HTML 
http://archive.ncsa.uiuc.edu/General/Internet/WWW/HTMLPrimerAll.html 
Homework Assignment 
Develop your own home page. It should be accessible as 
http://www.vu.edu.pk/~xxxxxxx (xxxxxxxx is your user ID) 
Among other things, it should contain 
At least one link to http://www.vu.edu.pk/~altaf 
Your (clickable) email address 
A paragraph (50-100 words) on what you see yourself doing 10 years from now. 
Consult your syllabus for the submission deadline for this assignment 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
31 
Lecture 7 
Goals for Today 
Today we want to learn about the microprocessor, the key component, the brain, of a 
computer 
We’ll learn about the function of a microprocessor 
And its various sub-systems 
Bus interface unit 
Data & instruction cache memory 
Instruction decoder 
Arithmetic-Logic unit 
Floating-point unit 
Control unit 
7.1 Microprocessor 
A microprocessor (abbreviated as μP or uP) is a computer processor on a microchip. It's 
sometimes called a logic chip. A microprocessor is designed to perform arithmetic and 
logic operations that make use of small number-holding areas called registers. Typical 
microprocessor operations include adding, subtracting, comparing two numbers, and 
fetching numbers from one area to another. These operations are the result of a set of 
instructions that are part of the microprocessor design. When the computer is turned on, 
the microprocessor is designed to get the first instruction from the basic input/output 
system (BIOS) that comes with the computer as part of its memory. After that, either the 
BIOS, or the operating system that BIOS loads into computer memory, or an 
application program is "driving" the microprocessor, giving it instructions to perform. 
The number of transistors available has a huge effect on the performance of a processor. 
As seen earlier, a typical instruction in a processor like an 8088 took 15 clock cycles to 
execute. Because of the design of the multiplier, it took approximately 80 cycles just to 
do one 16-bit multiplication on the 8088. With more transistors, much more powerful 
multipliers capable of single-cycle speeds become possible. 
A microprocessor is made from miniaturized transistors and other circuit elements on a 
silicon. 
7.2 Integrated Circuits 
A chip is also called an (integrated circuit (IC) (aka microchip or just chip). It is a 
microelectronic semiconductor device consisting of many interconnected transistors and 
other components.Generally it is a small, thin piece of silicon onto which the transistors 
making up the microprocessor have been etched. 
A chip might be as large as an inch on a side and can contain tens of millions of 
transistors. Simpler processors might consist of a few thousand transistors etched onto a 
chip just a few millimeters square. Integrated circuits can be classified into analog, digital 
and mixed signal (both analog and digital on the same chip). Digital integrated circuits 
can contain anything from one to millions of logic gates, flip-flops, multiplexers, etc. in a 
few square millimeters. The small size of these circuits allows high speed, low power 
dissipation, and reduced manufacturing cost compared with board-level integration. 
The growth of complexity of integrated circuits follows a trend called "Moore's Law", it 
states that the number of transistors in an integrated circuit doubles every two years. 
7.3 Devices 
7.3.1 Transistors 
single semiconductor integrated circuit (IC) . These are made up of semiconductor and 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
32 
The transistor is a solid state semiconductor device used for amplification and 
switching, and has three terminals. A small current or voltage applied to one terminal 
controls the current through the other two, hence the term transistor; a voltage- or 
current-controlled resistor. It is the key component in all modern electronics. In digital 
circuits, transistors are used as very fast electrical switches, and arrangements of 
transistors can function as logic gates, RAM-type memory and other devices. In analog 
circuits, transistors are essentially used as amplifiers. 
7.3.2 Diodes 
A diode functions as the electronic version of a one-way valve. By restricting the 
direction of movement of charge carriers, it allows an electric current to flow in one 
direction, but blocks it in the opposite direction. 
A diode's current-voltage, or I-V, characteristic can be approximated by two regions of 
operation. Below a certain difference in potential between the two leads, the diode can 
be thought of as an open (non-conductive) circuit. As the potential difference is 
increased, at some stage the diode will become conductive and allow current to flow, at 
which point it can be thought of as a connection with zero (or at least very low) 
resistance. In a typical semiconductor p-n diode, conventional current can flow from the 
p-doped side to the n-doped side, but not in the opposite direction. When the diode is 
reverse-biased, the charge carriers are pulled away from the center of the device, creating 
a depletion region. More specifically, the transfer function is logarithmic, but so sharp 
that it looks like a corner. 
7.3.3 Resistors 
A resistor is an electrical component designed to have an electrical resistance that is 
independent of the current flowing through it. The common type of resistor is also 
designed to be independent of temperature and other factors. Resistors may be fixed or 
variable. Variable resistors are also called potentiometers or rheostats 
A few resistor types 
Some resistors are long and thin, with the actual resisting material in the centre, and a 
conducting metal leg on each end. This is called an axial package. 
Resistors used in computers and other devices are typically much smaller, often in surfacemount 
(Surface-mount technology) packages without leads. 
Larger power resistors come in more sturdy packages designed to dissipate heat 
efficiently, but they are all basically the same structure. Resistors are used as part of 
electrical networks and incorporated into microelectronic semiconductor devices. The 
critical measurement of a resistor is its resistance, which serves as a ratio of voltage to 
current and is measured in ohms, an SI unit. Any physical object is a kind of resistor. 
Most metals are conductors, and have low resistance to the flow of electricity. The 
human body, a piece of plastic, or even a vacuum has a resistance that can be measured. 
Materials that have very high resistance are called insulators. 
7.3.4 Capacitors 
A capacitor (historically known as a "condenser") is a device that stores energy in an 
electric field, by accumulating an internal imbalance of electric charge. An ideal capacitor 
can store electronic energy when disconnected from its charging circuit, so it can be used 
like a fast battery. In AC or signal circuits it induces a phase difference of 90 degrees, 
current leading potential. 
They are connected in parallel with the power circuits of most electronic devices and 
larger systems (such as factories) to shunt away and conceal current fluctuations from 
the primary power source to provide a "clean" power supply for signal or control 
circuits. The effect of such capacitors can be thought of in two different ways. One way 
of thinking about it is that the capacitors act as a local reserve for the DC power source, 
to smooth out fluctuations by charging and discharging each cycle. The other way to 
think about it is that the capacitor and resistance of the power supply circuitry acts as a 
filter and removes high frequencies, leaving only DC. 
Wires 
And are made of the following materials 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
33 
Silicon - semiconductor 
Copper - conductor 
Silicon Dioxide - insulator 
7.4 Microprocessor system 
Microprocessors are powerful pieces of hardware, but not much useful on their own. 
They do not have the sense of their own. Like the human sample it needs some 
instructions inputs and outputs to process some task. As per instruction given to the 
microprocessor. 
A microprocessor system is microprocessor plus all the components it requires to do a 
certain task. 
Shortly, a microprocessor needs help of some components to make up the task to fulfill. 
These components are input, output, storage, and memory. All these components and 
microprocessor make up a microprocessor system. 
Personal Computer is an example of microprocessor System. Another example is the 
microcontroller. 
7.5 Micro-controllers 
A microcontroller is a microprocessor optimised to be used to control electronic 
equipment. Microcontrollers represent the vast majority of all computer chips sold, over 
50% are "simple" controllers, and another 20% are more specialized decipline 
processors. While you may have one or two general-purpose microprocessors in your 
house (you're using one to read this), you likely have somewhere between one and two 
dozen microcontrollers. They can be found in almost any electrical device, washing 
machines, microwave ovens, telephones etc. 
A microcontroller includes CPU, memory for the program (ROM), memory for data 
(RAM), I/O lines to communicate with peripherals and complementary resources, all 
this in a closed chip. A microcontroller differs from a standalone CPU, because the first 
one generally is quite easy to make into a working computer, with a minimum of external 
support chips. The idea is that the microcontroller will be placed in the device to control, 
hooked up to power and any information it needs, and that's that. 
7.6 The Main Memory Bottleneck 
Modern super-fast microprocessors can process a huge amount of data in a short 
duration. They need data to be processed at the same speed. Other wise they have to sit 
idle and wait for the input/data, because speed of input is rather small then processing 
of data. They require quick access to data to maximize their performance. If they don’t 
receive the data that they require, they literally stop and wait, this results in reduced 
performance and wasted power. 
Current microprocessors can process an instruction in about ns (nanosecond). Time 
required for fetching data from main memory (RAM) is of the order of 100 ns 
Solution to the Bottleneck Problem 
In order to eliminate the solution it was suggested to make the main memory faster. But 
that evolved a problem that the 1-ns memory is extremely expensive as compared the 
currently popular 100-ns memory. 
Finally it was decided that in addition to the relatively slow main memory, put a small 
amount of ultra-fast RAM right next to the microprocessor on the same chip and make 
sure that frequently used data and instructions resides in that ultra-fast memory 
It increases the performance. It supports better over performance due to fast access to 
frequently used data and instructions. 
7.7 Cache 
A cache is a collection of duplicate data, where the original data is expensive to fetch or 
compute (usually in terms of access time) relative to the cache. Future accesses to the 
data can be made by accessing the cached copy rather than refetching or recomputing 
the original data, so that the perceived average access time is lower. Caches may mark the 
cached data as 'stale' when the original data is changed, but this is not always the case. 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
34 
On-Chip Cache Memory (1) 
That small amount of memory located on the same chip as the microprocessor is called 
On-Chip Cache Memory. 
The microprocessor stores a copy of frequently used data and instructions in its cache 
memory. When the microprocessor desires to look at a piece of data, it checks in the 
cache first. If it is not there, only then the microprocessor asks for the same from the 
main memory 
On-Chip Cache Memory (2) 
L2, cache memory, which is on a separate chip from the microprocessor but faster to 
access than regular RAM. 
It is the small size and proximity to the microprocessor makes access times short, 
resulting in a boost in performance. Microprocessors predict what data will be required 
for future calculations and it pre-fetches that data and places it in the cache so that it is 
available immediately when the need arises. 
7.8 Microprocessors Building Blocks 
Bus Interface Unit 
The bus interface unit is the part of the processor that interfaces with the rest of the PC. 
Its name comes from the fact that it deals with moving information over the processor 
data bus, the primary conduit for the transfer of information to and from the CPU. The 
bus interface unit is responsible for responding to all signals that go to the processor, 
and generating all signals that go from the processor to other parts of the system. 
It receives instructions & data from main memory to be processed and operations. After 
the operations are processed it then sends back the information (processed data) to the 
cache. It also receives the processed data to send it to the main memory. 
Instruction Decoder 
The instruction decoder of a processor is a combinatorial circuit sometimes in the form of a 
read-only memory, sometimes in the form of an ordinary combinatorial circuit. Its 
purpose is to translate an instruction code into the address in the micro memory where 
the micro code for the instruction starts. 
Registers 
Registers 
Microprocessor 
Instruction 
Cache 
Arithmetic 
& Logic 
Unit 
Control 
Bus Unit 
Interface 
Unit 
Data 
Cache 
Instruction 
Decoder 
I/O 
RAM 
Memory 
Bus 
System 
Bus 
Floating 
Point 
Unit 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
35 
A decoder is a device which is the reverse, undoing the encoding so that the original 
information can be retrieved. The same method used to encode is usually just reversed in 
order to decode.This unit receives the programming instructions and decodes them into 
a form that is understandable by the processing units, i.e. The ALU or FPU Then, it 
passes on the decoded instruction to the ALU or FPUs as desired. 
Arithmetic & Logic Unit (ALU) 
An arithmetic and logical unit (ALU) also known as “Integer Unit” is one of the core 
components of all central processing units. It is capable of calculating the results of a 
wide variety of common computations. The most common available operations are the 
integer arithmetic operations of addition, subtraction, and multiplication, the bitwise 
logic operations of AND, NOT, OR, and XOR, and various shift operations. 
The ALU takes as inputs the data to be operated on and a code from the control unit 
indicating which operation to perform, and for output provides the result of the 
computation. In some designs it may also take as input and output a set of condition 
codes, which can be used to indicate cases such as carry-in or carry-out, overflow, or 
other statuses. 
The new breed of popular microprocessors have not one but two almost identical ALU’s 
that can do calculations simultaneously, doubling the capability 
Floating-Point Unit (FPU) 
A floating point unit (FPU) is a part of a CPU specially designed to carry out 
operations on floating point numbers. Typical operations are floating point arithmetic 
(such as addition and multiplication), but some systems may be capable of performing 
exponential or trigonometric calculations as well (such as square roots or cosines). 
Not all CPUs have a dedicated FPU. In the absence of an FPU, the CPU may use a 
microcode program to emulate an FPUs function using an arithmetic and logical unit 
(ALU), which saves the added hardware cost of an FPU but is significantly slower. 
In some computer architectures, floating point operations are handled completely 
separate from integer operations, with dedicated floating point registers and independent 
clocking schemes. Floating point addition and multiplication operations are typically 
pipelined, but more complicated operations, like division, may not be, and some systems 
may even have a dedicated floating point divider circuit. 
Registers 
A register is a device for storing data. It is a small amount of very fast computer 
memory used to speed the execution of computer programs by providing quick access to 
commonly used values. These registers are the top of the memory hierarchy, and are the 
fastest way for the system to manipulate data. It is common to measure registers by the 
number of bits it can hold, for example, an "8-bit register" or "32-bit register". Registers 
are now usually implemented as an array of SRAMs, but they have also been 
implemented using individual flip flops, high speed core memory, thin film memory, and 
other ways in various machines. 
There are several other classes of registers: 
Data registers are used to store integer numbers. 
Address registers hold memory addresses and are used to access memory. 
General Purpose registers can store both data and addresses. 
Floating Point registers are used to store floating point numbers. 
Constant registers hold read-only values (e.g zero or one). 
Vector registers hold data for Single Instruction Multiple Data (SIMD) instructions. 
Special Purpose registers which store internal CPU data like the stack pointer or 
processor status words. 
The ALU & FPU store intermediate and final results from their calculations in these 
registers. Then the processed data goes back to the data cache and then to main memory 
from these registers. 
Control Unit 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
36 
A control unit is the part of a CPU or other device that directs its operation. The 
outputs of the unit control the activity of the rest of the device. A control unit can be 
thought of as a finite state machine. It is called the brain of computer microprcessor. It 
manages whole process of the microprocessor. For it identifes which data is sent to the 
ALU or memory etc. 
At one time control units for CPUs were ad-hoc logic, and they were difficult to design. 
Now they are often implemented as a microprogram that is stored in a control store. 
That was the structure, now let’s talk about the language of a microprocessor 
Instruction Set 
The set of machine instructions that a microprocessor recognizes and can execute – the 
only language microprocessor knows 
An instruction set includes low-level, a single step-at-a-time instructions, such as add, 
subtract, multiply, and divide 
Each microprocessor family has its unique instruction set 
Bigger instruction-sets mean more complex chips (higher costs, reduced efficiency), but 
shorter programs 
An instruction set, or instruction set architecture (ISA), is a specification detailing the 
commands that a computer's CPU should be able to understand and execute, or the set 
of all commands implemented by a particular CPU design. The term describes the 
aspects of a computer or microprocessor typically visible to a programmer, including the 
native datatypes, instructions, registers, memory architecture, interrupt and fault system, 
and external I/O (if any). "Instruction set architecture" is sometimes used to distinguish 
this set of characteristics from the Micro-Architecture, which are the elements and 
techniques used to implement the ISA, e.g. microcode, pipelining, cache systems, etc. 
Bigger instruction-sets mean more complex chips (higher costs, reduced efficiency), but 
shorter programs. Each microprocessor family has its unique instruction set. Following 
are the few ISA; 
MIPS 
Motorola 6800 
ARM 
PowerPC 
x86 (Pentium) 
ALGOL Object Code 
SPARC 
7.9The 1st microprocessor : Intel 4004 
The first microprocessor was the Intel 4004, introduced in 1971. The 4004 was not very 
powerful all it could do was add and subtract, and it could only do that 4 bits at a time. But it 
was amazing that everything was on one chip. Prior to the 4004, engineers built computers 
Registers 
Registers 
Arithmetic 
& Logic 
Unit 
Control 
Bus Unit 
Interface 
Unit 
Data 
Cache 
Instruction 
Decoder 
I/O 
Memory 
Bus 
System 
Bus Floating 
Point 
Unit 
Instruction 
Cache 
Microprocessor 
RAM 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
37 
either from collections of chips or from discrete components (transistors wired one at a 
time). The 4004 powered one of the first portable electronic calculators. It was as powerful 
as ENIAC which had 18000 tubes and occupied a large room. It cost less then $100. Its 
targeted use was of calculation. It consisted of 2250 transistors and 16pins. Speed was 108 
kHz, 60,000 ops/sec. 
Why Intel came up with the idea? 
A Japanese calculator manufacturer, Busicom wanted Intel to develop 16 separate IC’s 
for a line of new calculators. Intel, at that point in time known only as a memory 
manufacturer, was quite small and did not have the resources to do all 16 chips. Then 
Ted Hoff came up with the idea of doing all 16 on a single chip. Later, Intel realized that 
the 4004 could have other uses as well. 
Currently Intel came with – Intel Pentium 4 (2.2GHz). 
It was introduced in December 2001. It got 55 million transistors. 32-bit word size. 
Within the processor it has 2 ALU’s each working at 4.4GHz. It costs around $600. 
Moore’s Law 
Moore's law(1965) is an empirical observation stating in effect that at our rate of 
technological development and advances in the semiconductor industry the complexity 
of integrated circuits doubles every 18 months. His original empirical observation was 
that the number of components on semiconductor chips with lowest per-component 
cost doubles roughly every 12 months, and he conjectured that the trend will stay for at 
least 10 years. In 1975, Moore revised his estimate for the expected doubling time, 
arguing that it was slowing down to about two years 
4-, 8-, 16-, 32-, 64-bit (Word Length) 
The 4004 dealt with data in chunks of 4-bits at a time 
Pentium 4 deals with data in chunks (words) of 32-bit length 
The new Itanium processor deals with 64-bit chunks (words) at a time 
kHz, MHz, GHz (Clock Frequency) 
4004 worked at a clock frequency of 108kHz 
The latest processors have clock freqs. in GHz 
Out of 2 microprocessors having similar designs, one with higher clock frequency will 
be more powerful 
Same is not true for 2 microprocessors of dissimilar designs. Example: Out of 
PowerPC & Pentium 4 microprocessors working at the same freq, the former performs 
better due to superior design. Same for the Athlon microprocessor when compared with 
a Pentium 
Enhancing the capability of a microprocessor ? 
The computing capability of a microprocessor can be enhanced in many different 
ways: 
Evolution of Intel Microprocessors 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
38 
By increasing the clock frequency 
By increasing the word-width 
By having a more effective caching algorithm and the right cache size 
By adding more functional units (e.g. ALU’s, FPU’s, Vector/SIMD units, etc.) 
Improving the architecture 
What have we learnt today? 
Today we learnt about the microprocessor, the key component, the brain, of a computer 
We learnt about the function of a microprocessor 
And its various sub-systems 
Bus interface unit 
Data & instruction cache memory 
Instruction decoder 
ALU 
Floating-point unit 
Control unit 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
39 
Lecture 8 
Binary Numbers & Logic Operations 
The focus of the last lecture was on the microprocessor 
During that lecture we learnt about the function of the central component of a 
computer, the microprocessor 
And its various sub-systems 
Bus interface unit 
Data & instruction cache memory 
Instruction decoder 
ALU 
Floating-point unit 
Control unit 
Learning Goals for Today 
To become familiar with number system used by the microprocessors - binary numbers 
To become able to perform decimal-to-binary conversions 
To understand the NOT, AND, OR and XOR logic operations – the fundamental 
operations that are available in all microprocessors 
BINARY 
(BASE 2) 
numbers 
DECIMAL 
(BASE 10) 
numbers 
Decimal (base 10) number system consists of 10 symbols or digits 
0 1 2 3 4 
5 6 7 8 9 
Binary (base 2) number system consists of just two 
0 1 
Other popular number systems 
Octal 
base = 8 
8 symbols (0,1,2,3,4,5,6,7) 
Hexadecimal 
base = 16 
16 symbols (0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F) 
Decimal (base 10) numbers are expressed in the 
positional notation 
4202 = 2x100 + 0x101 + 2x102 + 
4x103 
The right-most is the least significant 
di i 
The left-most is the most significant digit 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
40 
Decimal (base 10) numbers are expressed 
in the positional notation 
4202 = 2x100 + 0x101 + 2x102 + 4x103 
1’s multiplier 
1 
Decimal (base 10) numbers are expressed 
in the positional notation 
4202 = 2x100 + 0x101 + 2x102 + 4x103 
10’s multiplier 
10 
Decimal (base 10) numbers are expressed in 
the positional notation 
4202 = 2x100 + 0x101 + 2x102 + 4x103 
100’s multiplier 
100 
Decimal (base 10) numbers are expressed in 
the positional notation 
4202 = 2x100 + 0x101 + 2x102 + 4x103 
1000’s multiplier 
1000 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
41 
Binary (base 2) numbers are also expressed in 
the positional notation 
10011=1x20+1x21+0x22+0x23+1x24 
The right-most is the least significant 
di i 
The left-most is the most significant digit 
Binary (base 2) numbers are also expressed 
in the positional notation 
10011=1x20+1x21+0x22+0x23+1x24 
1’s multiplier 
1 
Binary (base 2) numbers are also expressed in 
the positional notation 
10011=1x20+1x21+0x22+0x23+1x24 
8’s multiplier 
8 
Binary (base 2) numbers are also expressed in 
the positional notation 
10011=1x20+1x21+0x22+0x23+1x24 
16’s multiplier 
16 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
42 
8.1 Why binary 
Because this system is natural for digital computers 
The fundamental building block of a digital computer – the switch – possesses two 
natural states, ON & OFF. 
It is natural to represent those states in a number system that has only two symbols, 1 
and 0, i.e. the binary number system 
In some ways, the decimal number system is natural to us humans. Why? 
bit 
binary digit 
Byte = 8 bits 
Decimal Binary conversion 
. 
Check 
1001011 = 1x20 + 1x21 + 0x22 + 1x23 + 0x24 + 0x25 + 1x26 
= 1 + 2 + 0 + 8 + 0 + 0 + 64 
= 75 
Counting in 
Decimal 
0 
1 
2 
3 
4 
5 
6 
7 
8 
9 
10 
11 
12 
13 
14 
15 
16 
17 
18 
19 
20 
21 
22 
23 
24 
25 
26 
27 
28 
29 
30 
31 
32 
33 
34 
35 
36 
. 
. 
. 
01 
10 
11 
100 
101 
110 
111 
1000 
1001 
1010 
1011 
1100 
1101 
1110 
1111 
10000 
10001 
10010 
10011 
10100 
10101 
10110 
10111 
11000 
11001 
11010 
11011 
11100 
11101 
11110 
11111 
100000 
100001 
100010 
100011 
100100 
. 
. 
. 
Counting in 
Binary 
Convert 75 to Binary 
2 75 
2 37 1 
2 18 1 
2 9 0 
2 4 1 
2 2 0 
2 1 0 
0 1 
remainde 
1001011 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
43 
That finishes our first topic - introduction to binary numbers and their conversion to 
and from decimal numbers 
Our next topic is … 
8.2 Boolean Logic Operations 
Let x, y, z be Boolean variables. Boolean variables can only have binary values i.e., they 
can have values which are either 0 or 1. 
For example, if we represent the state of a light switch with a Boolean variable x, we will 
assign a value of 0 to x when the switch is OFF, and 1 when it is ON 
A few other names for the states of these Boolean variables 
0 1 
Off On 
Low High 
False True 
We define the following logic operations or functions among the Boolean 
variables 
Name Example Symbolically 
NOT y = NOT(x) x´ 
AND z = x AND y x · y 
OR z = x OR y x + y 
XOR z = x XOR y x ⊕ y 
Convert 100 to Binary 
2 10 
2 5 0 
2 2 0 
2 1 1 
2 6 0 
2 3 0 
2 1 1 
0 1 
1100100 
remainde 
r 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
44 
We’ll define these operations with the help of truth tables 
what is the truth table of a logic function 
A truth table defines the output of a logic function for all possible inputs 
Truth Table for the NOT Operation 
(y true whenever x is false) 
X y = x´ 
0 
1 
Truth Table for the NOT Operation 
X y = x´ 
0 1 
1 0 
Truth Table for the AND Operation 
(z true when both x & y true) 
X y z = x · y 
0 0 
0 1 
1 0 
1 1 
Truth Table for the AND Operation 
X y z = x · y 
0 0 0 
0 1 0 
1 0 0 
1 1 1 
Truth Table for the OR Operation 
(z true when x or y or both true) 
x y z = x + y 
0 0 
0 1 
1 0 
1 1 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
45 
Truth Table for the OR Operation 
x y z = x + y 
0 0 0 
0 1 1 
1 0 1 
1 1 1 
Truth Table for the XOR Operation 
(z true when x or y true, but not both) 
X y z = x ⊕ y 
0 0 
0 1 
1 0 
1 1 
8.3 Truth Table for the XOR Operation 
X y z = x ⊕ y 
0 0 0 
0 1 1 
1 0 1 
1 1 0 
Those 4 were the fundamental logic operations. Here are examples of a few more 
complex situations 
z = (x + y)´ 
z = y · (x + y) 
z = (y · x) ⊕ w 
8.4 STRATEGY: Divide & Conquer 
z = (x + y)´ 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
46 
x y x + y z = (x + y)´ 
0 0 0 1 
0 1 1 0 
1 0 1 0 
1 1 1 0 
z = y · (x + y) 
x y x + y z = y · (x 
+ y) 
0 0 0 0 
0 1 1 1 
1 0 1 0 
1 1 1 1 
z = (y · x) ⊕ w 
x y W y · x z = (y · x) 
⊕ w 
0 0 0 0 0 
0 0 1 0 1 
0 1 0 0 0 
0 1 1 0 1 
1 0 0 0 0 
1 0 1 0 1 
1 1 0 1 1 
1 1 1 1 0 
Number of rows in a truth table? 
2n 
n = number of input variables 
What have we learnt today? 
About the binary number system, and how it differs from the decimal system 
Positional notation for representing binary and decimal numbers 
A process (or algorithm) which can be used to convert decimal numbers to binary 
numbers 
Basic logic operations for Boolean variables, i.e. NOT, OR, AND, XOR, NOR, 
NAND, XNOR 
Construction of truth tables (How many rows?) 
Focus of the Next Lecture 
Next lecture will be the 3rd on Web dev 
The focus of the one after that, the 10th lecture, however, will be on software. During 
that lecture we will try: 
To understand the role of software in computing 
To become able to differentiate between system and application software 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
47 
Lecture 9 
HTML Lists & Tables 
(Web Development Lecture 3) 
Today is our 3rd Web Dev lecture During our 2nd lecture on Web dev … 
We learnt to develop our own Web pages in HTML 
We learnt about some of the tags used in HTML pages 
 , , , , <TITLE>, </TITLE>, <H1>, </H1> 
<HTML></HTML>, <HEAD></HEAD>, <BODY></BODY> 
<A HREF = “action” > label </A>, action=http:// or mailto: 
We also learnt about how to upload our Web pages to VU’s Web server so that it 
becomes visible on the Internet as http://www.vu.edu.pk/~xxxxxxxx/ 
where xxxxxxxx is your VU user ID 
Today’s Lecture 
We will extend our Web pages by adding a few more tags 
Specifically, we will learn about various types of lists that can be added to a Web page 
And also, about tables 
But first … 
A few comments on the general structure of HTML tags 
9.1 Single Tags 
<tagName> 
Example: 
Single Tags with Atributes 
<tagName attributes> 
Example: <HR width=“50%”> 
Paired Tags 
<tagName> … </tagName> 
Example: <H1> … </H1> 
Paired Tags with Attributes 
<tagName attributes > … </tagName> 
Example: <H1 align=“center”> … </H1> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
48 
List 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
49 
<HTML> 
<HEAD> 
<TITLE>Altaf Khan's Home Page</TITLE> 
</HEAD> 
<BODY> 
<H1>Altaf Khan</H1> 
Adjunct Lecturer in Computer Science 
<A HREF="http://www.vu.edu.pk/">Virtual University</A> 
Building 1, 3rd Floor, Aiwan-e-Iqbal, Lahore 
+92 42 555 1212 
<A HREF="mailto:altaf@vu.edu.pk">altaf@vu.edu.pk</A> 
I teach the <A HREF="http://www.vu.edu.pk/cs101/">Introduction to 
Computing</A> course. 
</BODY> 
</HTML> 
<HTML> 
<HEAD> 
<TITLE>Altaf Khan's Home Page</TITLE> 
</HEAD> 
<BODY> 
<H1>Altaf Khan</H1> 
Adjunct Lecturer in Computer Science 
<A HREF="http://www.vu.edu.pk/">Virtual University</A> 
Building 1, 3rd Floor, Aiwan-e-Iqbal, Lahore 
+92 42 555 1212 
<A HREF="mailto:altaf@vu.edu.pk">altaf@vu.edu.pk</A> 
I teach the <A HREF="http://www.vu.edu.pk/cs101/">Introduction to 
Computing</A> course. 
The additional code for the list and 
table goes here 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
50 
</BODY> 
</HTML> 
<UL> Un-ordered List 
My favorite PC games are: 
<UL> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</UL> 
My favorite sports are: 
<TABLE border = “1” > 
<TR> 
<TH>Indoor</TH> 
<TH>Outdoor</TH> 
</TR> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
My favorite PC games are: 
<UL> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</UL> 
My favorite sports are: 
<TABLE border = “1” > 
<TR> 
<TH>Indoor</TH> 
<TH>Outdoor</TH> 
</TR> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
Additional 
code 
Code for 
the list 
Code for 
the table 
HTML Code 
<UL> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</UL> • SimCity 
• Quake 
• Bridge 
Browser Display 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
51 
<LI> Line Item 
The default “bullet” for these lists is a “disc” 
That, however, can be changed to a “circle” or a “square” with the help of the type 
attribute 
HTML Code 
<UL type = “circle”> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</UL> 
• SimCity 
• Quake 
• Bridge 
Browser Display 
Q: What happens if I start a new list without 
<UL> closing the original one? 
<LI>SimCity</LI> 
<LI>Quake II</LI> 
<UL> 
<LI>SimCity 3000</LI> 
<LI>Quake III</LI> 
</UL> 
<LI>Bridge</LI> 
</UL> 
• SimCity 
• Quake II 
• SimCity 
3000 
• Quake 
III 
• Bridge 
Browser Display 
􀂾 Different bullets 
􀂾 Additional tab 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
52 
Such structures, i.e., those in which another starts before the first list is finished, are 
called Nested Lists 
9.2 Types of Lists 
In addition to un-ordered lists, HTML supports two other types 
Ordered Lists 
Definition List 
9.3 Ordered List Types 
Type Result 
“A” A, B, C, … 
“a” a, b, c, … 
“I” I, II, III, IV, … 
“i” i, ii, iii, iv, … 
“1” 1, 2, 3, … 
Ordered List 
<OL> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</OL> 
1. SimCity 
2. Quake 
3. Bridge 
Browser Display 
OL instead 
of UL 
Numbers instead 
of discs, circles or 
squares 
Ordered List 
<OL type = “a”> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</OL> 
a. SimCity 
b. Quake 
c. Bridge 
Browser Display 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
53 
<DL> Definition List 
<DT> Term 
<DD> Definition 
Q: How would one start an ordered list with 
something other than 1 
25. SimCity 
26. Quake 
27. Bridge 
Browser 
Display 
Ordered List 
<OL start = “25”> 
<LI>SimCity</LI> 
<LI>Quake</LI> 
<LI>Bridge</LI> 
</OL> 
25. SimCity 
26. Quake 
27. Bridge 
Browser Display 
Definition List 
<DL> 
<DT>SimCity</DT> 
<DD>A great 
simulation 
game in 
which one 
build cities 
</DD> 
<DT>Quake</DT> 
<DD> One of the 
best of the 
shoot-em-up 
genre </DD> 
</DL> 
SimCity 
A great 
simulation 
game in which 
one build 
cities 
Quake 
One of the 
best of the 
shoot-emup 
genre 
Browser 
Display 
Ter 
Definition 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
54 
Ordered lists as well as definition lists can be nested just like the un-ordered lists 
Can any type of list be nested into any other type? 
Lists are one way of presenting data in a an ordered or formal fashion 
Tables provide another - more customizable - way of displaying ordered information 
on Web pages 
<TABLE> Table 
(made up of rows) 
<TR> Row 
(made up of data cells) 
<TH> 
Heading Data Cell 
(Can contain paragraphs, images, lists, 
forms, tables) 
<TD> 
Data Cell 
(Can contain paragraphs, images, lists, 
forms, tables) 
<TABLE> Attributes 
BORDER 
Browser Display 
Squash Cricket 
Indoor Outdoor 
HTML Code 
<TABLE border = "1" > 
<TR> 
<TH>Indoor</TH> 
<TH>Outdoor</TH> 
</TR> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
Browser Display 
Squash Cricket 
Indoor Outdoor 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
55 
Determines the thickness of the table border 
Example: <TABLE BORDER = “2”> 
CELLPADING 
Determines the distance between the border of a cell and the contents of the cell 
Example: <TABLE CELLPADDING = “3”> 
CELLSPACING 
Determines the empty spacing between the borders of two adjacent cells 
Example: <TABLE CELLSPACING = “1”> 
<TABLE>,<TR>,<TH>,<TD> Attributes 
ALIGN 
Possible values: Center, Left, Right 
Example: <TH ALIGN = “center”> 
BGCOLOR 
Example: <TD BGCOLOR = “red”> 
WIDTH 
HTML Code 
<TABLE border = "1" > 
<TR> 
<TH>Indoor</TH> 
<TH>Outdoor</TH> 
</TR> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
HTML Code 
Squash Cricket 
Indoor Outdoor 
HTML Code 
<TABLE> 
<TR> 
<TH>Indoor</TH> 
<TH>Outdoor</TH> 
</TR> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
Browse Display 
Indoor Outdoor 
Squash Cricket 
50% of 
the 
screen 
width 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
56 
Example: <TR WIDTH = “40%”> 
HEIGHT 
Example: <TABLE HEIGHT = “200”> 
<TR> Attributes 
VLAIGN 
Determines the vertical alignment of the contents of all of the cells in a particular row 
Possible values: Top, Middle, Bottom 
Example: <TR VALIGN = “bottom”> 
<TH> & <TD> Attributes 
NOWRAP 
Extend the width of a cell, if necessary, to fit the contents of the cell in a single line 
Example: <TD NOWRAP> 
COLSPAN 
No. of rows the current cell should extend itself downward 
Example: <TD COLSPAN = “2”> 
ROWSPAN 
The number of columns the current cell should extend itself 
Example: <TD ROWSPAN = “5”> 
VALIGN 
Same as that for <TR> 
Expenses Income 
Year Quarter 
Quetta Dubai Quetta Dubai 
1 1,900 8,650 9,000 7,780 
2 2,230 8,650 8,500 8,670 
2001 
3 4,000 8,650 9,900 9,870 
HTML CODE 
<TABLE border=“1” > 
<TR> 
<TH colspan=“2”> 
Indoor Outdoor 
</TH> 
</TR> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
Browse Display 
Indoor Outdoor 
Squash Cricket 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
57 
4 2,200 8,650 9,800 9,900 
1 7,780 8,650 7,780 9,000 
2 8,670 8,650 8,670 8,500 
3 9,870 8,650 9,870 9,900 
2002 
4 9,900 8,650 9,900 9,800 
Must be placed 
immediately after 
the<TABLE> tag 
9.4 Useful URL 
The Table Sampler 
In Today’s Lecture … 
We learnt how to extend our Web pages by adding a few more tags 
HTMAL Code Browser Display 
<TABLE border = "1" > 
<CAPTION> 
My favorite sports 
</CAPTION> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
My favorite sports 
Squash Sports 
HTMAL Code 
<TABLE border = "1" > 
<CAPTION> 
My favorite sports 
</CAPTION> 
<TR> 
<TD>Squash</TD> 
<TD>Cricket</TD> 
</TR> 
</TABLE> 
Browser Display 
My favorite sports 
Squash Sports 
Must be placed 
immediately after 
the<TABLE> tag 
http://hissa.nist.gov/~black/tableQuikRef.html 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
58 
Specifically, we discussed various types of lists that can be added to a Web page – unordered, 
ordered and definition lists 
And also, about tables: about various tags used in a table and their associated attributes 
Next Web Dev Lecture: 
Interactive Forms 
We will try to understand the utility of forms on Web pages 
We will find out about the various components that are used in a form 
We will become able to build a simple, interactive form 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
59 
Lecture 10 
Computer Software 
Lecture 8 was on the binary number system and logic operations 
Learning Goals for Today 
To discuss the role of software in computing systems 
To learn to differentiate among software belonging to the system and application 
categories 
To learn about software ownership 
We mentioned in Lecture 4 that at the highest level, two things are required for 
computing 
Hardware: The physical equipment in a computing environment such as the computer 
and its peripheral devices (printers, speakers...) 
Software: The set of instructions that operates various parts of the hardware. Also 
termed as “computer program” 
Computer Software 
The HW needs SW to be useful; the SW needs HW to be useful 
When the user needs something done by the computer, he/she gives instructions in the 
form of SW to computer HW 
These instructions need to be written in a language that is readily understood by 
computer uP 
10.1 Machine Language 
A system of codes directly understandable by a computer's CPU is termed this CPU's 
native or machine language. Although machine code may seem similar to assembly language 
they are in fact two different types of languages. Machine code is composed only of the 
two binary digits 0 and 1. 
Every CPU has its own machine language, although there is considerable overlap 
between some. If CPU A understands the full language of CPU B it is said that A is 
compatible with B. CPU B may not be compatible with CPU A, as A may know a few 
codes that B does not. 
10.2 Language Translators 
Human programmers write programs in a language that is easy to understand for them. 
They use language translators to convert that program into machine language. It 
converts the human understandable code in uPs understandable code, i.e. a language that 
is easy to understand for the uPs 
10.3 Software Development 
A software development process is a process used to develop computer software. It 
may be an ad hoc process, devised by the team for one project, but the term often refers 
to a standardised, documented methodology which has been used before on similar 
projects or one which is used habitually within an organisation. 
The SW development process involves many steps, and coding, that is typing the 
instructions in a high-level language is only a small part of that process – taking-up only 
around 15% of the effort 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
60 
10.4 Major Types of SW 
System SW 
System software is responsible for controlling, integrating, and managing the individual 
hardware components of a computer system. 
System software performs tasks like transferring data from memory to disk, or rendering 
systems, device drivers, compilers, assemblers, linkers, and utilities. 
Software libraries that perform generic functions also tend to be regarded as system 
software. System software stored on non-volatile storage on integrated circuits is usually 
termed firmware. These generally perform the background tasks in a computer. These 
programs, many times, talk directly to the HW. 
Application SW 
Programs that generally interact with the user to perform work that is useful to the user. 
These programs generally talk to the HW through the assistance of system SW. 
10.5 System SW are programs that … 
Control the overall operation of the computer 
OS 
Interact directly with HW 
Device drivers 
Perform system management & maintenance 
Utilities 
Are used to develop or maintain other programs 
Language translators 
10.6 Operating System 
Concept&Feasibility 
User Requirements 
Developer Specs 
Planning 
Design 
Implementation 
The Software Development Process 
Hardware 
Operating System 
Utility Language 
Translator 
Device Driver 
Scientific 
Apps. 
Business 
Apps. 
Productivity 
Apps. 
Entertainment 
Apps. 
System software 
Application software 
text onto a display specific kinds of system software include loading programs, operating 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
61 
It performs its work invisibly to control the internal functions of a computer, e.g. 
maintaining files on the disk drive, managing the screen, controlling which tasks the uP 
performs and in what order. It interacts directly with the computer HW. Other SW 
normally does not directly interact with the HW, e.g. 
Windows Mac OS Linux 
UNIX Solaris DOS 
CP/M VMS Firmware 
ROM is a component of OS that permanently stored on a chip. It is a firm ware 
program. When a computer is powered-on, it is the first program that it always executes. 
Firmware consists of startup and a few low-level I/O routines that assist the computer 
in finding out and executing the rest of the OS. On IBM-compatible PC’s, it is called 
BIOS 
10.7 Utilities: 
It is a small program that provides an addition to the capabilities provided by the 
operating system. In some usages, a utility is a special and nonessential part of the 
operating system. These are the computer programs that perform a particular function 
related to computer system management and maintenance 
Examples: 
1. Anti-virus SW 
2. Data compression SW 
Disk optimization SW 
Disk backup SW 
10.8 Language Translators 
Programs that take code written in a HLL and translate it into a low-level language that 
is easily understood by the uP 
1. Compiler translates the program written in a HLL in one go. The translated code is 
then used by the uP whenever the program needs to be run 
2. Interpreter translates the HLL program one statement at time. It reads a single 
statement, translates it into machine language and passes that machine language code to 
the uP and then translates the next statement, and so on … 
10.9 Device Drivers 
A device driver, often called a driver for short, is a computer program that is intended 
to allow another program (typically, an operating system) to interact with a hardware 
device. Think of a driver as a manual that gives the operating system (e.g., Windows) 
instructions on how to use a particular piece of hardware. 
A device driver essentially converts the more general input/output instructions of the 
operating system to messages that the device type can understand. 
10.10 Application SW 
Application SW are programs that interact directly with the user for the performance of 
a certain type of work 
Scientific/engineering/graphics SW 
Mathematica; AutoCad; Corel Draw 
Business SW 
The billing system for the mobile phone company 
Productivity SW 
Word processors; Spreadsheets 
Entertainment SW 
Games 
Educational SW 
Electronic encyclopedias; The VU Web site 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
62 
10.11 Another way of classifying SW 
Shrink-Wrapped SW 
You can just go to a shop and buy it 
Custom-built SW 
You cannot just go to a shop and buy it; you have to find someone who can develop it 
for you 
Shrink-Wrapped SW 
SW built in such a way that it is useful for many different users in many different ways. 
Example: MS Word. Individuals use it and so do many large corporations. It is used 
for writing one-page letters and also to typeset books 
Custom-Built SW (1) 
These SW are built for a particular organization to fulfill the needs of that particular 
organization. This type of SW is expensive because the builder has to recoup costs and 
make a profit from a single sale 
Example: A system for predicting the preferences of the Nortwest Airline pilots 
Custom-Built SW (2) 
This is other type of custom built SW. The delivery time is longer. Customers get more 
productivity out of it because it is built according to their exact specifications – just like a 
custom-built shoe fits better, but generally is more expensive, and requires a longer 
period for delivery 
10.12 Who Owns Software? 
Generally, although a piece of SW that is being used by millions, it is not owned by any 
of them! Instead, it is owned by the maker of the SW 
The makers let us use their SW but keep the ownership to themselves. When we buy a 
SW package, we do not really buy it – we just buy a license that allows us to use it, the 
ownership stays with the maker 
However, there are variations on this theme … 
10.13 Main types of SW licensees 
Proprietary – Most software on a Windows PC or a Macintosh belongs to this category 
Freeware – Most software on a Linux PC belongs to that category 
Shareware – the category which lies between the above two categories 
10.14 Proprietary SW License 
Proprietary software, as defined by the Free Software Foundation, means any software 
that is not free software or is only partially free. The modification, use and redistribution 
Hardware 
Operating System 
Utility Language 
Translator 
Device Driver 
Scientific 
Apps. 
Business 
Apps. 
Productivity 
Apps. 
Entertainment 
Apps. 
System software 
Application software 
are prohibited, or requires express permissions from the originator. The user needs to 
pay the maker of the SW for buying a license that allows the user to use the SW 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
63 
The license, generally, does not transfer the ownership of the SW; it just allows the user 
to use it. The user is legally barred from making copies of the licensed SW. Generally, 
the license is for the personal use only. Most SW in use in the world is of this type. 
Examples: Windows, Mac OS, MS Word, Adobe Photoshop, Norton Antivirus 
Types of Proprietary Licenses 
Single-user license 
Multi-user license 
Concurrent-user license 
Site license 
10.15 Freeware SW License 
It is also known as “Public Domain SW”. It allows the user to free use of the SW. The 
author, however, generally retains ownership. It can usually be downloaded from various 
Web sites. 
Examples: Linux; LaTeX; Netscape Web browser – the Navigator; MS Web browser – 
the Internet Explorer 
10.16 Open-Source SW License 
Some authors give away the machine code only, which is extremely difficult to modify, if 
at all. Others even give away the high-level language source code so that users can make 
changes according to their own requirements. The later practice is called open-source 
licensing. 
Generally is any computer software whose source code is either in the public domain or, 
more commonly, is copyrighted by one or more persons/entities and distributed under 
an open-source license . Such a license may require that the source code be distributed 
along with the software, and that the source code be freely modifiable, with at most 
minor restrictions, such as a requirement to preserve the authors' names and copyright 
statement in the code, 
Examples: Linux; Netscape Navigator 
10.17 Shareware SW License 
Shareware is software that is distributed without payment ahead of time as is common 
for proprietary software. Typically shareware software is obtained free of charge by 
downloading, thus allowing one to try out the program ahead of time. A shareware 
program is accompanied by a request for payment, and often payment is required per the 
terms of the license past a set period of time. shareware are similar in that they can be 
obtained and used without monetary cost. Usually shareware differs from open source 
software in that requests of voluntary "shareware fees" are made, often within the 
program itself, and in that source code for shareware programs is generally not available 
in a form that would allow others to extend the program. 
A shareware's program source, maintenance and extensibililty can sometimes be 
negotiated for a licensing fee with the author(s) similar to standard proprietary software. 
Examples: WinZip, Download Accelerator 
10.18 Trialware 
It is similar to shareware but difference is that the SW is usable for a short period only. 
When the period is expired, it is no more in use until the license is not purchased. The 
trial period may vary according to its developer. This period may range from a week to a 
few months. 
It can be downloaded from the Internet or alternatively. 
What have we learnt today? 
We have found out about the role software plays in a computing environment 
We also learned to distinguish between software belonging to the system and application 
categories 
We also discussed the different types of software licenses 
Topics of some of the future lectures 
Operating system 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
64 
Application SW 
Productivity SW 
Word processor 
Spreadsheets 
Presentation making 
Databases 
Programming Languages 
The SW development process 
The Web development series of lectures is clearly focused on developing SW 
Focus of the Next Lecture 
The role of the OS in a computing environment 
The various functions that an OS performs 
The main components of an OS 
Various types of OSes 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
65 
Lecture 11 
Operating Systems 
Focus of the last lecture: computer SW 
We found out about the role SW plays in a computing environment 
We learned to distinguish between SW belonging to the system & application categories 
Also discussed the different types of SW licenses: 
Proprietary 
Free 
Open source 
Shareware 
Trialware 
Learning Goals for Today 
The role of the operating system in a computing environment 
The various functions that an operating system performs 
The main components of an operating system 
Various types of operating systems 
11.1 Why Have OSes? 
User/programmer convenience 
Greater resource utilization 
The Role of An OS 
The 1st program that runs when a typical computer is turned ON, and the last one to 
finish running when the computer is turned OFF. 
It manages the HW and SW resources of the computer system, often invisibly. These 
include the processor, memory, disk drives, etc. 
It provides a simple, consistent way for applications to interact with the HW without 
having to know all the details of the HW 
Advantage for App. Developers 
Application developers do not need to know much about the HW while they are 
developing their app 
They just develop with a particular OS in mind. If the OS runs on many types of 
computers having different HW configurations, so will the app – without making any 
HW-specific modifications in the app SW. The OS hides the HW differences from the 
app 
Are OS’es Essential? 
No. If a computer has been designed for limited functionality (e.g. it runs just a single 
program all the time as in a automatic clothes washing machine), it does not require a 
traditional OS 
In limited-functionality computers, an OS just adds to the overhead unnecessarily, which 
impedes the computer’s performance 
that is going to run 
In the beginning … 
A single user ran a single program ran on a single computer – there was no need for an 
OS 
Then came computer operators who ran multiple programs for multiple users one after 
the other – still, no need for an OS 
simultaneously. That’s when the need for OS’es arose for: 
Managing the resources of the computers efficiently 
Making use of computers convenient for users/programmers 
11.2 Core Tasks of an OS 
Processor management 
Memory management 
Device management 
Storage management 
In these situations, the required parts of the OS are integrated into the only program 
Later computers became powerful and able to run multiple programs, 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
66 
Application Interface 
User Interface 
Processor Management 
Memory Management 
Straight forward for a single-user, single tasking 
Each app must have enough private memory in which to execute 
App can neither run into the private memory space of another app, nor be run into by 
another app 
Different types of memory (e.g. main, cache) in the system must be used properly, so 
that each app can run most effectively 
Storage Management 
The OS manages storage through one of its sub-modules, the File Manager 
A file system is a collection of directories, subdirectories, and files organized in a logical 
order. 
File manager maintains an index of the filenames & where they are located on the disk. 
File manager make it easy to find the required file in a logical and timely fashion. 
Device Management 
Applications talk to devices through the OS and OS talks to and manages devices 
through Device Drivers 
Example: When we print to a laser printer, we do not need to know its details. All we 
do is to tell the printer device driver about what needs to be printed and it takes care of 
the details 
Application Interface 
App developers do not need to know much about the HW, especially the uP, while they 
are developing their app 
The OS provides all apps with a straight-forward and consistent interface to the HW 
Example: An app uses the OS to store data on the disk drive. For that, the app does not 
need to know about the exact physical characteristics of that drive; it just tells the OS to 
do that through the app interface, and the OS takes cares of all the details of the task 
User Interface 
Users communicate with the computer using a consistent user interface provided by the 
OS 
This UI can be a command-line interface in which a user types in the commands. 
Example: 
copy a:/file1.html c:/file1.html 
Or, it can be a graphical UI, where Windows, Icons, Menus, and a Pointing device (such 
as a mouse) is used to receive and display information. Example: 
With the help of the mouse, drag file1.html from drive a to drive c 
11.3 OS Components 
Error! 
Kernel 
Command 
Interpreter 
(Shell) 
File 
Manager 
Device 
Manager 
GUI 
Loader 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
67 
11.4 Kernel 
The heart of the OS 
Responsible for all the essential operations like basic house keeping, task scheduling, etc. 
Also contains low-level HW interfaces 
Size important, as it is memory-resident 
11.5Types of OS’es 
Classification w.r.t. the type of computers they run on and the type of applications they 
support 
Real-Time Operating System (RTOS) 
Single-User, Single Task 
Single-User, Multi-Tasking 
Multi-User 
RTOS (1) 
Used to run computers embedded in machinery, robots, scientific instruments and 
industrial systems 
Typically, it has little user interaction capability, and no end-user utilities, since the 
system will be a "sealed box" when delivered for use 
Examples: Wind River, QNX, Real-time Linux, Real-time Windows NT 
RTOS (2) 
An important part of an RTOS is managing the resources of the computer so that a 
particular operation executes in precisely the same amount of time every time it occurs 
In a complex machine, having a part move more quickly just because system resources 
are available may be just as catastrophic as having it not move at all because the system 
was busy 
Single-User, Single Task 
OS’es designed to manage the computer so that one user can effectively do one thing at 
a time 
The Palm OS used in many palmtop computers (PDA’s) is an example of a single-user, 
single-task OS 
Single-User, Multi-Tasking 
Most popular OS 
Used by most all PC’s and Laptops 
Examples: Windows, Mac OS, Linux 
Lets a single user interact with several programs, simultaneously 
Multi-User 
A multi-user OS allows many users to take advantage of the computer's resources, 
simultaneously 
The OS must make sure that the requirements of the various users are balanced, and that 
the programs they are using each have sufficient and separate resources so that a 
problem with one user doesn't affect any of the other users 
Examples: Linux, Unix, VMS and mainframe OS’es, such as MVS 
11.6 Another Way of Classifying 
Uni-processor OS’es 
Designed to schedule tasks on a single uP only 
Example: DOS 
Multi-processor OS’es 
Can control computers having multiple uPs, at times 1000’s of them 
Example: Current versions of Windows, Mac OS, Linux, 
Solaris 
11.7 How many different OS’es are there? 
100’s 
OS’es from the Windows family dominate the desktops and run on millions of PC’s 
OS’es from the Unix family (Unix, Linux, etc) are quite popular on servers 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
68 
There are hundreds more. Some designed for mainframes only. Some for embedded 
applications only. 
11.8 Comparing Popular OS’es 
OS HW Stability Cost Apps. Support Security Popularity 
Windows 
(GUI) PC Poor $300 Huge 
no. OK Poor Amazing 
Mac OS 
(Shell/GUI) Mac Good $60 Many OK Good Low 
Linux 
(Shell/GUI) Many Good Low Many Variable Good Low 
Unix 
(Shell/GUI) Many Excellent High Many Expensive Excellent Servers 
What have we learnt today? 
The role of the OS in a computing environment 
The various functions that an OS performs 
The main components of an OS 
Various types of OS’es 
Next Lecture: Application SW 
We’ll learn about application SW, i.e. programs that interact directly with the user for the 
performance of a certain type of work 
We’ll try to become familiar with various SW used in the following application areas: 
Scientific/engineering/graphics 
Business 
Productivity 
Entertainment 
Educational 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
69 
Lecture 12 
Interactive Forms 
(Web Development Lecture 4) 
Focus of the last lecture was on HTML Lists & Tables 
We learnt how to extend our Web pages by adding a few more tags 
Specifically, we discussed various types of lists that can be added to a Web page – unordered, 
ordered and definition lists 
And also, about tables: about various tags used in a table and their associated attributes 
Today’s Lecture 
We will try to understand the utility of forms on Web pages 
We will find out about the various components that are used in a form 
We will become able to build a simple, interactive form 
Interactive Forms (1) 
Without forms, a Web site is “read-only” – it just provides information to the user 
Forms enable the user to provide information to the Web site. For example, the user 
can: 
Perform searches on Web site 
Give comments 
Ask for info that is not available on the Website 
Place order for goods and services 
Interactive Forms (2) 
Can be simple or very complex 
Can fill a whole page or just a single line 
Can contain a single element or many 
Are always placed between the <BODY> and </BODY> tags of a Web page 
Interactive Forms (3) 
Are GUI-based 
May contain: 
Text fields 
Check boxes 
Buttons 
Scrollable lists 
Code for that Example 
<HTML> 
<HEAD> 
<TITLE>Send Email to me</TITLE> 
</HEAD> 
A Simple 
Example 
of 
Interactive 
Forms 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
70 
<BODY> 
<H1>Send Email to me</H1> 
Code for the instructions 
Code for the form 
</BODY> 
</HTML> 
Code for the Instructions 
To send an eMail message to me: 
<OL> 
<LI>Type your eMail address in the &quot;From&quot; field</LI> 
<LI>Type a short message in the &quot;Message&quot; field</LI> 
<LI>Press the &quot;Send eMail to me&quot; button</LI> 
</OL> 
Code for the Form 
<FORM name="sendEmail" method="post" action="sendMailScriptURL"> 
Elements of the form 
</FORM> 
A Simple 
Example 
of 
Interactive 
Forms 
A Simple 
Example 
of 
Interactive 
Forms 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
71 
12.1 Server-Side Scripts 
Receive info that a user enters in a form 
Process that info and take appropriate action 
Examples: 
CGI scripts on Unix servers 
ASP scripts on Windows servers 
Elements of the Form (1) 
From: <INPUT type="text" name=“sender" size="50"> 
Message: <INPUT type="text" name="message" size="50"> 
<FORM name="sendEmail" method="post" 
action="sendMailScriptURL"> 
Elements of the form 
</FORM> 
A Simple 
Example 
of 
Interactive 
Forms 
name: Name given to the form 
method: Forms can be submitted through two 
alternate methods – GET & POST 
when the form is being submitted 
action: Specifies the URL that is accessed 
Are programs that reside on Web servers 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
72 
Elements of the Form (2) 
<INPUT type="hidden" name="receiver" value="altaf@vu.edu.pk"> 
<INPUT type="hidden" name=“subject” value=“eMail from the form”> 
<INPUT type="submit“ name="sendEmail" value="Send eMail to me"> 
A Simple 
Example 
of 
Interactive 
Forms 
A Simple 
Example 
of 
Interactive 
Forms 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
73 
<TEXTAREA 
name=“message” 
cols=“38” 
rows=“6” 
> 
</TEXTAREA> 
<FORM name="sendEmail" method="post" action=“sendMailScriptURL"> 
<table><tr> 
<td>From: </td> 
<td><INPUT type="text" name="sender" size="50"></td> 
</tr><tr> 
<td>To: </td> 
<td><INPUT type="text" name="receiver" size="50"></td> 
</tr><tr> 
<td>Subject: </td> 
<td><INPUT type="text" name="subject" size="50"></td> 
</tr><tr> 
<td valign="top">Message: </td> 
<td><TEXTAREA name="message" cols="38"rows="6"> 
</TEXTAREA></td> 
</tr><tr> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
74 
<td colspan="2" align="right"> 
<INPUT type="submit" name="sendEmail" value="Send eMail"> 
</td> 
</tr></table> 
</FORM> 
<INPUT 
type=“text” name=“sender” 
size=“50” 
value=“your eMail address goes here” 
Review of the Tags Used in Forms 
<FORM> 
name=“nameOfTheForm” 
method=“get” or “post” 
action=“URL” 
Elements of the form 
</FORM> 
Single-Line Text Input Field 
<INPUT 
type=“text” 
name=“fieldName” 
size=“widthInCharacters” 
maxlength=“limitInCharacters” 
value=“initialDefaultValue” 
> 
Hidden Input 
<INPUT 
type=“hidden” 
name=“fieldName” 
value=“value” 
> 
Submit Button Input 
<INPUT 
type=“submit” 
name=“buttonName” 
value=“displayedText” 
> 
Multi-Line Text Input Area 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
75 
<TEXTAREA 
name=“areaName” 
cols=“widthInCharacters” 
rows=“numberOfLines” 
> 
initial default value 
</TEXTAREA> 
This was a review of the new tags (and associated attributes) that we have used in today’s 
examples. There are many more tags that can be used in a form. 
Let us take a look at a few 
<form name="login" method="post" action="loginScript"> 
<table><tr> 
<td>User Name: </td> 
<td> 
<input type="text" name="userName" size="10"> 
</td> 
</tr><tr> 
<td>Password: </td> 
<td> 
<input type="password" name="password" size="10"> 
</td> 
</tr><tr> 
<td colspan="2" align="right"> 
<input type="submit" name="login" value="Log me in"> 
</td> 
</tr></table> 
</form> 
Password Input Field 
<INPUT 
type=“password” 
name=“fieldName” 
size=“widthInCharacters” 
maxlength=“limitInCharacters” 
value=“initialDefaultValue” 
> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
76 
<form name="login" method="post" action="loginScript"> 
<table><tr> 
<td>User Name: </td> 
<td> 
<input type="text" name="userName" size="10"> 
</td> 
</tr><tr> 
<td>Password: </td> 
<td> 
<input type="password" name="password" size="10"> 
</td> 
</tr><tr> 
<td colspan="2"> 
<input type="checkbox" name="remember" value="remember"> 
Remember my user name and password 
</td> 
</tr><tr> 
<td colspan="2"> 
<input type="submit" name="login" value="Log me in"> 
</td> 
</tr></table> 
</form> 
12.2 Checkbox Input Element 
<INPUT 
type=“checkbox” 
name=“checkboxName” 
checked 
value=“checkedValue” 
> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
77 
<form name="login" method="post" action="loginScript"> 
<table><tr> 
<td>User Name: </td> 
<td> 
<input type="text" name="userName" size="10"> 
</td> 
</tr><tr> 
<td>Password: </td> 
<td> 
<input type="password" name="password" size="10"> 
</td> 
</tr><tr> 
<td valign="top">Logging in from:</td> 
<td> 
<input type="radio" name="from" value="home"> Home 
<input type="radio" name="from" value="office"> Home 
<input type="radio" name="from" value="university" checked> University 
</td> 
</tr><tr> 
<td colspan="2" align="right"> 
<input type="submit" name="login" value="Log me in"> 
</td> 
</tr></table> 
</form> 
12.3 Radio Button Input Element 
<INPUT 
type=“radio” 
name=“radioButtonName” 
checked 
value=“selectedValue” 
> 
What is the difference between checkboxes and radio buttons? 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
78 
<form name="login" method="post" action="loginScript"> 
<table><tr> 
<td>User Name: </td> 
<td><input type="text" name="userName" size="10"></td> 
</tr><tr> 
<td>Password: </td> 
<td> 
<input type="password" name="password" size="10"> 
</td> 
</tr><tr> 
<td valign="top">Logging in from:</td> 
<td> 
<select size="2" name="from"> 
</select> 
</td> 
</tr><tr> 
<td colspan="2"> 
<input type="submit" name="login" value="Log me in"> 
</td> 
</tr></table> 
</form> 
12.4 Select from a (Drop Down) List 
<SELECT 
name=“listName” 
size=“numberOfDisplayedChoices” 
multiple 
> 
… 
… 
</SELECT> 
<option value="university" selected> University </option> 
<option value="office"> Office </option> 
<option value="home"> Home</option> 
<OPTION value=“value1”> text1 </OPTION> 
<OPTION value=“value2” selected> text2 </OPTION> 
<OPTION value=“value3”> text2 </OPTION> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
79 
12.5 File Upload Input Element 
<INPUT 
type=“file” 
name=“buttonName” 
value=“nameOfSelectedFile” 
enctype=“fileEncodingType” 
> 
<form 
name=“uploadForm” 
method=“post” 
action=“uploadScript” 
<input 
type=“file” 
name=“uploadFile” 
enctype=“multipart/form-data” 
> 
<input 
type=“submit” 
name=“submit” 
value=“Upload” 
> 
</form> 
Reset Button Input Element 
(Resets the contents of a form to default values) 
<INPUT 
type=“reset” 
value=“dispalyedText” 
> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
80 
Today’s Lecture was the … 
We looked at the utility of forms on Web pages 
We found out about the various components that are used in a form 
We became able to build a simple, interactive form 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
81 
Lecture 13 
Application Software 
The focus of the last lecture was on Operating Systems 
Learning Goals for Today 
To learn about application software 
To become familiar with various software used in the following application areas: 
e.g. 
Scientific/engineering/graphics 
Business 
Productivity 
Entertainment 
Educational 
13.1 Two Major Types of Software 
System Software 
Application Software 
13.2 Application Software 
Application software are programs that interact directly with the user 
They generally do not talk directly to the hardware 
13.3 Classification According to the Mode 
Interactive-mode 
The user runs the program on the computer and keeps on interacting with the computer 
while the program runs 
Example: Word processor 
Batch-mode 
The user starts the program and the computer processes the provided data and produces 
results without any further intervention of from the user 
Example: Payroll 
13.4 Classification According to Application Area 
Scientific/engineering/graphics 
Business 
Productivity 
Entertainment 
Educational 
13.5 Scientific/Engineering/Graphics Apps 
Key feature: Intense floating-point calculations 
Scientific/engineering/mathematical apps 
Computers initially were designed just to run them 
Hardware 
Operating System 
Utility Language 
Translator 
Device Driver 
Scientific 
Apps. 
Business 
Apps. 
Productivity 
Apps. 
Entertainment 
Apps. 
System software 
Application software 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
82 
Generally designed for specialists 
Rudimentary UI’s 
Many run in batch mode 
13.6 Scientific SW 
Simulation of natural systems 
Deforestation and effect on green-house gases 
Simulation of artificial systems 
NeuralWare (Simulator for artificial neural networks) 
Thermo-nuclear explosions 
Mathematical computation packages 
Mathematica (can do hundreds, if not thousands of functions, e.g. solving a differential 
eq, symbolically) 
MathCAD 
13.7 Engineering SW 
Computer-aided design (CAD) 
AutoCAD 
SPICE 
Virtual wind tunnels 
Computer-aided manufacturing (CAM) 
Telecommunication system SW 
Centrex 
Industrial control SW 
13.8 Graphics & Animation SW (1) 
Two types: 
1. Vector graphics 
Treats everything that is drawn as an object 
Objects retain their identity after they are drawn 
These objects can later be easily moved, stretched, duplicated, deleted, etc 
Are resolution independent 
Relatively small file size 
Example: MS Visio, Corel Draw, Flash 
Graphics & Animation SW (2) 
2. Bit-mapped or raster graphics 
Treats everything that is drawn as a bit-map 
If an object is drawn on top of another, it is difficult to move just 1 of them while 
leaving the other untouched 
Changing the resolution often requires considerable touch-up work 
Relatively large file size 
Example: MS Paint, Adobe Photoshop 
13.9 Business Applications 
Most of the SW being developed today belongs to this category 
SW that is required to run most any sort of biz: 
Payroll 
General ledger 
Order entry 
Accounts receivable & accounts payable 
Inventory control 
Let’s now discuss a few business SW categories which are not that common, but are 
becoming more and more popular with time 
13.10 E-Commerce Software 
Key requirements: 
Reliability 
Security 
Moving 
graphics 
e.g. cartoons 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
83 
Ability to handle 1000’s of transactions, simultaneously 
13.11 ERP (Enterprise Resource Planning) SW 
Very large scale, complex & expensive SW 
Ties together all key activities & major systems of an organization into a single SW 
system 
Key benefit: Optimization of the business processes of an organization as a single system 
instead of many loosely-related stand-alone systems 
Example: SAP, Oracle, PeopleSoft, Baan 
13.12 DSS (Decision Support Systems) SW 
Sometimes also called “expert systems” 
Many times are based on a branch of computer science called “artificial intelligence” 
This category of SW is designed to help business managers in making effective decisions 
in complex situations based on the analysis of the relevant data 
13.13 Productivity SW 
Most popular category in terms of licenses sold 
Common features 
Ability to simplify, automate everyday business tasks 
Highly interactive and user-friendly design 
Designed to run on PC’s 
Most users do not use 90% of the SW features 
Popular productivity SW 
Word Processing -- Spreadsheets 
Presentations -- Databases 
13.14 Word Processors 
Probably the most popular productivity app 
Initially designed as a replacement for the typewriter 
Automation 
Automatic end-of-line soft carriage return 
Style sheets 
Table of contents & index 
Spelling & grammar checking 
Two approaches: WYSIWYG (e.g. Word, WordPerfect, Star) or traditional markup 
(LaTeX)? 
Desktop publishing 
13.15 Web Page Development SW 
Web pages can be developed using a simple plain-text editor like the “notepad”, but 
more efficient, easy-to-use HTML editors can make the process quicker 
Some of them are WYSIWYG (i.e. you don’t really need to know any HTML to use 
them), others are not, while some provide both types of interfaces (DreamWeaver) 
Most popular word processors now come with a built-in Web page development facility 
13.16 Spreadsheet SW (1) 
Electronic replacement for ledgers 
Is used for automating engineering, scientific, but in majority of cases, business 
calculations 
A spreadsheet - VisiCalc - was the first popular application on PC’s. 
It helped in popularizing PC’s by making the task of financial-forecasting much simpler, 
allowing individuals to do forecasts which previously were performed by a whole team 
of financial wizard 
13.17 Spreadsheet SW (2) 
Consist of cells arranged in rows and columns 
Each cell may contain numeric values, text or formulas 
Automation 
Recalculations 
Charts 
13.18 Presentation Development SW 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
84 
Used to prepare multimedia material for lectures & presentations to display key points, 
graphics, animation, or video with the help of multimedia projectors 
Have replaced acetate films (slides) that were used with over-head projectors 
Key advantage over acetate slides: 
Easy to modify 
Can be sent electronically 
Its multimedia nature makes it more interesting for the audience 
13.19 Small-Scale Databases SW (1) 
Easy to use applications designed for efficient storage and fast and easy retrieval of data 
That data may be in the form of numbers, text, or even multimedia, i.e. sounds, graphics, 
animation, video 
13.20 Small-Scale Databases SW (2) 
Before the advent of the currently popular “relational” database model, the databasing 
function was performed using what is called the “flat-file” model 
That model is not very efficient for storing and searching in large databases 
A database consists of a file or a set of files. Information in these is stored in the form 
of records, and the records are further subdivided into fields 
13.21 Productivity SW Suites 
A set of stand-alone productivity applications designed to work easily with each other 
Share a common UI 
Are available as a bundle along with additional useful utilities 
Examples: MS Office, Corel WordPerfect Office, Lotus SmartSuite, Star Office 
SW Suites for other app areas are available as well, e.g. the Adobe suite of graphics apps 
13.22 Document-Centered Computing (DCC) - 1 
The increasing cooperation among the apps included in productivity suites has given rise 
to a new computing paradigm called DCC 
DCC implies that instead of developing parts of a doc in a number of apps, and then 
cutting-&-pasting them to form the final doc, you stay in a single doc and call-up 
appropriate apps to insert the required objects 
13.23 Document-Centered Computing (DCC) - 2 
Let’s say that we want to write a letter containing a map, a table and a graph 
We can: 
Launch the WP and type the text in 
Insert a drawing by calling up the drawing toolbar app (without leaving the WP) & draw 
the map 
Insert a table by calling up the spreadsheet app (without leaving the WP) & build the 
table 
Insert a graph based on that table using the same spreadsheet app without leaving the 
WP 
13.24 Entertainment SW 
Key feature: Simple, intuitive, many times social UI’s 
The user is generally assumed to know nothing about computers 
Both Microsoft & Apple are pursuing a PC-as-a-personal-entertainment-hub strategy. 
Probable result: Already popular entertainment SW will become even more popular 
13.25 Music & Video Players 
Music players (WinAmp) 
Video/Music players (Real player, Windows Media player, QuickTime player) 
The Web Browsers can also display video, animation, and play music with the help of 
helper applications like Flash 
13.26 Music Generation & Movie Editing SW 
A PC can be made the hub of a music making studio with help of appropriate HW & 
SW 
Inexpensive, easy-to-use video editing SW has recently become available for the iMac 
13.27 Games 
Many types 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
85 
Educational (especially for toddlers) 
Strategy/Simulation 
Sports 
Shoot’em ups 
The saddest aspect: You do not need any opponents or partners to play computer 
games 
The application SW category that provides the toughest challenge for computer HW 
13.28 Educational SW 
Category with probably the highest growth rate 
Current focus on augmenting traditional training and education methods, but it is 
shifting towards replacing traditional methods 
13.29 Electronic Encyclopedias 
Great resource of useful information presented in a very interesting format 
Superior to the paper-based version because: 
Access speed is dramatically higher 
Can contain animation and sound 
Much lower cost as thousand’s of pages in dozens of volumes have been replaced by a 
couple of CD’s 
13.30 On-Line Learning 
With time, the VU Web site will become more and more focused on interactive online 
learning 
The Website of our textbook “Understanding Computers” is an example of an on-line 
learning Website 
Key features of good online learning SW: 
The student can learns at his or her own pace 
The student can select his or her own hours 
13.31 Interactive CD’s 
Same as on-line learning, but through a CD instead of a Web site 
Key advantage: 
Ideal for students with slow Internet access 
13.32 Attributes of Good Application Software 
Easy to install, un-install 
User Interface 
Consistent 
Intuitive 
Configurable 
Adapts to the users need 
Has a tutorial and a complete help manual 
Does not have any critical bugs 
13.33 Most Popular Application Software Categories 
Web browsers 
Email clients 
Word processors 
What have we learnt today? 
Application software are programs that interact directly with the user for the 
performance of a certain type of work 
That work generally falls into one of the following usage areas 
Scientific/engineering/graphics 
Business 
Productivity 
Entertainment 
Educational 
Focus of the Next Lecture 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
86 
Next lecture will be the first among the four lectures that we plan to have on 
productivity SW 
That first lecture will be on word processing 
We’ll learn about what we mean by word processing 
We’ll discuss the usage of various functions provided by common word processors 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
87 
Lecture 14 
Word Processing 
Focus of the last lecture was on Application SW 
Application SW are programs that interact directly with the user for the performance of 
a certain type of work 
That work generally falls into one of the following usage areas 
Scientific/engineering/graphics 
Business 
Productivity 
Entertainment 
Educational 
Today’s Lecture 
First among the four lectures that we plan to have on productivity software, a subcategory 
of application software 
This first lecture will be on word processing 
We’ll learn about what we mean by word processing and also desktop publishing 
We’ll discuss the usage of various functions provided by common word processors 
Word Processing 
The art and science of converting written information into a form that looks pleasing 
when printed 
One of the most popular activities on the PC 
14.1 Word Processor 
The tool used to perform word processing 
Long time ago, a word processor was a HW/SW combination used solely for performing 
the word processing task. It looked like a computer terminal or a PC, but could do only 
one task – word processing 
Today, the term “word processor” generally means the SW used on a computer to 
perform the task of word processing 
Uses of Word Processors 
Write a letter 
Address labels 
Research paper or report 
Advertisement 
Newsletter 
Magazines 
Book 
And thousands of other tasks 
Common Features 
Type, cut, copy, paste, move text 
Automatic line-breaks 
Change font type, face, size, color 
Change number of columns 
Adjust margins and line, word, letter spacing 
Have running headers, footers, page nos. 
Insert tables, charts, graphics, drawings 
Evolution of WP’s 
Manual & electric typewriters (1930-1960) 
Were page oriented 
Type face/size was changed by replacing the typing ball 
Typewriters with magnetic storage (1960’s) 
IBM added storage capability using magnetic tape 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
88 
Line editors on computers(1960's) 
Stand alone word processors (1960's-1970's) 
cost: $15,000 to 20,000 
Current WP programs on uCs (1980's onwards) 
14.2 Types: WYSIWYG-based & Markup-based 
All early WP’s and some of the modern ones as well are markup-based: similar to 
HTML 
Generally are harder to learn, but may provide better control and smaller file size 
Example: LaTeX 
Most current PC-based WP’s belong to the WYSIWYG category 
Easy to get started due to the WIMP interface 
Example: MS Word, Corel WordPerfect, Sun Star 
14.3 Desktop Publishing (DTP) 
A combination of word processing and graphic design. Used to develop elegant 
documents 
In the olden times, DTP was used for designing magazines, newspapers & other 
professional-looking items 
These days, because of the low cost of DTP SW, it is being used for less-demanding and 
ordinary tasks as well 
The original Macintosh PC started the era of DTP or “Personal Publishing” in 1984 
DTP –vs– WP 
The difference between the two is diminishing with time 
Most WP’s now include many tools that, not long ago, were found only in DTP SW 
Generally, DTP SW is a bit more difficult to use for us common computer users, 
whereas WP SW is quite user-friendly 
DTP SW generally provides finer control over the design/layout of a document 
DTP: Requirements 
High-end PC with a large-screen monitor 
Laser printer 
Scanner 
DTP SW 
Examples: 
Adobe PageMaker 
QuarkXPress 
Corel Ventura 
MS Publisher 
14.4 Word Processors for the Web 
Most common WP’s and DTP packages now have the Web development ability 
They also include features like auto-recognition of eMail addresses and URL’s 
However, specialized SW just for developing Web pages and sites is also available 
Examples: DreamWeaver, FrontPage 
The right font face & size for normal text 
If text is too small, it becomes hard to read 
Too large, wastage of space is the result. Plus the reader has to turn more pages than 
necessary 
Either way, the reader gets annoyed 
For general WP, 10-12 point size works well 
Most users, either use the Times New Roman or Arial/Helvetica type face 
Bold, Italic, Underlined Text 
Bold – fat 
Italic – slanted (Why the name italic?) 
Underlined 
All used to emphasize a certain segment of text 
Plea: 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
89 
Please do not over-do them 
Their over-use makes it very difficult for the reader 
And please, use one at a time: Text that is no only bold but also italic & underlined looks 
+ively awful 
Select, Cut, Copy, Drag, Paste 
Just select and cut or copy or drag 
Can also paste after a cut or a copy 
Just think about the pain that people suffered before the advent of the modern WP’s 
Movement of a single sentence from one page to another would have required re-doing 
all the pages in between 
Spelling & Grammar 
Grammar checkers are not very helpful yet, but still useful and are improving with time 
Warning: Spell checkers are not all that smart! Use them with care. 
Disadvantage: My spelling ability is deteriorating day-by-day because of over-reliance on 
WP spell-checkers. I am having great difficulty in writing even short-ish hand-written 
notes without spelling errors 
Thesaurus 
My favorite tool 
Helps you find synonyms and, sometimes, antonyms as well 
Tables 
Tables are sometimes useful for presenting info in an ordered fashion 
Most WP’s provide extensive table construction & manipulation features 
Graphics & Drawings 
You can insert graphics that are made using other apps into a WP document 
Several WP’s have a built-in drawing tool, which can be used for adding simple diagrams 
(e.g. a flow chart, a simple street map) into a WP document 
The Best Feature: Undo 
Allows you to recover from your mistakes 
Allows you to experiment without risk 
Document View Mode 
Most WP’s provide several ways of viewing a document 
I normally work in and recommend what is known as the “Print Layout” view mode 
In this view, the WP works in a true WYSIWYG mode 
Print-Preview & Printing 
Make sure to preview your document before printing it 
Do this to make sure about the”look” of the document before it is printed 
Most people these days either use inkjet printers or laser printers 
Color inkjet printers cost less but are slower 
B&W laser printers cost around twice as much, but are faster and generally have finer 
resolution 
Color laser printers are expensive 
Automation 
Table of contents 
TOC can be automatically generated 
Page nos. in the TOC get readjusted automatically 
Index 
Can be automatically generated 
Page nos. in the index get readjusted automatically 
Application of predefined styles 
Change style; text changes automatically throughout the doc 
Headers & Footers 
Page numbers 
Spelling error auto-highlight 
Getting On-Screen Help 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
90 
All WP’s generally have some form of built-in help mechanism 
To me, it seems like that many of those help-systems are designed to be “not-veryhelpful”: 
they make finding answers to simple questions quite difficult 
Nevertheless, do try them when you are searching for answers 
14.5 Let’s try to use MS Word for creating a CV 
(Remember the TOC) 
Today’s Lecture was the … 
First among the four lectures that we plan to have on productivity software, a subcategory 
of application software 
This first lecture was on word processing 
We learnt about what we mean by word processing and also desktop publishing 
We also discussed the usage of various functions provided by common word processors 
Focus of the Next Lecture: Algorithms 
To become familiar with the concept of algorithms 
What they are? 
What is there use? 
To become able to write algorithms for simple problems 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
91 
Lecture 15 
More on Interactive Forms 
(Web Development Lecture 5) 
Focus of the last lecture was on Interactive Forms 
We looked at the utility of forms on Web pages 
We found out about the various components that are used in a form 
We became able to build a simple, interactive form 
In Today’s Lecture … 
We will learn ways of adding more interactivity to forms 
We will get our first taste of JavaScript – the object-based language that we will be 
employing throughout the rest of the Web development part of this course 
Last time we mentioned server-side scripts; today we will write (simple) client-side scripts 
in JavaScript 
15.1 Single-Line Text Input Field 
<INPUT 
type=“text” 
name=“name” 
size=“widthInCharacters” 
maxlength=“limitInCharacters” 
value=“initialDefaultValue” 
> 
15.2 Password Input Field 
<INPUT 
type=“password” 
name=“name” 
size=“widthInCharacters” 
maxlength=“limitInCharacters” 
value=“initialDefaultValue” 
> 
15.3 Hidden Input 
<INPUT 
type=“hidden” name=“name” 
value=“value” 
> 
15.4 Checkbox Input Element 
<INPUT 
type=“checkbox” 
name=“name” 
checked 
value=“checkedValue” 
> 
15.5 Radio Button Input Element 
<INPUT 
type=“radio” 
name=“name” 
checked 
value=“selectedValue” 
> 
15.6 File Upload Input Element 
<INPUT 
type=“file” 
name=“name” 
value=“nameOfSelectedFile” 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
92 
enctype=“fileEncodingType” 
> 
15.7 Reset Button Input Element 
<INPUT 
type=“reset” 
value=“buttonLabel” 
> 
15.8 Submit Button Input 
<INPUT 
type=“submit” name=“name” 
value=“buttonLabel” 
> 
8 Possible Values for the “type” Attribute of <INPUT> tag 
text 
password 
hidden 
checkbox 
radio 
file 
reset 
submit 
15.9 Multi-Line Text Input Area 
<TEXTAREA 
name=“areaName” 
cols=“width” 
rows=“lines” 
> 
initial default value 
</TEXTAREA> 
15.10 Select from a (Drop Down) List 
<SELECT 
name=“name” 
size=“numberOfDisplayedChoices” 
multiple 
> 
<OPTION value=“value1”> text1 
<OPTION value=“value2” selected> text2 
<OPTION value=“value3”> text2 
… 
… 
</SELECT> 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
93 
End of the Review of Tags Used in Forms 
Now let’s take a look at a form that we constructed last time, and see how we can make 
it better 
Let’s now review what happens when I enter all the required info and press the “Send 
eMail” button? 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
94 
This is what happens when the form is filled correctly. What if the form is filled 
incorrectly? 
What if the users leaves one of the essential fields, blank? 
What if the user enters an illegal eMail address? Examples: 
altaf2vu.edu.pk 
bhola@hotmail.con 
bhola@yahoo 
A Reasonable Scenario 
When the “Send eMail” button is clicked, the browser sends the data collected through 
the form to a script running on the Web server 
That server-side script: 
receives that data 
analyzes it 
discovers the missing or incorrect data 
sends a message back to the user’s browser stating the problem and asks the user to resend 
This process … 
That is the process of user: 
Filling the incomplete/incorrect data 
Sending it to the server 
Receiving the response back from the server 
Correcting and resending 
is quite time-consuming and uses the server’s resources to help the user correct his 
mistakes 
It can really bog down the server if a large number of users are using that Web server 
15.11 Client-Side Scripting is a viable alternate 
In this technique, one uses the user’s browser to checking the form data 
If data is missing or is incorrect, the browser can prompt the user to take corrective 
action 
This way, the form data is sent to the server-side script only after it has been established 
that the collected data is complete and correct 
15.12 Server-Side Scripts: Review 
Are programs that reside on Web servers 
Receive info that a user enters in a form 
Process that info and take appropriate action 
Examples: 
CGI scripts on Unix servers 
ASP scripts on Windows servers 
Info contained 
in the form 
Acknowledgement 
Message 
to the 
receiver’s 
eMail 
address 
User’s 
Computer 
Web 
Server 
Server-Side 
Script 
Browser 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
95 
New Concept: Client-Side Scripts 
Small programs that are a part of the Web page and run on the user’s (client’s) computer 
They interact with the user to collect info or to accomplish other tasks 
Once it has been collected, they may help pass the collected info on to a server-side 
script 
We’ll use JavaScript to do client-side scripting. However, there are many other languages 
that can be used for that purpose, e.g. VBScript 
Advantages of Client-Side Scripting 
Reduced server load as it does not have to send messages to the user’s browser about 
missing or incorrect data 
Reduced network traffic as the form’s data is sent only once instead of many to’s and 
fro’s 
Disadvantages 
Client-side scripts do not work with all browsers 
Some user intentionally turn scripting off on their browsers 
This increases the complexity of the Web page, as it now has to support both situations: 
browsers with scripting capability, and those not having that capability 
<INPUT 
type=“submit” 
name=“sendEmail” 
value=“Send eMail” 
> 
Code for the simple “Send eMail” 
button as was described during 
the last Web development lecture 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
96 
This is one way of including JavaScript code in an HTML document – that is, including a 
short JavaScript segment as part of an HTML tag 
There are a few others as well. Let’s now find out about another. 
But before we do that … 
… let’s just make clear why we are interested in including JavaScript in our Web pages 
15.13 Why JavaScript? 
HTML is great for static Web pages; however, supports only rudimentary interactivity 
through forms and hyperlinks 
JavaScript can be used (along with HTML) to develop interactive content for the Web 
What is JavaScript? 
A programming language specifically designed to work with Web browsers 
It is designed to be used for developing small programs – called scripts – that can be 
embedded in HTML Web pages 
JavaScript: 
Is an interpreted language 
Supports event-driven programming 
Is object-based 
Object Based? 
Everything that JavaScript manipulates, it treats as an object – e.g. a window or a button 
An object has properties – e.g. a window has size, position, status, etc. 
Properties are modified with methods – e.g. a resize a window with resizeTo(150, 200) 
<INPUT 
type=“submit” 
name=“sendEmail” 
value=“Send eMail” 
onMouseOver= 
“if (document.sendEmail.sender.value.length< 1) 
window.alert(‘Empty From field! Please 
correct’)” 
> 
Additional JavaScript code for the smart 
“Send eMail” button that would not allow itself 
to be clicked if the “From” text field is left 
<INPUT 
type=“submit” 
name=“sendEmail” 
value=“Send eMail” 
onMouseOver= 
“if (document.sendEmail.sender.value.length < 1) 
window.alert(‘Empty From field! Please correct’)” 
> 
Event 
Handler 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
97 
<INPUT 
type=“submit” 
name=“sendEmail” 
value=“Send eMail” 
onMouseOver= 
“if (document.sendEmail.sender.value.length < 1) 
window.alert(‘Empty From field! Please correct’)” 
> 
<INPUT 
type=“submit” 
name=“sendEmail” 
value=“Send eMail” 
onMouseOver=“checkForm()” 
> 
<INPUT 
type=“submit” 
name=“sendEmail” 
value=“Send eMail” 
onMouseOver= 
“if (document.sendEmail.sender.value.length < 1) 
window.alert(‘Empty From field! Please correct’)” 
> 
checkForm() 
JavaScript understands onMouseOver – it is one of the pre-defined keywords in 
JavaScript 
However, the case for checkForm() is different 
A checkForm() function does not exist in JavaScript. Therefore, we will have to define it 
ourselves 
It can either be defined in the HEAD portion or BODY portion. We will do it in the 
HEAD. 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
98 
We have looked at 2 techniques for embedding JavaScript code in a Web page: 
1. Put the code in the tag for the “Send eMail” button - as was shown to you earlier 
2. Put the checkForm() code in the HEAD portion & put the 
onMouseOver=“checkForm()” attribute in the tag for the “Send eMail” button 
Both perform the required function satisfactorily. 
Q: Which of two techniques is better? 
The “put all code in the tag” technique seems to require less code 
For very short scripts, “all code in the tag” works well. However, this technique does 
not work when one needs to put multiple script statements in the same tag 
The “code in the HEAD portion” is more general-purpose, and the right choice for 
developing larger JavaScript scripts 
The main code segment that goes between the <SCRIPT>, </SCRIPT> tags in the 
HEAD: 
function checkForm() { 
if ( document.sendEmail.sender.value.length < 1) { 
window.alert( “Empty From field! Please correct” ); 
} 
} 
The JavaScript code included as an attribute of the “Send eMail” button: 
onMouseOver=“checkForm()” 
Today we checked if the “From” field of the form was empty 
How can we modify the JavaScript code for checking if the “To” field is empty as well? 
How about checking all four fields? 
How about checking if the addresses given in the “From” and “To” fields are legal eMail 
addresses? 
Please try thinking about those possibilities? 
In Today’s Lecture … 
We learnt ways of constructing forms that were a bit more interactive 
We got our first taste of JavaScript – the object-based language that we will be 
employing throughout the rest of the Web development part of this course 
Last time we mentioned server-side scripts; today we wrote (simple) client-side scripts in 
JavaScript 
Next (the 6th) Web Dev Lecture: 
JavaScript Object, Properties, Methods 
We will have a more formal introduction to JavaScript and client-side scripting 
We will become able to appreciate the concept of objects in JavaScript 
We will learn about the properties of those objects 
We will become able to perform simple tasks through the application of methods 
<HTML> 
<HEAD> 
<TITLE>Send an eMail</TITLE> 
<SCRIPT> 
function checkForm() { 
if ( document.sendEmail.sender.value.length < 1) { 
window.alert( “Empty From field! Please correct” ); 
} 
} 
</SCRIPT> 
</HEAD> 
<BODY bgcolor=“#FFFFCC”> 
… body content … 
</BODY> 
</HTML> 
JavaScript code 
enclosed in the new 
<SCRIPT>,</SCRIPT 
> HTML tags 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
99 
Lecture 16 
Algorithms 
Focus of the last lecture was on Word Processing 
First among the four lectures that we plan to have on productivity software, a subcategory 
of application software 
That first lecture was on WP 
We learnt about what we mean by WP and also desktop publishing 
We also discussed the usage of various functions provided by common WP’s 
The Objective of Today’s Lecture 
To become familiar with the concept of algorithms: 
What they are? 
What is their use? 
What do they consist of? 
What are the techniques used for representing them? 
Solving Problems (1) 
When faced with a problem: 
We first clearly define the problem 
Think of possible solutions 
Select the one that we think is the best under the prevailing circumstances 
And then apply that solution 
If the solution woks as desired, fine; else we go back to step 2 
Solving Problems (2) 
It is quite common to first solve a problem for a particular case 
Then for another 
And, possibly another 
And watch for patterns and trends that emerge 
And to use the knowledge form those patterns and trends in coming up with a general 
solution 
Solving Problems (3) 
It helps if we have experienced that problem or similar ones before 
Generally, there are many ways of solving a given problem; the best problem-solvers 
come-up with the most appropriate solution more often than not! 
The process that can be used to solve a problem is termed as the “algorithm” 
Algorithm: 
Sequence of steps that can be taken to solve a given problem 
Examples 
Addition 
Conversion from decimal to binary 
The process of boiling an egg 
The process of mailing a letter 
Sorting 
Searching 
sequenscteeps 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
100 
Let us write down the algorithm for a problem that is familiar to us 
Converting a decimal number into binary 
16.1 Algorithm for Decimal-to-Binary Conversion 
Write the decimal number 
Divide by 2; write quotient and remainder 
Repeat step 2 on the quotient; keep on repeating until the quotient becomes zero 
Write all remainder digits in the reverse order (last remainder first) to form the final 
result 
Points to Note: 
The process consists of repeated application of simple steps 
All steps are unambiguous (clearly defined) 
We are capable of doing all those steps 
Only a limited no. of steps needs to be taken 
Once all those steps are taken according to the prescribed sequence, the required result 
will be found 
Moreover, the process will stop at that point 
16.2 Algorithm (Better Definition) 
1st Definition: 
Sequence of steps that can be taken to solve a problem 
Better Definition: 
A precise sequence of a limited number of unambiguous, executable steps that terminates in the 
form of a solution 
Three Requirements: 
Sequence is: 
Precise 
Consists of a limited number of steps 
Each step is: 
Unambiguous 
Executable 
The sequence of steps terminates in the form of a solution 
Convert 75 to Binary 
2 75 
37 
1 
2 
18 
1 
2 
9 
0 
2 
4 1 
2 
2 0 
2 
1 
0 
2 
0 
1 
1001011 
remainder 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
101 
16.3 Why Algorithms are Useful? 
Once we find an algorithm for solving a problem, we do not need to re-discover it the 
next time we are faced with that problem 
Once an algorithm is known, the task of solving the problem reduces to following 
(almost blindly and without thinking) the instructions precisely 
All the knowledge required for solving the problem is present in the algorithm 
Why Write an Algorithm Down? 
Written form is easier to modify and improve 
Makes it easy when explaining the process to others 
16.4 Analysis of Algorithms 
Analysis in the context of algorithms is concerned with predicting the resources that re 
requires: 
Computational time 
Memory 
Bandwidth 
Logic functions 
However, Time – generally measured in terms of the number of steps required to 
execute an algorithm - is the resource of most interest 
By analyzing several candidate algorithms, the most efficient one(s) can be identified 
Selecting Among Algorithms 
When choosing among competing, successful solutions to a problem, choose the one which is the least 
complex 
This principle is called the “Ockham’s Razor,” after William of Ockham - famous 13-th 
century English philosopher 
Early History: 
Search for a Generic Algorithm 
The study of algorithms began with mathematicians and was a significant area of work 
in the early years 
The goal of those early studies was to find a single, general algorithm that could solve all 
problems of a single type 
Origin of the Term “Algorithm” 
The name derives from the title of a Latin book: Algoritmi de numero Indorum 
That book was a translation of an Arabic book: Al-Khwarizmi Concerning the Hindu 
Art of Reckoning 
That book was written by the famous 9-th century Muslim mathematician, Muhammad 
ibn Musa al-Khwarizmi 
16.5 Al-Khwarzmi 
Al-Khwarizmi lived in Baghdad, where he worked at the Dar al-Hikma 
Dar al-Hikma acquired and translated books on science and philosophy, particularly 
those in Greek, as well as publishing original research 
The word Algebra has its origins in the title of another Latin book which was a 
translation of yet another book written by Al-Khwarzmi: 
Kitab al-Mukhtasar fi Hisab al-Jabr wa'l-Muqabala 
Al-Khwarizmi’s Golden Principle 
All complex problems can be and must be solved 
using the following simple steps: 
Break down the problem into small, simple sub-problems 
Arrange the sub-problems in such an order that each of them can be solved without 
effecting any other 
Solve them separately, in the correct order 
For your own use in the future, so that you don’t have to spend the time for rethinking it 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
102 
Combine the solutions of the sub-problems to form the solution of the original problem 
That was some info on history. 
Now, let us to take a look at several types of algorithms & algorithmic strategies 
16.6 Greedy Algorithm 
An algorithm that always takes the best immediate, or local solution while finding an 
answer 
Greedy algorithms may find the overall or globally optimal solution for some 
optimization problems, but may find less-than-optimal solutions for some instances of 
other problems 
KEY ADVANTAGE: Greedy algorithms are usually faster, since they don't consider the 
details of possible alternatives 
Greedy Algorithm: Counter Example 
During one of the international cricket tournaments, one of the teams intentionally lost a 
match, so that they could qualify for the next round 
If they had won that particular match, some other team would have qualified 
This is an example of a non-greedy algorithm 
Greedy Algorithm: Example 
A skier skiing downhill on a mountain wants to get to the bottom as quickly as possible 
What sort of an algorithm should the skier be using? 
The greedy-algorithm approach will be to always have the skies pointed towards the 
largest downhill slope (dy/dx), at all times 
What is the problem with that approach? 
In what situations that will be the best algorithm? 
In which situations would it perform poorly? 
16.7 Deterministic Algorithm (1) 
An algorithm whose behavior can be completely predicted from the inputs 
That is, each time a certain set of input is presented, the algorithm gives the same results 
as any other time the set of input is presented. 
16.8 Randomized Algorithm (1) 
Any algorithm whose behavior is not only determined by the input, but also values 
produced by a random number generator 
These algorithms are often simpler and more efficient than deterministic algorithms for 
the same problem 
Simpler algorithms have the advantages of being easier to analyze and implement. 
16.9 Randomized Algorithm (2) 
These algorithm work for all practical purposes but have a theoretical chance of being 
wrong: 
Either in the form of incorrect results 
Or in the form of impractically long running time 
Example: Monte Carlo algorithms. 
16.10 Deterministic Algorithm (2) 
There can be degrees of deterministic behavior: an algorithm that also uses a random 
number generator might not be considered deterministic 
However, if the "random numbers" come from a pseudo-random number generator, the 
behavior may be deterministic 
Most computing environments offer a “pseudo random number generators,” therefore, 
most randomized algorithms, in practice, behave deterministically! 
16.11 Heuristic 
A procedure that usually, but not always, works or that gives nearly the right answer 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
103 
Some problems, such as the traveling salesman problem, take far too long to compute an 
exact, optimal solution. A few good heuristics have been devised that are fast and find a 
near-optimal solution more often than not 
Is a heuristic, an algorithm? Yes? No? Why? 
A Few Questions 
Is that the best possible sequence? 
How do you know? 
How do I determine the best sequence? 
16.12 The Brute Force Strategy (1) 
A strategy in which all possible combinations are examined and the best among them is 
selected 
What is the problem with this approach? 
A: Doesn’t scale well with the size of the problem 
How many possible city sequences for n=6? For n=60? For n=600? 
16.13 The Brute Force Strategy (2) 
However, with the relentless increase in computing power, certain problems that – only 
a few years ago - were impossible to solve with brute force, are now solvable with this 
technique 
16.14 A Selection of Algorithmic Application Areas 
Search 
Sort 
Cryptography 
Parallel 
Numeric 
Graphical 
Quantum computing 
Combinatory 
We’ll now talk about the various ways of representing algorithms. 
But, before we do that please allow me to say a few words about … 
The Traveling Salesman Problem 
A salesman needs 
to visit each of the n 
cities one after the 
other and wants to 
finish the trip where 
it was started 
Determine the 
sequence of cities 
such that the 
traveling distance is 
minimized 
2 
6 
5 
4 
3 
1 
A possible sequence for n = 
6 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
104 
Now onto Algorithm Representation 
We have said enough about algorithms – their definition, their types, etc. 
But, how do we actually represent them? 
Generally, SW developers represent them in one of three forms: 
Pseudo code 
Flowcharts 
Actual code 
Pseudo Code 
Language that is typically used for writing algorithms 
Similar to a programming language, but not as rigid 
The method of expression most suitable for a given situation is used: 
At times, plain English 
At others, a programming language like syntax 
16.15 Flowchart 
A graphical representation of a process (e.g. an algorithm), in which graphic objects are 
used to indicate the steps & decisions that are taken as the process moves along from 
start to finish 
Individual steps are represented by boxes and other shapes on the flowchart, with arrows 
between those shapes indicating the order in which the steps are taken 
An algo. is “correct” if its: 
– Semantics are 
correct 
– Syntax is correct 
Semantics: 
The concept embedded in 
an algorithm (the soul!) 
Syntax: 
The actual representation 
of an algorithm (the body!) 
WARNINGS: 
1. An algo. can be 
syntactically correct, yet 
semantically incorrect – 
very dangerous 
situation! 
2. Syntactic correctness 
is easier to check as 
compared with semantic 
Syntax & Semantics 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
105 
In Today’s Lecture, We … 
Became familiar with the concept of algorithms: 
What they are? 
What is their use? 
What do they consist of? 
What are the techniques used for representing them? 
Next Lecture: Algorithms II 
We will continue our discussion on algorithms during the next lecture 
In particular, we will discuss the pseudo code and flowcharts for particular problems 
We will also discuss the pros and cons of these two algorithm representation techniques 
i.e. pseudo code and flow charts 
Start or stop 
Process 
Input or output 
Connector 
Decision 
Flow line 
Off-page connector 
Flowchart 
Elements 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
106 
Lecture 17 
Algorithms II 
Focus of the last lecture was on Algorithms 
Became familiar with the concept of algorithms: 
What they are? (SEQUENCE OF STEPS) 
What is their use? 
What are their types? 
What are the techniques used for representing them? 
Pseudo code 
Flowcharts 
Actual code 
Today … 
We will continue our discussion on algorithms that we started during the 16th lecture 
In particular, we will look at the building blocks that are used in all algorithms 
We will also discuss the pseudo code and flowcharts for particular problems 
In addition, we will outline the pros and cons of those two techniques 
17.1 Algorithm Building Blocks 
All problems can be solved by employing any one of the following building blocks or 
their combinations 
Sequences 
Conditionals 
Loops 
OK. Now on with the three building blocks of algorithms. First .. 
Start or stop 
Process 
Input or output 
Connector 
Decision 
Flow line 
Off-page connector 
Flowchart 
Elements 
This review was essential because we will be using these building blocks quite often today. 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
107 
We will now present the algorithm for a problem whose solution is familiar to us 
We will first go through the problem statement and then present the algorithm in three 
different formats: 
Sequences 
A sequence of instructions that are 
executed in the precise order they 
are written in: 
statement block 1 
statement block 2 
statement block 3 
statement block 1 
statement block 2 
statement block 3 
Conditionals 
Select between alternate courses of action 
depending upon the evaluation of a condition 
If ( condition = true ) 
statement block 1 
Else 
statement block 2 
End if 
statement 
block 1 
condition 
True False 
statement 
block 2 
Loops 
Loop through a set of statements as long as 
a condition is true 
Loop while ( condition = true ) 
statement block 
End Loop 
True condition 
False 
statement 
block 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
108 
1. Pseudo code 
2. Flowchart 
3. Actual code 
Problem Statement 
Convert a decimal number into binary 
We did write down the pseudo code for this problem last time. Lets do it again, and in a 
slightly more formal way 
17.2 Solution in Pseudo Code 
Let the decimal number be an integer x, x > 0 
Let the binary equivalent be an empty string y 
Repeat while x > 0 { 
Determine the quotient & remainder of x ÷ 2 
y = CONCATENATE( remainder, y ) 
x = quotient 
} 
Print y 
Stop 
Q: Is this the only possible algorithm for converting a decimal number into a binary 
representation? 
If not, then is this the best? 
In terms of speed? 
In terms of memory requirement? 
In terms of ease of implementation? 
You must ask these questions after writing any algorithm 
17.3 Tips on Writing Good Pseudo Code 
Convert 75 to Binary 
2 75 
37 
1 
2 
18 
1 
2 
9 
0 
2 
4 1 
2 
2 0 
2 
1 
0 
2 
0 
1 
1001011 
remainder 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
109 
Use indention for improved clarity 
Do not put “code” in pseudo code – make your pseudo code language independent 
Don’t write pseudo code for yourself – write it in an unambiguous fashion so that 
anyone with a reasonable knowledge can understand and implement it 
Be consistent 
Prefer formulas over English language descriptions 
Does the flowchart depict the “correct” algorithm? 
What do we mean by “correct”, or better yet, what do we check for “correctness”? 
One way is to check the algorithm for a variety of inputs 
Does it perform satisfactorily for: 
x = 0 ? 
negative numbers? 
numbers with fractional parts? 
Start 
Find quotient 
& remainder 
of x ÷ 2 
Get x 
x>0 ? 
Print y 
S 
y = CONC(remainder, x) 
x = quotient 
x is the decimal number 
y is the binary equivalent 
Flowchart of 
Decimal 
to Binary 
Conversion 
Yes No 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
110 
Strategy 
<SCRIPT> 
x = 75; // x is the decimal number 
y = “”; // y is the binary equivalent 
while ( x > 0) { 
remainder = x % 2; 
quotient = Math.floor( x / 2 ); 
y = remainder + y; 
x = quotient; 
} 
document.write(“y = ” + y); 
</SCRIPT> 
Decimal to Binary Conversion in JavaScript 
NOTE: Don’t worry if 
you don’t understand 
this code for now; you 
will - later! 
Another Example: Sorting 
Sort the following objects w.r.t. their 
heights 
Expected Result 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
111 
There are many strategies for solving this problem. We demonstrate a simple one: 
Repeat the following steps while the list is un-sorted: 
Start with the first object in the list 
Swap it with the one next to it if they are in the wrong order 
Repeat the same with the next to the first object 
Keep on repeating until you reach the last object in the list 
Q: Is the list sorted? 
A: No 
Back to the Objects to be Sorted 
Sorting: Step A1 
Sorting: Step A1 
Swap? Yes 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
112 
Sorting: Step A2 
Sorting: Step A2 
Swap? Yes 
Sorting: Step A3 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
113 
Q: Is the list sorted? 
A: No 
Sorting: Step A3 
Swap? No 
Sorting: After Step A7 
Sorting: Step B1 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
114 
Sorting: Step B1 
Swap? Yes 
Sorting: Step B2 
Sorting: Step B2 
Swap? No 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
115 
Q: Is the list sorted? 
A: No 
Sorting: After Step B7 
Sorting: Step C1 
Sorting: After Step C7 
Sorting: Step C1 
Swap? No 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
116 
Q: Is the list sorted? 
A: Yes 
STOP 
Let’s now look at this same process of sorting being applied to a bigger list 
---FLASH MOVIE FOR BUBBLE SORT GOES HERE--- 
Dim swapFlag As Boolean, list(8) As Integer 
readList( list() ) ‘this needs to be defined 
swapFlag = True 
Do While swapFlag = True 
For n = 1 To 8 
If list(n) > list(n + 1) Then 
temp = list(n) 
list(n) = list(n + 1) 
list(n + 1) = temp 
swapFlag = True 
End If 
Next 
Loop 
For n = 1 To 8 
Debug.Print list(n) 
Next 
Q: Is this the only possible algorithm for sorting a list? 
A: Certainly not! In fact this one (called the “Bubble sort”) is probably the worst 
(reasonable) algorithm for sorting a list – it is just too slow 
You will learn a lot more about sorting in your future courses 
Start 
n = n+1 
Get list 
list 
sorted? 
Stop SWAP 
list[n], list[n+1] 
list is an array containing the heights 
N is the total number of objects in the list 
Flowchart for the Sorting Process 
No 
Yes 
n = 0 
list[n] > 
list[n+1]? 
Yes No 
n>N ? 
Yes 
No 
Introduction to Computing –CS101 VU 
© Copyright Virtual University of Pakistan 
117 
17.4 Pros and Cons of Flowcharts (1) 
I personally don’t find flowcharts very useful 
The process of writing an algorithm in the form of a flowchart is just too cumbersome 
And then converting this graphical form into code is not straight forward 
However, there is another kind of flowcharts – called Structured Flowcharts – that may 
be better suited for software developers 
17.5 Pros and Cons of Flowcharts (2) 
The good thing about flowcharts is that their symbols are quite intuitive and almost 
universally understood 
Their graphical nature makes the process of explaining an algorithm to one’s peers quite 
straightforward 
17.6 Pros and Cons of Pseudo Code (1) 
Quite suitable for SW development as it is closer in form to real code 
One can write the pseudo code, then use it as a starting point or outline for writing real 
code 
Many developers write the pseudo code first and then incrementally comment each line 
out while converting that line into real code. 
<a href="http://www.genrica.com/vustuff/CS101/CS101_handouts_1_45.pdf" target="_blank">Introduction to Computing CS101 book HANDOUTS in pdf</a></div>

Introduction to Computing CS101 book HANDOUTS in pdf

Introduction to Computing CS101 book HANDOUTS in pdf Handouts | Lectures | Contents | Books Introduction to Computing –CS101 VU ©...