Belajar Javascript Part 9 Tipe data di javascript
Dalam JavaScript atau dalam bahasa pemrograman apa pun, pengetahuan tentang tipe data itu penting.
Mengapa demikian?
Karena dengan adanya tipe data kita jadi mengetahui jenis data apa yang dimiliki oleh sebuah nilai/value yang dipunyai oleh sebuah variabel.
Dengan begitu ketika terdapat kesalahan yang terjadi pada bagian tipe data yang digunakan, maka akan dengan mudah untuk memperbaikinya.
Kemudian apa sih itu tipe data ? Berikut penjelasan yang diberikan.
Apa itu Tipe Data?
Tipe data adalah berbagai jenis data yang dapat disimpan atau digunakan dalam program JavaScript.
Seperti yang sudah dijelaskan di atas kalau tipe data ialah jenis data itu sendiri yang disimpan kedalam sebuah variabel.
Berikut ada 7 tipe data di bahasa pemrograman javascript:
1. Tipe Data String
Tipe data string adalah urutan karakter yang digunakan untuk mewakili teks.
String dapat ditulis dengan tanda petik tunggal/satu atau tanda petik ganda/dua.
var name = "John Doe"; // double quotes
var name1 = 'John Doe'; // single quotes
document.getElementById("demo").innerHTML = name + "<br>" + name1;
Pertanyaannya haruskah kita menggunakan tanda kutip tunggal atau ganda?
Jawabannya adalah relatif yaitu tergantung kita dapat menggunakan mana yang kita suka. Mau menggunakan tanda kutip satu atau tanda kutip dua.
Tetapi jika string berisi tanda kutip tunggal, maka gunakan tanda kutip ganda.
Atau jika mengandung tanda kutip ganda, gunakan tanda kutip tunggal.
var sentence = "Her name is 'Rachell'"; // use double quotes when the string contains single quotes
var sentence1 = 'Her name is "Rachell"'; // use single quotes when the string contains double quotes
document.getElementById("demo").innerHTML =
sentence + "<br>" + sentence1;
2. Tipe Data Number
Tipe data number atau bilangan adalah bilangan bulat atau bilangan floating point (number dengan desimal).
Berikut contoh dari tipe data number.
var x = 4; // bilangan integer/bulat
var y = 5.5; // bilangan float/desimal
document.getElementById("demo").innerHTML = x + "<br>" + y;
Berikut adalah contoh penjumlahan dua bilangan:
var x = 4; // an integer
var y = 5.5; // a floating point number
var sum = x + y; // adds the two numbers
document.getElementById("demo").innerHTML = sum;
Kita sudah belajar dari dua jenis tipe data diatas. Bagaimana jika keduanya dapat digabungkan, apakah bisa? tentu saja bisa berikut penjelasannya!
Menggabungkan String dan Number/Angka
Untuk menggabungkan dua tipe data string dan angka. Kita harus memahami 3 konsep berikut dalam mengkombinasikan tipe data string dan number.
- Menggabungkan string dan string mengembalikan string.
- Menggabungkan angka dan angka menghasilkan angka.
- Menggabungkan string dan angka mengembalikan string.
Berikut contoh penggabungan dua tipe datanya:
var text = 21 + "Rachell"; // returns "21Rachell"
var text1 = "Rachell" + 21; // returns "Rachell21"
document.getElementById("demo").innerHTML = text + "<br>" + text1;
Harus kita ketahui kalau di javascript kode yang dibaca oleh mesin browser dimulai dari kiri kekanan.
Karena JavaScript mengevaluasi dari kiri ke kanan, maka urutan kode yang berbeda menghasilkan hasil yang berbeda.
Agar lebih memahami coba lihat contoh kode dibawah ini.
var text = 10 + 11 + "Rachell"; // returns "21Rachell"
var text1 = "Rachell" + 10 + 11; // returns "Rachell1011"
document.getElementById("demo").innerHTML = text + "<br>" + text1;
3. Tipe Data Boolean
Tipe data Boolean adalah tipe data logis yang hanya dapat memiliki nilai benar atau salah.
Nilai benar atau salah ini dibahasa pemrograman javascript atau yang lainnya diwakilkan dengan kode true atau false.
Coba perhatikan contoh kodenya berikut ini.
var isCodingFun = true;
var isMathFun = true;
document.getElementById("demo").innerHTML = "Is coding fun? " + isCodingFun + "<br>" + "Is Math fun? " + isMathFun;
Tipe data boolean biasanya digunakan untuk pengujian bersyarat (pengujian kondisional), bukan yang kita lakukan pada contoh kode sebelumnya di atas.
Kita akan belajar tentang pengujian bersyarat nanti.
Boolean adalah output dari operator pembanding.
Operator Perbandingan ( == ) digunakan untuk menguji apakah dua nilai sama atau sejenis.
Jika ya, ia mengembalikan true, jika tidak maka false.
Untuk lebih jelasnya pahami kode dibawah berikut.
var x = 3;
var y = 3;
var areTheyEqual = (x == y);
document.getElementById("demo").innerHTML = areTheyEqual;
4. Tipe Data yang tidak ditentukan/undefined
Jika variabel tidak memiliki nilai yang ditetapkan, nilainya tidak terdefinisi(undefined)
Dalam contoh di bawah ini, variabel title dideklarasikan tetapi tidak ditetapkan ke nilai apa pun.
Oleh karena itu, nilainya tidak terdefinisi(undefined).
var title;
document.getElementById("demo").innerHTML = title; // prints undefined
Jika suatu variabel tidak dideklarasikan, itu artnya ia mengembalikan nilai undefined.
5. Tipe Data null
Tipe data null adalah tipe data khusus yang menunjukkan nilai null - artinya bukan string kosong " " atau 0.
Hanya saja tipe data null Itu tidak berarti apa-apa.
var fruit = null;
document.write(fruit); // prints null
Kita dapat mengosongkan variabel dengan mengatur nilai tipe datanya ke null. Berokut contohnya:
var fruit = "apple";
document.write(fruit + "<br>"); // prints apple
fruit = null; // sets the value to null
document.write(fruit); // prints null
6. Tipe Data Objek
Dalam pelajaran ini, kita hanya akan mempelajari konsep paling dasar dari Objek JavaScript.
Tipe data objek adalah kumpulan data terkait.
Objek berisi properti yang ditulis dalam kunci: pasangan nilai.
Setiap pasangan dipisahkan dengan koma (,).
Objek ditulis di dalam kurung kurawal {}.
Coba perhatikan contoh dari tipe data objek berikut.
var banana = {
color: "yellow",
size: "long",
quantity: 3,
isSweet: true,
};
document.getElementById("demo").innerHTML =
"Banana <br>" +
"Color: " + banana.color + "<br>" +
"Size: " + banana.size + "<br>" +
"Quantity: " + banana.quantity + "<br>" +
"Does it taste sweet: " + banana.isSweet;
Pada contoh di atas, objek banana memiliki 4 properti yaitu: color, size, quantity dan isSweet.
- Properti color memiliki nilai yellow.
- Properti size memiliki nilai long.
- Properti quantity memiliki nilai 3.
- Properti isSweet memiliki nilai true.
7. Tipe Data Array JavaScript
Array JavaScript adalah kumpulan nilai. Setiap nilai dipisahkan dengan koma (,).
Ditulis dengan tanda kurung siku [].
Dapat disebut juga kalau tipe data array adalah objek.
var fruits = ["apel", "jeruk", "pisang"];
document.getElementById("demo").innerHTML =
fruits[0] + " " + fruits[1] + " " + fruits[2];
Pada contoh di atas, variabel buah berisi tiga nilai string: apel, jeruk, dan pisang
JavaScript itu Dinamis
JavaScript adalah bahasa yang dinamis.
Karena variabel tidak secara langsung terkait dengan satu tipe data, tidak seperti dalam bahasa pemrograman lainnya.
Variabel apa pun dalam JavaScript dapat dipindahkan ke nilai semua jenis tipe data. Simak contoh kode dibawah ini:
var x = "text"; // x is a string
x = true; // x is now a boolean
x = 21; // x is now a number
document.write(x);
Operator typeof
Typeof mengembalikan string yang menunjukkan tipe data dari nilai yang dievaluasi oleh javascript.
Jadi operator typeof ini biasanya digunakan untuk mengecek atau melihat tipe data apa yang kita gunakan untuk sebuah variabel atau nilai.
Agar lebih mengetahui berikut penggunaan operator typeof.
document.getElementById("demo").innerHTML =
typeof "Her name is Rachell." + "<br>" + // returns "string"
typeof 21 + "<br>" + // returns "number"
typeof true + "<br>" + // returns "boolean"
typeof undefined; // returns "undefined"
Data Primitif
Data primitif adalah data yang bukan objek dan tidak memiliki metode.
Ada 4 tipe data primitif dasar:
- String
- Number
- Boolean
- Undefined
Semua tipe data primitif ini dapat dikembalikan oleh operator typeof. Sama seperti pada contoh sebelumnya.
Data Kompleks
Ada dua tipe data yang kompleks, keduanya dapat dikembalikan oleh operator tipeof.
- Object
- Function
Bingung? coba pahami contoh kode berikut!
document.getElementById("demo").innerHTML =
typeof {firstName: "John", lastName: "Doe", age: 30} + "<br>" + // returns "object"
typeof ["apples", "oranges", "bananas"] + "<br>" + // returns "object"
typeof null + "<br>" + // returns "object"
typeof function myFunction(){}; // returns "function"
Seperti yang mungkin Anda perhatikan, operator typeof mengembalikan "objek" ketika nilai asal adalah objek, array, atau null. Dan itu mengembalikan "function" , ketika nilai asal adalah suatu fungsi.
Akhirnya saya cukupkan sampai disinj penjelasan kita kali ini. Saya harap kamu yang sedang belajar tentang javascript memahami tipe data di dalam bahasa pemrograman yang digunakan oleh si javascript ini.
Semangat