Tutorial Javascript 14 : Javascript Type Conversion, Bagaimana Cara Mengkonversi Tipe Data pada Javascript ?

Last Updated on October 29, 2021 by

JavaScript, menggunakan tipe data sama seperti bahasa pemrograman lainnya. Dalam JavaScript terdapat string, angka, objek, array dan lain-lain. Anda perlu mengetahui dan memahaminya terkait hal yang diwakili masing-masing tipe data dan memahami bagaimana Anda dapat bekerja dengannya. Hal ini memungkinkan Anda memiliki kontrol lebih besar atas kode yang Anda tulis atau baca.

Akan sangat berguna bagi Anda untuk mengetahui cara memanipulasi data dengan mengonversinya dari satu jenis ke jenis lainnya. Anda mungkin perlu menggunakan JavaScript, mengubahnya menjadi string dalam beberapa kasus atau ubah string menjadi angka di kasus lain.

Kali ini, Codekey akan menjelaskan tentang cara mengkonversi tipe data sehingga Anda akan terbiasa dengan konversi tipe data dalam  JavaScript dan belajar mengubah setiap tipe data menjadi yang berbeda. Kami akan membahas JavaScript Type Conversion di bawah ini selengkapnya.

JavaScript Type Conversion

Seringkali, operator dan fungsi secara otomatis mengonversi nilai yang diberikan kepada mereka ke jenis yang tepat. Misalnya, ‘alert’ secara otomatis mengubah nilai apa pun menjadi string untuk menampilkannya. Operasi matematika mengonversi nilai menjadi angka. Ada juga kasus ketika kita perlu secara eksplisit mengonversi nilai ke tipe yang diharapkan.

Tiga tipe utama JavaScript Type Conversion adalah String (), Number () dan Boolean (). Ketiganya berfungsi untuk mengonversi data ke jenis namanya masing-masing. Tidaklah mungkin untuk mendeteksi jika tipe objek JavaScript adalah tanggal atau larik dengan menggunakan typeof. Untuk tanggal dan larik, tipe objek akan dikembalikan. Beberapa hal yang harus Anda ingat tentang konversi tipe data dalam JavaScript:

1. Anda dapat menerapkan konversi JavaScript ke string, angka, dan boolean.
2. Array dan date adalah tipe data objek.
3. Kebanyakan tipe data berisi nilai, tetapi tidak terdefinisi dan null tidak.
4. typeof adalah operator, jadi tidak berisi tipe data.

Ada lima tipe data yang dapat berisikan value dalam JavaScript:

1. Number Type
2. Boolean Type
3. String Type
4. Function Type
5. Object Type

Dalam JavaScript juga tiga tipe objek yaitu:

1. Object Type
2. Date Type
3. Array Type

Terakhir, ada dua tipe data yang tidak dapat menyimpan nilai:

1. Undefined Type
2. Null Type

Operator typeof

typeof operator digunakan ketika Anda perlu mengetahui tipe data dalam variabel JavaScript. Hal itu penting sebelum melakukan Type Conversion JavaScript:

Hal yang perlu Anda ingat tentang ini adalah:

1. Type data NaN adalah angka.
2. Type data array adalah objek.
3. Type data pada tanggal adalah objek.
4. Type data null adalah objek.
5. Type data dari variabel tidak terdefinisi tidak terdefinisi.
6. Type data variabel yang tidak memiliki nilai tidak ditentukan.

Berikut adalah contoh penggunaan kodenya.

typeof "Johan"                 // memberikan nilai dalam bentuk tipe data "string" 
typeof 4                      // memberikan nilai dalam bentuk tipe data "number"
typeof NaN                    // memberikan nilai dalam bentuk tipe data "number"
typeof false                  // memberikan nilai dalam bentuk tipe data "boolean"
typeof [4,3,2,1]              // memberikan nilai dalam bentuk tipe data "object"
typeof {nama:'Johan', umur:30}   // memberikan nilai dalam bentuk tipe data "object"
typeof new Date()             // memberikan nilai dalam bentuk tipe data "object"
typeof function () {}         // memberikan nilai dalam bentuk tipe data "function"
typeof phone                  // memberikan nilai dalam bentuk tipe data "undefined"
typeof null

Properti Konstruktor dalam JavaScript

Properti ini mengembalikan fungsi ‘constructor’ untuk semua variabel di JavaScript:

"Rio".constructor
(4.17).constructor   
true.constructor                 
[1,2,3,4,5].constructor        
{nama:'Rio',umur:28}.constructor     
new Date().constructor           
function () {}.constructor      

Berikut ini dapat digunakan untuk menemukan tipe objek seperti array dan date.

function isArray(myArray) {
    return myArray.constructor.toString().indexOf("Array") > -2;
}

Anda juga dapat mencoba kode berikut ini.

function isDate(date) {
    return date.constructor.toString().indexOf("Date") > -2;
}

Mengubah Tipe Data JavaScript

Variabel di JavaScript dapat diubah menjadi variabel dan jenis data yang berbeda:

1. Anda dapat mengubahnya dengan menggunakan fungsi JavaScript.
2. Anda dapat melakukannya secara otomatis, dengan JavaScript.

Pertama-tama, kami akan membahas penggunaan fungsi untuk konversi tipe. Setiap penjelasan akan diikuti dengan sebuah contoh. Pastikan untuk tidak melewatkannya, karena itu penting dalam memahami gagasan tentang cara kerja fungsi tertentu!

Mengubah Angka ke String

Mudah untuk mengubah angka menggunakan JavaScript. Pertama, ubah ke fungsionalitas string dengan metode String (). Anda dapat menggunakannya pada berbagai jenis ekspresi, literal, variabel, atau angka:

String(r)  // membawa kembali string dari variabel angka r
String(323)   // membawa kembali string dari angka literal 323
String(300 + 33)  // membawa kembali string dari angka dari ekspression

Untuk mengkonversi untuk string JavaScript harus menggunakan metode ‘toString()’ seperti pada contoh berikut ini:

r.toString()
(323).toString()
(300 + 33).toString()

Mengubah Booleans ke String

Anda dapat memodifikasi Booleans menggunakan JavaScript untuk mengubahnya ke fungsionalitas dengan menggunakan metode string().

String(false) // mengembalikan nilai "false"
String(true) // mengembalikan nilai  "true"

Sekali lagi, untuk mengonversi ke string JavaScript metode toString () mungkin berguna untuk Anda.

false.toString() // mengembalikan nilai "false"
true.toString() // mengembalikan nilai "true"

Mengubah Date ke String

Anda dapat mengubah tanggal menggunakan JavaScript, ubah ke fungsionalitas string dengan metode String ():

String(Date()) // mengembalikan nilai dari date

Penggunaan ToString() mungkin Anda akan menggunakannya dengan cara yang sama.

Date().toString() // mengembalikan nilai dari date

Mengubah String ke Angka

Saat mengubah string menjadi angka, di sini kami menggunakan metode Number (). String dengan “3.18” diubah menjadi 3.18. String yang tidak ada di dalamnya diubah menjadi 0. Yang lainnya diubah menjadi NaN:

Number("3.18")    // mengembalikan nilai menjadi angka
Number(" ")       // mengembalikan nilai menjadi 0 
Number("")        // mengembalikan nilai menjadi 0
Number("22 44")   // mengembalikan nilai menjadi NaN

Menggunakan Unnary+ Operator

Ketika mengubah variabel ke angka maka kita akan menggunakan operator Unary+:

var z = "4"; // z merupakan tipe data string
var d = + z; // d merupakan tipe data angka atau number

Variabel yang tidak dapat diubah muncul sebagai angka NaN:

var z = "Bob"; // z menjadi tipe data string
var d = + d; // d menjadi tipe data number (NaN)

Mengubah Booleans ke Angka

Untuk melakukan konversi JavaScript ke angka pada boolean, kita dapat menggunakan metode Number ():

Number(false) // nilai akan menjadi 0
Number(true) // nilai akan menjadi 1

Mengubah Date ke Angka

Ketika mengeksekusi konversi JavaScript untuk angka pada date maka kita akan menggunakan metode Number().

e = new Date();
Number(e)

Kemudian metode getTime() akan digunakan juga:

date = new Date();
date.getTime()

Perubahan Otomatis

Seperti yang kami sebutkan di atas, beberapa perubahan juga terjadi secara otomatis di JavaScript. JavaScript cenderung mengubah nilai tipe data yang sedang dikerjakannya ketika tipenya salah. Terkadang memberikan hasil yang berbeda. Lihatlah contoh berikut ini:

2 + null    // mengembalikan nilai menjadi 2 karena null berubah menjadi 0
"2" + null  // mengembalikan nilai menjadi "2null" karena null menjadi string "null"
"2" + 3     // mengembalikan nilai menjadi 23 karena 1 menjadi string "1"
"2" - 1     // mengembalikan nilai menjadi 1 karena "2" menjadi 2
"2" * "4"   // mengembalikan nilai 8 karena nilai "2" dan "4" menjadi angka 2 and 4

Saat mengeluarkan variabel atau objek, JavaScript memanggil fungsi variabel toString () secara default:

name:"Frisca"}.toString() // toString berubah menjadi "[object Object]"
[1,2,3,4,5].toString() // toString berubah menjadi "1,2,3,4,5"
new Date().toString() // toString berubah menjadi "Thu Aug 07 2017 14:54:55 GMT+0200"

Mungkin tidak terlihat jelas, tetapi boolean dan nomor juga dapat berubah:

var number = 123;
number.toString() // toString berubah menjadi "323"
true.toString() // toString berubah menjadi "true"
false.toString() // toString berubah "false"

Tabel Konversi dalam JavaScript

Pada tabel di bawah ini, kita bisa melihat perubahan boolean, string, dan angka. Cobalah untuk menghindari string JavaScript menjadi konversi boolean sebagai pemula, karena mudah untuk mengacaukan dan membuat bug sebagai hasilnya.

Itulah penjelasan tentang JavaScript Type Conversion. Tabel yang kami sajikan sebelumnya akan sangat memudahkan Anda untuk memastikan Anda tidak melakukan kesalahan saat melakukan konversi tipe data JavaScript.  Jika Anda tertarik untuk belajar tentang JavaScript, Anda dapat membaca dan melihat artikel-artikel seri tutorial JavaScript yang telah kami sajikan lengkap di situs codekey.

Situs codekey juga menyediakan berbagai tutorial, materi, pembahasan, tips, dan trik untuk Anda belajar bahasa pemrograman populer lainnya seperti Python dan Java. Jangan lupa untuk dapatkan update terbaru seputar coding dan Bahasa pemograman lainnya dari situs Codekey.