JavaScript menggunakan sejumlah objek bawaan yang memperluas fleksibilitas bahasa. Objek-objek ini adalah Tanggal, Matematika, String, Array, dan Objek. Beberapa dari objek ini "dipinjam" dari spesifikasi bahasa Java, tetapi penerapan JavaScript berbeda. Jika Anda terbiasa dengan Java, Anda sebaiknya memeriksa dengan cermat tipe objek bawaan JavaScript untuk menghindari kebingungan.
Model objek JavaScript itu sederhana. Sebagian besar objek ini berhubungan dengan konten jendela - dokumen, tautan, formulir, dan sebagainya. Selain objek konten jendela, JavaScript mendukung beberapa objek "bawaan". Objek bawaan ini tersedia terlepas dari konten jendela dan beroperasi secara independen dari halaman apa pun yang dimuat browser Anda.
Mempelajari JavaScript
Artikel ini adalah bagian dari arsip konten teknis JavaWorld. Anda dapat belajar banyak tentang pemrograman JavaScript dengan membaca artikel dalam seri JavaScript , namun perlu diingat bahwa beberapa informasi mungkin sudah usang. Lihat "Menggunakan JavaScript dan formulir" dan "Men-debug program JavaScript" untuk lebih lanjut tentang pemrograman dengan JavaScript.
Objek bawaan adalah Tanggal, Matematika, String, Array, dan Objek. Masing-masing digunakan dengan cara yang unik dan tidak cukup konsisten. Lebih lanjut, versi JavaScript yang lebih baru (seperti yang ditemukan di Netscape "Atlas," saat ini dalam versi beta) mengimplementasikan beberapa objek ini dengan cara yang berbeda dari pada Netscape 2.0. Di kolom ini kita akan membahas objek bawaan ini dan cara menggunakannya. Dan kami akan membuat catatan tentang kebiasaan yang akan Anda temui saat Anda menerapkan objek ini ke halaman JavaScript Anda.
Memahami objek string
Dari semua objek JavaScript, objek String adalah yang paling umum digunakan. Dalam implementasi JavaScript Netscape 2.0, objek string baru dibuat secara implisit menggunakan tugas variabel. Sebagai contoh,
var myString = "This is a string";
membuat string, dengan teks yang ditentukan, disebut myString.
Di Netscape 2.0, tidak ada objek aktual yang disebut string, dan mencoba membuat instance objek String baru menggunakan pernyataan baru menghasilkan kesalahan, karena String (atau string) bukan kata kunci yang ditentukan . Dalam versi Atlas Netscape, bagaimanapun, String adalah objek yang bonafid, dan kata kunci String dapat digunakan untuk membuat string baru. Dua pendekatan berikut diizinkan di Atlas, tetapi tidak di Netscape 2.0.
var myString = new String(); myString = "This is a string";
dan
var myString = new String ("This is a string");
Objek string memiliki satu properti: panjang. Properti panjang mengembalikan panjang string dan menggunakan sintaks di string.length,
mana string adalah nama variabel string. Kedua tampilan berikut 16.
alert ("This is a string".length)
dan
var myString = "This is a string"; alert (myString.length);
Meskipun mungkin hanya ada satu properti string, JavaScript mendukung sejumlah besar metode yang dapat digunakan dengan string. Metode ini secara kasar dapat dibagi menjadi dua kelompok besar: manajemen string dan format teks.
Lainnya dari JavaWorld
Ingin lebih banyak berita perusahaan Java? Dapatkan buletin JavaWorld Enterprise Java dikirim ke kotak masuk Anda.
Metode manajemen String termasuk substring
, indexOf
, lastIndexOf
, dan toLowerCase
. Ini digunakan untuk mengembalikan atau mengubah konten string dengan cara tertentu. Misalnya, metode substring mengembalikan bagian tertentu dari string. Metode indexOf menentukan lokasi karakter atau sekelompok karakter dalam sebuah string. Dan metode toLowerCase mengubah string menjadi huruf kecil. (Seperti yang bisa Anda bayangkan, ada juga toUpperCase
metode.)
Metode format teks digunakan untuk memformat teks dalam dokumen dengan beberapa cara khusus, dan disediakan sebagai alternatif untuk menggunakan tag HTML untuk tujuan yang sama. Metode ini termasuk besar, kecil, sup, sub, jangkar, tautan, dan kedip.
Metode string dapat digunakan secara langsung pada string, atau pada variabel yang berisi string. Metode selalu menggunakan tanda kurung buka dan tutup, meskipun metode tersebut tidak menggunakan parameter. Misalnya, untuk mengonversi teks menjadi huruf besar, Anda akan menggunakan salah satu dari berikut ini:
var tempVar = "this text is now upper case".toUpperCase();
atau
var myString = "this text is now upper case"; var tempVar = myString.toUpperCase();
Di Netscape 2.0 hanya ada satu objek String, dan semua string dibuat darinya. Sebaliknya, string adalah objek kelas satu di Atlas, dan setiap string baru diperlakukan sebagai objek terpisah. Perilaku objek tunggal dari string di Netscape 2.0 dapat menyebabkan beberapa efek samping yang halus. Ambil segmen skrip pendek berikut ini. Dua string dibuat: string1
dan string2
. Properti baru (disebut ekstra) ditugaskan ke string1. Namun pesan peringatan menunjukkan bahwa properti tersebut sekarang juga milik string2.
string1 = "this is string 1" string2 = "this is string 2" string1.extra = "new property" alert (string2.extra)
Secara teknis, string "tidak berubah" di JavaScript. Artinya, konten string bersifat statis, dan tidak dapat diubah. Di Netscape 2.0, JavaScript mampu memodifikasi string hanya dengan membuat lokasi baru di memori untuknya. Karena itu, skrip yang mengubah string berkali-kali rentan terhadap kesalahan memori. Setiap kali string diubah, JavaScript membuat lokasi baru di memori untuk versi baru. String baru dibuat sebelum pengumpulan sampah dilakukan untuk menghancurkan string lama. Akhirnya, JavaScript menggunakan semua memori yang tersedia, dan kesalahan "kehabisan memori" terjadi.
Contoh klasik dari masalah ini dapat dilihat di "penggulung pesan" JavaScript yang populer, di mana pesan bergulir di bilah status atau kotak teks. Untuk setiap lintasan, penggulung mendefinisikan ulang variabel string yang ditampilkan. Memori pada akhirnya akan habis karena JavaScript membuat instance baru dari string dengan setiap pass. Misalnya, skrip berikut pada akhirnya (lebih cepat pada beberapa platform, seperti Windows 3.1) menyebabkan kesalahan "kehabisan memori":
var count = 0; var text = "This is a test of a JavaScript scroller. "; scroll(); function scroll () { var myString = text.substring (count, text.length) + text.substring (0, count) window.status = myString if (count < text.length) count ++; else count = 0; setTimeout ("scroll()", 333); // 333ms is the minimum delay for Netscape 2.0 }
Penulisan ulang sederhana menghindari masalah membuat blok memori baru. Hapus tugas variabel myString, dan parse teks langsung ke bilah status, menggunakan window.status.
window.status = text.substring (count, text.length) + text.substring (0, Count)
(Meskipun pendekatan di atas menghindari masalah replikasi objek string JavaScript, kebocoran memori masih terjadi karena penggunaan setTimeout method
. Lebih dari banyak iterasi - biasanya beberapa ribu atau lebih - setTimeout akan menghabiskan semua memori yang tersedia, dan akhirnya JavaScript akan menampilkan " kehabisan memori ".)
Untuk referensi Anda, berikut adalah metode dan properti yang digunakan dengan objek string JavaScript:
Properti String
panjangnya | Panjang senar |
Metode String
jangkar | Membuat jangkar bernama (target hypertext) |
besar | Setel teks menjadi besar |
berkedip | Menyetel teks menjadi berkedip |
mencolok | Setel teks menjadi tebal |
charAt | Mengembalikan karakter pada posisi tertentu |
tetap | Menyetel teks dalam font nada tetap |
warna huruf | Setel warna font |
ukuran huruf | Setel ukuran font |
Indeks | Mengembalikan kemunculan pertama karakter x dimulai dari posisi y |
huruf miring | Setel teks menjadi miring |
lastIndexOf | Returns the last occurrence of character x starting from position y |
link | Creates a hyperlink |
small | Sets text to small |
strike | Sets text to strikeout |
sub | Sets text to subscript |
substring | Returns a portion of a string |
sup | Sets text to superscript |
toLowerString | Converts a string to lowercase |
toUpperString | Converts a string to uppercase |
Using JavaScript as a scientific calculator
JavaScript's Math object provides advanced arithmetic and trigonometric functions, expanding on JavaScript's basic arithmetic operators (plus, minus, multiply, divide). The Math object in JavaScript is borrowed from Java. In fact, the implementation of the Math object in JavaScript closely parallels the Math class in Java, except that the JavaScript Math object offers fewer methods.
JavaScript's Math object properties are treated as constants. In fact, the property names are in all upper-case, following the usual convention of capitalizing variable constants. These properties return often-used values, including pi and the square root of 2. The Math methods are used in mathematical and trigonometric calculations. Handy Math-object methods include ceil, floor, pow, exp (exponent), max, min, round, and random. (Random is only available when using the X Window platform, however.)
The Math object is static, so you don't need to create a new Math object in order to use it. To access the properties and method of the Math object, you merely specify the Math object, along with the method or property you wish. For example, to return the value of pi, you use:
var pi = Math.PI;
Similarly, to use a math method you provide the name of the method, along with the parameters you wish to use. For example, to round the value of pi, you'd use:
var pi = Math.PI; var pieAreRound = Math.round(pi); // displays 3
Note that you must specify the Math object by name for each Math method/property you wish to use. JavaScript does not recognize the keywords PI and round all by themselves. Exception: you may use the with
statement to associate the names of methods and properties with the Math object. This technique is a handy space-saver when you must use several Math properties and methods. The previous example can be written as
with (Math) { var pi = PI; var pieAreRound = round(pi); alert (pieAreRound) }
For your reference, here are the properties and methods supported by JavaScript's Math object.
Math Properties
E | Euler's constant |
LN2 | The natural logarithm of 2 |
LN10 | The natural logarithm of 10 |
LOG2E | The base 2 logarithm of e |
LOG10E | The base 10 logarithm of e |
PI | The numeric equivalent of PI: 3.14 etc. |
SQRT1_2 | The square root of one-half |
SQRT2 | The square root of 2 |
Math Methods
abs | Returns the absolute value of a number |
acos | Returns the arc cosine of a number |
asin | Returns the arc sine of a number |
atan | Returns the arc tangent of a number |
ceil | Returns the least integer greater than or equal to a number |
cos | Returns the cosine of a number |
exp | Returns e (Euler's constant) to the power of a number |
floor | Returns the greatest integer less than or equal to its argument |
log | Returns the natural logarithm (base e) of a number |
max | Returns the greater of two values |
min | Returns the lesser of two values |
pow | Returns the value of a number times a specified power |
random | Returns a random number (X-platforms only) |
round | Returns a number rounded to the nearest whole value |
sin | Returns the sine of a number |
sqrt | Returns the square root of a number |
tan | Returns the tangent of a number |
Asking JavaScript for a date
Also borrowed by Java is the Date object, which can be used in JavaScript to determine the current time and date. A popular JavaScript application of the Date object is displaying a digital clock in a text box. The script uses the Date object to update the clock once every second. You also use the Date object to perform date math. For example, your script might determine the number of days between now and a certain future date. You can use this to display a "countdown," such as the number of days left of your company's big sale.
JavaScript treats the Date object like a constructor class. To use Date you must create a new Date object; you can then apply the various Date methods to get and set dates. (The Date object has no properties.) If you're familiar with the Date class in Java, you'll find the properties of the JavaScript Date object largely the same. The most commonly used methods are the get
methods, which obtain the time and date of the value in the Date object. These methods are:
- getHours() - Returns the hour
- getMinutes() - Returns the minutes
- getSeconds() - Returns the seconds
- getYear() - Returns the year ("96" is 1996)
- getMonth() - Returns the month ("0" is January)
- getDate() - Returns the day of the month
- getDay() - Returns the day of the week ("0" is Sunday)
(Objek Tanggal JavaScript juga menyediakan pengaturan waktu dan tanggal objek Tanggal, tetapi ini jarang digunakan.)
Membangun objek Tanggal baru dapat memiliki beberapa bentuk. Untuk mengembalikan objek yang berisi tanggal dan waktu saat ini, Anda menggunakan objek Tanggal tanpa parameter. Berikut ini, date_obj
adalah objek baru, berisi nilai tanggal dan waktu saat ini, seperti yang ditetapkan oleh jam sistem komputer.
var date_obj = new Date();
Alternatifnya, Anda dapat menentukan tanggal dan waktu tertentu sebagai bagian dari konstruktor tanggal. Salah satu dari metode ini diizinkan - keduanya menyetel objek tanggal baru ke 1 Januari 1997, pada tengah malam waktu setempat.
var date_obj = new Date ("January 1 1997 00:00:00")
dan
var date_obj = new Date (97, 0, 1, 12, 0, 0)
Untuk menggunakan metode Tanggal, tambahkan metode ke objek tanggal yang Anda buat sebelumnya. Misalnya, untuk mengembalikan tahun ini, gunakan:
var now = new Date(); var yearNow = now.getYear();
Untuk referensi Anda, berikut adalah metode yang didukung oleh objek Tanggal JavaScript.