1. Programming the Web using XHTML and JavaScript
Chapter 16
Custom Objects: Creating and Searching a Database

2. The Basics of Databases
Database: group of associated variables
Typical form is a table of:
Records (rows) made up of
Fields (columns)
Each containing data about one attribute of interest for each record

3. The Basics of Databases
Name
Address
Phone
Bill
123 Main Street
Mary
456 Elm Place

4. The Basics of Databases
How to implement a database in JavaScript?
An object and its properties correspond to a record and its fields
One object might have three properties:
Name
Address
Phone

5. The Basics of Databases
Creating a number of these objects would correspond to a number of records (rows) in a table
Already have used objects that come with JavaScript:
Images
Dates
How can we define and create our own objects?

6. var someImage = new Image(69,120)
Custom Objects
Use the constructor function to create a new instance of an object then assign it to a variable
For example using something we know:
var someImage = new Image(69,120)
Technically, this creates an instance of the Image object
“Image” defines a basic template for a particular type of object
“new” creates a copy of this template
The new Image object is named “someImage”

7. Custom Objects
You can write your own custom constructor functions in JavaScript
Defines the “template” for the object
Properties
Methods
Right now, don’t worry about methods
For a JavaScript database we only need objects with properties
Start with the constructor function …

8. Custom Objects: Constructor
Constructor function name
function addressEntry(nm, adr, ph) {
this.name = nm
this.address = adr
this.phone = ph }
Properties
Asssignments

9. Custom Objects: Constructor
function addressEntry(nm, adr, ph) {
this.name = nm
this.address = adr
this.phone = ph }
“this object”
In other words, the object we are creating with this constructor function

10. Custom Objects function addressEntry(nm, adr, ph) { this.name = nm
this.address = adr
this.phone = ph }
var firstAddress = new addressEntry(
“Bill”,
“123 Main Street”,
“ ” )

11. Custom Objects
After creating an object, its properties are available using standard dot notation:
firstAddress.name is “Bill”
firstAddress.address is “123 Main Street”
firstAddress.phone is “ ”
Ch16-Ex-01

12. Custom Objects Goal: Problem: Hard to search such a database
Create a new instance of the addressEntry object for each item in our database
Problem:
Each needs to be named something unique:
firstAddress
secondAddress
etc.
Hard to search such a database
Need a common naming convention

13. Databases as Arrays of Objects
Instead of creating separate variables
Create an array
Define each element of the array as a new address object

14. Databases as Arrays of Objects
var addresses = new Array(6)
addresses[0] = new addressEntry( “Bill”, “123 Main Street”, “ ”)
addresses[1] = new addressEntry( “Mary”, “456 Elm Street”, “ ”)
addresses[2] = new addressEntry( “Sam”, “789 Oak Avenue”, “ ”)

15. Databases as Arrays of Objects
Now we can use dot notation to refer to the object properties of each array element:
addresses[0].name is “Bill”
Ch16-Ex-02

16. Searching a Database By defining a database as
An array of objects
- and -
Using array notation and loops
Can now write search routines on databases
Ch16-Ex-03

17. Limitations
JavaScript is not the ideal mechanism to implement databases
Client cannot change database (at the source) so
Can’t perminately add, delete, or edit records
Database “exists” only in the HTML document
Large database make pages slow to load
Data is easily exposed
No or limited security measures

18. Large/Sensitive Databases
Data Typically keep on a central server
Flat file
Like text with data separated by delimiters
Each record a new line
OK for smaller sets of data
RDBMS (most common)
Relational DataBase Management System
IBM DB2
Oracle
MS sqlServer
mySQL
Restrict access to the data with server side processing
UID/Password protection

19. Large/Sensitive Databases
Data retrieved and maintained on server
In a secure environment
Passed to client
Work on server done by:
CGI program
ASP
Java
PHP
Etc.

20. Assignment See Assignments Web Page Grade based on: Appearance
Technical correctness of code
Proper results