Menggunakan objek bawaan JavaScript

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 toUpperCasemetode.)

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: string1dan 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_objadalah 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.