Kamis, 16 April 2009

Tumpukan (Stack) 2

2. Program Stack 2

<html>
<head>
<title>Struktur Data Stack</title>
<script language="javascript">

var stack= new Array();

function Input_ke_Stack (data)
{
stack.push (data);
}

function Ambil_dari_Stack()
{
var data_dari_stack = stack.pop();
if (data_dari_stack == undefined)
return "Stack Sudah Kosong";
else
return data_dari_stack;
}

function TampilkanStack (list)
{
list.options.length = 0;
for (var i=0; i<stack.length; i++)
{
var data = new Option (stack[i]);
list.options [list.options.length] = data;
}
}

</script>
</head>
<body bgcolor = "lavender">
<form>
<input type = text name=textSimpan>
<input type = button value="Masukan ke Stack"
onClick='Input_ke_Stack (textSimpan.value);
textSimpan.value="";
TampilkanStack (mediaList);'>

<select name="mediaList" size=12>
<option>Tampilan data....
</select>
<input type=text name=textAmbil size=20>
<input type=button value="Ambil dari Stack"
onClick="textAmbil.value = Ambil_dari_Stack();
TampilkanStack (mediaList); ">
</form>
</body>
</html>


Output nya :

Rabu, 15 April 2009

Tumpukan (Stack)

1. Program Stack 1 :

<html>
<head>
<title>Contoh Implementasi Push dan POP pada Stack</title>
</head>

<body bgcolor="aqua">
<font color="green" face="comic sans ms">
<script type = "text/javascript">
var stack = new Array;
stack.push ("A");
stack.push ("B");
stack.push ("C");
document.write ("Stack :"+stack.toString() +"<br>");

var YangDiAmbil = stack.pop();
document.write ("Data Yang Diambil : "+YangDiAmbil);
document.write ("<br>");
document.write ("Isi Stack Terakhir :"+stack.toString());
</script>
</body>
</html>

Outputnya :

Minggu, 05 April 2009

Struktur Data

Silabus Materi :
1. Tipe Data dan Manipulasinya
2. Struktur Data Array (Larik)
3. Struktur Data Record (Rekaman) / Struct (Struktur)
4. Struktur Data Stack (Tumpukan)
5. Struktur Data Queue (Antrian) dan Struktur Data Dequeue (Antrian Berprioritas)
6. Struktur Data List (Daftar / Susunan)
7. Struktur Data Graph (Susunan Grafis)
8. Struktur Data Tree (Susunan Pohon)

Contoh-contoh program
1. Program percobaan
<HTML>
<HEAD>
<TITLE> Frameset</TITLE>
<SCRIPT Language = "JavaScript">
<!--
alert ("Selamat Datang di Struktur Data");
//-->
</SCRIPT>
</HEAD>
<BODY Bgcolor = "lavender">
<HR>
<Font Color = "blue" face="comic sans ms">
<P> Selamat Pagi..... <br>
Selamat belajar Struktur Data <br>
Semoga berhasil ! <br>
Salam Super... !!
<HR>
<Font Color = "blue" face="comic sans ms">
<MARQUEE>
<H4> SITI NURSEHA </H4>
<H4> TEKNIK INFORMATIKA </H4> </MARQUEE>
<HR>
</BODY>
</HTML>

2.Program percobaaan

<HTML>
<HEAD>
<TITLE> Frameset </TITLE>
</HEAD>
<frameset cols="50%,50%">
<frame src="sdata.html"mce_src="sdata.html">
<frame src="lat4.html"mce_src="lat4.html">
</frameset>
</HTML>


TIPE DATA
Yaitu kelompok data yang membedakan satu dengan yang lainnya. Tipe data dapat dikelompokan menjadi dua macam, yaitu :
1. Tipe dasar, merupakan tipe yang dapat langsung dipakai, yaitu :
a. Bilangan Logika atau Boolean,
b. Bilangan Bulat,
c. Bilangan Riil,
d. Karakter, dan
e. String.
2. Tipe bentukan, merupakan tipe yang didefinisikan sendiri oleh pemrogram. Contohnya :
a. Array, dan
b. Record.
Untuk memanipulasi data diperlukan operator, yaitu :
1. Operator Matematika : Penjumlahan (+), Perkalian (*), Pembagian (/), Modulus (%).
2. Operator Binary Digir : Dan (&), Atau (I), Atau (^), Negasi (-), Geser kekiri (<<), dan Geser kekanan (>>).
3. Operator Pembanding : Sama dengan (==), Tidak sama dengan (!=), Kurang dari (<), Lebih besar dari (>), Kurang dari atau sama dengan (<=), dan Lebih besar dari atau sama dengan (>=).

Contoh-contoh program :
1. Program Menambahkan 2 Bilangan :


<HTML>
<HEAD>
<TITLE>Type Bilangan</TITLE>
</HEAD>
<BODY Bgcolor="aqua">
<Font color="green" face="comic sans ms">
<SCRIPT LANGUAGE = "JavaScript">
<!--
var a = 15;
b = 14;

tambah = a + b;
kali = a * b;

document.write("Penambahan (" +a+ " + " +b+ ") = " + tambah);
document.write("<BR>");
document.write("Perkalian (" +a+ " X " +b+ ") = " + kali);
document.write("<BR>");
//-->
</SCRIPT>
</BODY>
</HTML>

2. Program Konversi Antar Sistem Bilangan

<HTML>
<HEAD>
<TITLE>Konversi Antar Sistem Bilangan</TITLE>
</HEAD>
<BODY Bgcolor="lavender">
<Font color="purple">
<SCRIPT LANGUAGE = "JavaScript">
<!--
var bil = new Number(25);
document.write("Bilangan Desimal: " +bil+ "<BR>");
document.write("<HR>");

document.write("Biner : " + bil.toString(2) + "<BR>");
document.write("Oktal : " + bil.toString(8) + "<BR>");
document.write("Heksa : " + bil.toString(16) + "<BR>");

//-->
</SCRIPT>
</BODY>
</HTML>

3. Membuat Function Untuk Menambahkan Bilangan

<HTML>
<HEAD>
<TITLE>Membuat Fungsi Matematika Dengan JavaScript</TITLE>
</HEAD>
<BODY Bgcolor="pink">
<Font face="comic sans ms">
<SCRIPT LANGUAGE = "JavaScript">
<!--
function jumlah (x, y) {
var hasil = x + y;

return(hasil);
}

var a = parseInt (prompt ("Ketikan Bilangan A = \n Ingat Jangan String",0));
var b = parseInt (prompt ("Ketikan Bilangan B = \n Ingat Jangan String",0));
var z = jumlah(a,b);

document.write(z);
document.write("<BR>");
document.write("<hr>");
document.write("Tipe Data nya adalah = " + typeof(z));

//-->
</SCRIPT>
</BODY>
</HTML>

4. Program Persamaan Kuadrat dengan Function

<HTML>
<HEAD>
<TITLE> Menghitung Persamaan Kuadrat dengan Function </TITLE>
</HEAD>
<BODY>
<SCRIPT Language = "JavaScript">
<!--
function jumlah(x,a,b,c)
{
var hasil = (x*x)*a + b*x +c;
return(hasil);
}
var x = parseInt (prompt("Masukkan Bilangan x = \n Ingat Harus Integer!!!"));
var a = parseInt (prompt("Masukkan Bilangan a = \n Ingat Harus Integer!!!"));
var b = parseInt (prompt("Masukkan Bilangan b = \n Ingat Harus Integer!!!"));
var c = parseInt (prompt("Masukkan Bilangan c = \n Ingat Harus Integer!!!"));
var z = jumlah(x,a,b,c);
document.write(z);
document.write("<BR>");
document.write("<HR>");
document.write("Rumus Persamaan Kuadrat adalah = " + "( ax2 + bx + c )");
document.write("<BR>");
document.write("Tipe Datanya adalah = " + typeof (z));
//-->
</SCRIPT>
</BODY>
</HTML>

ARRAY

Array adalah sekumpulan data atau struktur data yang mempunyai tipe data yang sama dan diakses berdasarkan indeks. Hampir di setiap bahasa pemrograman disediakan fasilitas untuk mendeklarasikan dan mengolah struktur Data Array.
Jenis-jenis array berdasarkan sifatnya :
1. Array Statis, dan
2. Array Dinamis.
Jenis-jenis array berdasarkan dimensi ruang-nya :
1. Array 1 Dimensi,
2. Array 2 Dimensi, dan
3. Array 3 Dimensi.

Contoh program :

1. Latihan 1

<HTML>
<HEAD>
<TITLE>Belajar Array</TITLE>
</HEAD>
<BODY Bgcolor = "aqua">
<FONT Color="green" face="comic sans ms">
<HR>
<SCRIPT LANGUAGE = "JavaScript">

<!--

var DATA_KU = new Array("Ini adalah latihan ke 4.....","Belajar tentang array...","Semoga latihan-latihan selanjutnya bisa berhasil...");

for (i=0; i<3; i++)
{
document.write(DATA_KU[i] +"<br>");
}

alert ("Selamat Belajar Struktur Data");
alert ("Semoga Memperoleh Ilmu Yang Bermanfaat");

//-->

</SCRIPT>
<HR>
</BODY>
</HTML>

2. Program parameter array

<HTML>
<HEAD>
<TITLE>Parameter Array</TITLE>
</HEAD>
<BODY Bgcolor = "aqua">
<Font color="green" face="comic sans ms">
<SCRIPT LANGUAGE = "JavaScript">
<!--

var tempat = [];
var data = prompt ("Ketik Jumlah Maksimum Array :");

for (m=1; m<data; m++)
{
var bil = prompt ("Masukan Bilangan :");
tempat [m]= bil;
}

for (n=1; n<data; n++)
{
document.write("Elemen Array ("+n+") =" +tempat[n] + "<BR>");
}

//-->
</SCRIPT>
</BODY>
</HTML>

2. Program menghitung dan menampilkan deret Fibonacci

<html>
<head>
<script>
<!--

function fibonacci (n) {
var i;
var array_fib = new Array();

array_fib.push(0);
array_fib.push(1);

for (i=0; i<n; i++) {
array_fib.push(array_fib[0] + array_fib[1]);
array_fib.shift();
}
return array_fib[0];
}

for(i=0; i<=20; i++)
document.write("fibonacci (" + i + ") = " + fibonacci(i) + "<br>");

//-->
</script>
</head>
<body bgcolor="sky blue">

</body>
</html>

RECORD
Record merupakan tipe bentukan yang disusun oleh satu atau lebih field. Tiap fielc menyimpan data dari tipe dasar tertentu atau dari tipe bentukan lain yang sudah didefinisikan sebelumnya. Nama record ditentukan oleh pemrogram. Karena strukturnya yang disusun oleh field-field, maka record dinamakan juga tipe terstruktur.

Contoh program :

1. Program membuat rekaman objek

<html>
<head><title>Membuat Rekaman Objek</title></head>
<body bgcolor="lavender">
<script language = "JavaScript">
<!--

var Record = new Array();
function Mahasiswa(npm, nama, prodi, jenjang) {
// Properti
this.npm = npm;
this.nama = nama;
this.prodi = prodi;
this.jenjang = jenjang;

// Metode

this.LihatRecordMahasiswa = LihatRecordMahasiswa;
}

function LihatRecordMahasiswa() {
document.write("<td>" + this.npm + "</td>");
document.write("<td>" + this.nama + "</td>");
document.write("<td>" + this.prodi + "</td>");
document.write("<td>" + this.jenjang + "</td>");
}

//mengisi data
Record[0] = new Mahasiswa("43E001", "Dani", "TI", "S1");
Record[1] = new Mahasiswa("43E001", "Doni", "TI", "S1");
Record[2] = new Mahasiswa("43E001", "Dina", "TI", "S1");
Record[3] = new Mahasiswa("43E001", "Dini", "TI", "S1");

//menampilkan data
document.write("<table border = '1'>");
document.write("<th>NPM</th><th>Nama</th>");
document.write("<th>Prodi</th><th>Jenjang</th><br>");

for (i=0; i < Record.length; i++)
{
document.write("<tr>");
Record[i].LihatRecordMahasiswa();
document.write("</tr>");
}
document.write("</table><br>");

document.write("<table border = '1'>");
document.write("<th>NPM</th><th>Nama</th>");
document.write("<th>Prodi</th><th>Jenjang</th><br>");

for (i=0; i < Record.length; i++)
{
document.write("<tr>");
Record[i].npm
document.write("</tr>");
}
document.write("</table>");

//-->

</script>
</body>
</html>

2. Program entri data pegawai

<html>
<head><title> Memanipulasi Data Pegawai </title>
<script language = "javascript" type="text/javascript">
<!--
var DBPegawai = new Array();
function Pegawai(Fields_NIP,
Fields_Nama,
Fields_Gaji_Per_Jam,
Fields_Jam_Kerja,
Fields_Gaji_Total)
{
this.NIP = Fields_NIP;
this.Nama = Fields_Nama;
this.Gaji_Per_Jam = Fields_Gaji_Per_Jam;
this.Jam_Kerja = Fields_Jam_Kerja;
this.Gaji_Total = Fields_Gaji_Total;
}
function inputPegawai()
{
var Nama,Gaji_Per_Jam, Jam_Kerja, Gaji;
while ( NIP = window.prompt("Ketikan NIP (Nomor Induk Pegawai)\n\n Click 'cancel' untuk Berhenti !!."))
{

Nama = window.prompt ("Nama Pegawai :");
Gaji_Per_Jam = parseInt (window.prompt("Gaji Per Jam :"));
Jam_Kerja = parseInt (window.prompt("Jumlah Jam Kerja :"));
Gaji = Gaji_Per_Jam * Jam_Kerja;
DBPegawai[DBPegawai.length] = new Pegawai(NIP,Nama,Gaji_Per_Jam,Jam_Kerja,Gaji);
}
ShowPegawai();
}
function ShowPegawai(){

document.write("<table border ='1'>"+"<tr>"+"<th>NIP</th><th>Nama</th><th>Gaji Per Jam</th><th>Jam Kerja</th>"+"<th>Gaji Total</th>"+"</tr>");

for (i=0; i < DBPegawai.length; i++){
document.write("<tr>"+
"<td>" + DBPegawai[i].NIP + "</td>" +
"<td>" + DBPegawai[i].Nama + "</td>" +
"<td align='right'>" + DBPegawai[i].Gaji_Per_Jam + "</td>" +
"<td align='right'>" + DBPegawai[i].Jam_Kerja + "</td>" +
"<td align='right'>" + DBPegawai[i].Gaji_Total + "</td>" +
"</tr>");
}
document.write ("</table>");
}
//-->
</script>
</head>
<body onload ="inputPegawai();">
</body>
</html>

Program Kalender dan Jam Digital


<script>
setCal()

function getTime() {
// initialize time-related variables with current time settings
var now = new Date()
var hour = now.getHours()
var minute = now.getMinutes()
now = null
var ampm = ""

// validate hour values and set value of ampm
if (hour >= 12) {
hour -= 12
ampm = "PM"
} else
ampm = "AM"
hour = (hour == 0) ? 12 : hour

// add zero digit to a one digit minute
if (minute < 10)
minute = "0" + minute // do not parse this number!

// return time string
return hour + ":" + minute + " " + ampm
}

function leapYear(year) {
if (year % 4 == 0) // basic rule
return true // is leap year
/* else */ // else not needed when statement is "return"
return false // is not leap year
}

function getDays(month, year) {
// create array to hold number of days in each month
var ar = new Array(12)
ar[0] = 31 // January
ar[1] = (leapYear(year)) ? 29 : 28 // February
ar[2] = 31 // March
ar[3] = 30 // April
ar[4] = 31 // May
ar[5] = 30 // June
ar[6] = 31 // July
ar[7] = 31 // August
ar[8] = 30 // September
ar[9] = 31 // October
ar[10] = 30 // November
ar[11] = 31 // December

// return number of days in the specified month (parameter)
return ar[month]
}

function getMonthName(month) {
// create array to hold name of each month
var ar = new Array(12)
ar[0] = "January"
ar[1] = "February"
ar[2] = "March"
ar[3] = "April"
ar[4] = "May"
ar[5] = "June"
ar[6] = "July"
ar[7] = "August"
ar[8] = "September"
ar[9] = "October"
ar[10] = "November"
ar[11] = "December"

// return name of specified month (parameter)
return ar[month]
}

function setCal() {
// standard time attributes
var now = new Date()
var year = now.getYear()
if (year < 1000)
year+=1900
var month = now.getMonth()
var monthName = getMonthName(month)
var date = now.getDate()
now = null

// create instance of first day of month, and extract the day on which it occurs
var firstDayInstance = new Date(year, month, 1)
var firstDay = firstDayInstance.getDay()
firstDayInstance = null

// number of days in current month
var days = getDays(month, year)

// call function to draw calendar
drawCal(firstDay + 1, days, date, monthName, year)
}

function drawCal(firstDay, lastDate, date, monthName, year) {
// constant table settings
var headerHeight = 50 // height of the table's header cell
var border = 2 // 3D height of table's border
var cellspacing = 4 // width of table's border
var headerColor = "midnightblue" // color of table's header
var headerSize = "+3" // size of tables header font
var colWidth = 60 // width of columns in table
var dayCellHeight = 25 // height of cells containing days of the week
var dayColor = "darkblue" // color of font representing week days
var cellHeight = 40 // height of cells representing dates in the calendar
var todayColor = "red" // color specifying today's date in the calendar
var timeColor = "purple" // color of font representing current time

// create basic table structure
var text = "" // initialize accumulative variable to empty string
text += '<CENTER>'
text += '<TABLE BORDER=' + border + ' CELLSPACING=' + cellspacing + '>' // table settings
text += '<TH COLSPAN=7 HEIGHT=' + headerHeight + '>' // create table header cell
text += '<FONT COLOR="' + headerColor + '" SIZE=' + headerSize + '>' // set font for table header
text += monthName + ' ' + year
text += '</FONT>' // close table header's font settings
text += '</TH>' // close header cell

// variables to hold constant settings
var openCol = '<TD WIDTH=' + colWidth + ' HEIGHT=' + dayCellHeight + '>'
openCol += '<FONT COLOR="' + dayColor + '">'
var closeCol = '</FONT></TD>'

// create array of abbreviated day names
var weekDay = new Array(7)
weekDay[0] = "Sun"
weekDay[1] = "Mon"
weekDay[2] = "Tues"
weekDay[3] = "Wed"
weekDay[4] = "Thu"
weekDay[5] = "Fri"
weekDay[6] = "Sat"

// create first row of table to set column width and specify week day
text += '<TR ALIGN="center" VALIGN="center">'
for (var dayNum = 0; dayNum < 7; ++dayNum) {
text += openCol + weekDay[dayNum] + closeCol
}
text += '</TR>'

// declaration and initialization of two variables to help with tables
var digit = 1
var curCell = 1

for (var row = 1; row <= Math.ceil((lastDate + firstDay - 1) / 7); ++row) {
text += '<TR ALIGN="right" VALIGN="top">'
for (var col = 1; col <= 7; ++col) {
if (digit > lastDate)
break
if (curCell < firstDay) {
text += '<TD></TD>';
curCell++
} else {
if (digit == date) { // current cell represent today's date
text += '<TD HEIGHT=' + cellHeight + '>'
text += '<FONT COLOR="' + todayColor + '">'
text += digit
text += '</FONT><BR>'
text += '<FONT COLOR="' + timeColor + '" SIZE=2>'
text += '<CENTER>' + getTime() + '</CENTER>'
text += '</FONT>'
text += '</TD>'
} else
text += '<TD HEIGHT=' + cellHeight + '>' + digit + '</TD>'
digit++
}
}
text += '</TR>'
}

// close all basic table tags
text += '</TABLE>'
text += '</CENTER>'

// print accumulative HTML string
document.write(text)
}
</script>
<p align="center"><font face="arial" size="-2">This free script provided by</font><br>
<font face="arial, helvetica" size="-2"><a href="http://javascriptkit.com">JavaScript
Kit</a></font></p>