Introducing computer science
1 / 31

Introducing Computer Science - PowerPoint PPT Presentation

  • Uploaded on

Introducing Computer Science. CSCI N341: Client-Side Programming. Goals. By the end of this lecture you should … … understand Computer Science as the study of algorithms … recognize HIPO charts as one of several tools available for problem analysis

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

PowerPoint Slideshow about ' Introducing Computer Science' - khanh

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
Introducing computer science

Introducing Computer Science

CSCI N341: Client-Side Programming


By the end of this lecture you should …

… understand Computer Science as the study of algorithms

… recognize HIPO charts as one of several tools available for problem analysis

… understand how programming languages work in general

… recognize different categories of programming languages

… understand the program development cycle

One dimension of web programming
One Dimension of Web Programming

Personal Computer - a computer operated by one person at a time, i.e. “Client” computer. N341 focuses on Client-Side computing

Server – a computer whose resources and processors are shared by multiple users. N342 focuses on Server-Side programming

What is computer science
What is Computer Science?

  • NOT about coding or hardware or software!

  • Computer Science is about PROBLEM SOLVING

  • Computer Science is about DEVELOPING ALGORITHMS to solve complex problems

  • Computers are merely tools for solving problems!


  • Well-developed, organized approaches to solving complex problems

  • Test of a good algorithm:

    • Does the algorithm solve the stated problem?

    • Is the algorithm well-defined?

    • Does the algorithm produce an output?

    • Does the algorithm end in a reasonable length of time?

Developing an algorithm
Developing an Algorithm

  • Identify the Inputs

    • What data do I need?

    • How will I get the data?

    • In what format will the data be?

  • Identify the Processes:

    • How can I manipulate data to produce meaningful results?

  • Identify Outputs:

    • What outputs do I need to return to the user?

    • What format should the outputs take?

Developing an algorithm1

Develop a HIPO chart – Hierarchy, Input, Processing, Output

Developing an Algorithm

Developing an algorithm2
Developing an Algorithm

  • Identify relevant modules

    • How can I break larger problems into smaller, more manageable pieces?

    • What inputs do the modules need?

    • What processes need to happen in the modules?

    • What outputs are produced by the modules?


  • Sets of instructions that get the computer to do something

  • Instructions are translated, eventually, to machine language using an interpreter or a compiler (or both!). You can think of an interpreter as translating one “line” of code at a time, while a compiler translates an entire program before executing it

  • Programs may be a few lines or millions of lines of code

Programming tasks
Programming Tasks

  • All computer programs are written so they can take data, manipulate and then produce a result.

  • This process uses three distinct tasks:

    • INPUT – getting data from an external source (the user, a database, a file, etc.)

    • PROCESSING – actual manipulation of the data

    • OUTPUT – reporting the results of data manipulation back (using the monitor, writing information to a database, etc.)

Categories of languages
Categories of Languages

  • Machine Language

    • Binary digits (bits – 1s and 0s) which are translated to electrical impulses that get the computer to do something

    • “Native” language of computers

  • Assembly Languages

    • Group of basic commands, written as mnemonics, ie, jmp, hlt, etc.

    • Tied to specific processors

    • Still need to be translated to machine language

Categories of languages1
Categories of Languages

  • High Level Languages

    • In terms of syntax, very close to human language (mostly English)

    • Lower error rate than writing machine language or assembly language programs

    • Need to be translated to machine language before execution

      • Compilers

      • Interpreters

More on high level languages
More on High-Level Languages

  • Features common to all HL languages:

    • Sequential Operations – Operations in which lines of code execute in order, one right after another

    • Control Structures

      • Conditional Operations – Operations in which execution depends on the outcome of a previous condition (usually evaluated to be TRUE or FALSE)

      • Looping Operations – Operations designed to repeat until a given condition is satisfied.

      • Branching Operations – Operations designed to identify mutually exclusive sections of code

    • Data Structures – allow programming optimization, ie, arrays, linked lists, etc.

More features
More Features

  • Variables – named storage locations for data

  • Data types – integers, strings, boolean, etc.

  • Delimiters – symbols that designate beginning and endings of programming structure, ie, “;”, “{“, etc.

  • Modularity – section of code that performs a task

  • Comments – Information for programmers for better code maintenance

  • Input and output – mechanisms for moving information in and out of a program

  • Key reserved words – words with predefined meaning within a language

Levels of high level languages
Levels of High-Level Languages

  • Procedural Languages

    • Early high level languages

    • Focus on structures

    • Examples include QuickBasic, Fortran, Pascal, Visual Basic (early versions)

  • Object-Oriented languages (OOP)

    • More recent development

    • Focus on data, not structures (Primacy of Data)

    • Examples include Java, C#, C++, Visual Basic.Net

The programming development cycle
The Programming Development Cycle

  • Done after identifying inputs, processing & outputs

  • Steps

    • Analyze the problem using customer input and technical training

    • Plan a solution to the problem (algorithm)

    • Design the user interface

    • Prototype design to customer

    • Revise design based on customer feedback

    • Iterate and test to product release

    • Maintenance cycle

    • Product Obsolescence

Notes on development cycle
Notes on Development Cycle

  • 1. Analyze the Problem: Questions to ask:

    • Who is my intended audience?

    • What SPECIFIC outcomes does my audience expect?

    • What business rules do my audience expect to have incorporated into the solution?

    • What is the SCOPE of the problem?

2 plan a solution algorithm
2. Plan a Solution (Algorithm)

  • What types of programming structures are needed?

    • Sequential structures

    • Conditional structures

    • Looping structures

  • What data structures are needed?

    • Variables

    • Lists

    • Arrays

3 design the user interface
3. Design the User Interface

  • i.e. , The “UI”

  • Is the UI “learnable”?

  • Is it simple? (Limit user choices)

  • Does the UI promote error-proof use?

  • Is the layout of the UI arranged in a fashion conducive to the user’s culture and expectations?

4 code the solution
4. Code the Solution

  • Develop an actual program from an algorithm

  • Should be the “easiest” part of the process – all the work should already be done!

5 test debug the solution
5. Test & Debug the Solution

  • Alpha Testing – Internal testing done with expected client data (NOT LIVE DATA)

  • Beta Testing – Testing done at the client site with their data (USUALLY LIVE DATA)

  • Try to predict common user errors

  • Test subjects should be Power Users, Normal Users and Neophytes

6 make sure documentation is complete
6. Make Sure Documentation is Complete

  • User Documentation:

    • User Manual

    • Technical Documentation (for System Administrators)

  • Internal Documentation:

    • Documentation comments

    • Code comments

    • Procedural comments

    • Should be done while coding!

7 plan next release
7. Plan Next Release

  • What bugs need to be fixed?

    • Are bugs “critical”? (Need to be fixed in a minor release)

    • If bugs are not critical, they can be fixed in next major release

  • What product enhancements do the users want for the next release?

Internal commenting
Internal Commenting

  • Comments are non-executable lines (the computer ignores them) which are used to communicate valuable information about code to others

  • Types of Internal Commenting:

    • Documentation Comments

    • Code Comments

    • Procedural Comments

  • Comment Syntax:

    • C-like Syntax (C, C++, Java, JavaScript):

      /* This will work for multi-line comments */

      // This is a single-line comment

Documentation comments
Documentation Comments

  • Used to given specific information about a program

  • Usually found at the beginning of a code window

  • Include information about the author, creation date, purpose, modification date & modification history

Documentation comment
Documentation Comment


  • TITLE: Hello World, v2.0* AUTHOR: Susie Student* PURPOSE: To demonstrate changing of textbox properties using event procedures.* CREATED ON: 09.10.2002* LAST MODIFIED ON: 09.18.2002* LAST MODIFIED BY: RSM* MODIFICATION HISTORY:* 08.12.2009 - Renamed form to frmMain to conform with accepted naming standards (MJK) *11.18.2008 - Created a Clear Button enabling users to clear output (RSM)


Code comments
Code Comments

  • “Tell the story” of the code, in English

  • For this class, you should use code comments to indicate what lines of code do

    • Define how variables are being used

    • Describe sections of code

Code comments1
Code Comments

/* Initialize loop counter to 1 */var counter = 1;/* Set loop to repeat 10 times */while(counter <= 10){ /* Display loop number*/alert(“You are on loop number” + counter);

/* update counter*/counter++;

} /* end while */

Procedural comments
Procedural Comments

  • Identify purpose, arguments & return values for procedures

  • Can be used in:

    • Event Procedures

    • Sub-Procedures

    • Function Procedures

Procedural comments1
Procedural Comments

/* Function touchRock

Used to capture user name and produce custom greeting. If name is provided, upon image mouse click change image to happy rock


Function touchRock(){

varuserName = prompt(“What is your name?”, “Enter your name here.”);

if (userName) {

alert(“It is good to meet you, “ + userName + “.”);

document.getElementById(“rockImg”).src = “rock_happy.png”;

} //end if

} // end function touchRock