Senin, 17 April 2017

Manipulasi String Pada Javascript

Tidak ada komentar


Manipulasi String Javascript.

     Manipulasi string javascript adalah pengolahan tipe data string yang bissa di lakukan dengan javascript. Javascript sendiri telah menyediakan beberapa function yang dapat kita gunakan untuk memanipulasi tipe data string. Adapun beberapa function Javascript yang bisa kita gunakan untuk memanipulasi string adalah indexOf(), lastindexOf(), search(), slice(), substring(), substr(0, replace(), toUpperCase(), toLowerCase(), concat(), split() dan lainnya.

Contoh manipulasi string Dengan Javascript

Berikut ini adalah beberapa function javascript untuk memanipulasi string dengan penjelasan dan kegunaannya masing-masing.

Nama FungsiKegunaan
lengthmenghitung jumlah karakter pada string
indexOf()menemukan letak string dalam sebuah string (di urutan ke berapa)
LastindexOf()menemukan letak string dalam sebuah string (di urutan ke berapa) di hitung dari akhir
search()mencari string di dalam string
slice()Menampilkan string dari karakter ke berapa sampai yang ke berapa
substring()Menampilkan string dari karakter ke berapa sampai yang ke berapa (sama seperti slice())
substr()Menampilkan string dari karakter ke berapa sampai yang ke berapa (sama seperti slice())
replace()Mengganti string
toUpperCase()mengganti string ke huruf besar semua
toLowerCase()mengganti string ke huruf kecil semua
concat()Menggabungkan String
split()Mengubah string menjadi array

Menghitung jumlah karakter pada string dengan length

Ini adalah contoh cara menghitung jumlah karakter pada sebuah string dengan menggunakan javascript.
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>
var kalimat = "saya belajar javascript ";
document.getElementById("contoh").innerHTML = kalimat.length;
</script>
</body>
</html>
Di sini kita buat sebauah variabel "kalimat" yang menyimpan sebuah string "saya belajar javascript". lalu kita hitung jumlah karakter dari string tersebut dengan legth.
document.getElementById("contoh").innerHTML = kalimat.length;
dan hasilnya adalah





Menemukan Letak String yang di cari dengan indexOf() dan LastindexOf().

Untuk menemukan letak dari string yang di cari kita bisa menggunakan fungsi yang sudah di sediakan oleh javascript. Yaitu indexOf() menjadi LastindexOf() jika ingin menghitung urutannya dari akhir. Contoh

<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>

    var kalimat = "Selamat datang di tutorial string javascript";
    var temukan = kalimat.indexOf("tutorial");
    document.getElementById("contoh").innerHTML = temukan;

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




Dan bisa di coba sendiri dengan mengganti indexOf() menjadi LastindexOf() cara penulisannya sama saja.

Mencari String dengan search()

cara mencari string di dalam string kita bisa menggunakan fungsi search(). Contohnya.
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>
    var kalimat = "belajar javascript";
    var cari = kalimat.search("javascript");
    document.getElementById("contoh").innerHTML = cari;
</script>
</body>
</html>
Hasil



filter string denagan slice()

ada 2 parameter yang harus di isi pada fungsi slice(). yang pertama isikan dari urutan ke berapa filter di mulai. Dan parameter kedua sampai urutan ke berapa batas filternya.
slice(mulai, batas akhir)
contoh
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>
    var kalimat = "belajar javascript di SEKOLAH";  
    var filter = kalimat.slice(22, 42);
    document.getElementById("contoh").innerHTML = filter;
</script>
</body>
</html>
 Dan hasilnya adalah 'SEKOLAH' karena kita memerintahkan untuk menampilakan karakter ke 22 sampai 42 seperti yang dapat kita lihat pada contoh di atas
 kalimat.slice(22, 42);
hasil



Penggunaan substring() dan substr() juga sama.

Cara pengguanaan fungsi replice().

Cara pengguanaan fungsi replice() adalah sebagai berikut
replace('yang ingin di ganti','ganti nya')
Jadi parameter pertama, kita  masukkan misalnya kata yang ingin kita ganti. dan pada parameter ke dua kita masukkan kata yang akan menggantinya
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>
    var kalimat = "belajar javascript di sekolah";  
        var ganti = kalimat.replace('javascript', 'pemrograman');
    document.getElementById("contoh").innerHTML = ganti;
</script>
</body>
</html>
maka yang awalnya belajar isi variabel adalah  "belajar javascript di sekolah", maka akan berubah menjadi "belajar pemrograman di sekolah"
karena disini kita mengubah kata javascript menjadi pemrograman dengan menggunakan fungsi replice di javascript.




Huruf besar kecil dengan toUpperCase() untuk mengubah string menjadi huruf besar atau huruf kapital. dan toLowerCase() mengubah untuk mengubah menjadi huruf kecil semau.
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="besar"></p>
<p id="kecil"></p>

<script>
    var kalimat = "Belajar JAVASCRIPT di sekolah";  
       
      // mengubah ke huruf besar
      var a = kalimat.toUpperCase();
 
   // mengubah ke huruf kecil
      var b = kalimat.toLowerCase();
 
    document.getElementById("besar").innerHTML = a;
      document.getElementById("kecil").innerHTML = b;
</script>
</body>
</html>
 hasilnya



menggabungkan  String dengan concat()

untuk contoh ini kita menggabungkan 2 string. sebagai pengganti "+" sebagai penggabung string.
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>
    var a = "Amirul";   
      var b = "muttaqin";  
         
   // menggabungkan string
      var gabung = a.concat(" ",b); 
    document.getElementById("contoh").innerHTML = gabung;
</script>
</body>
</html>
 Pada penggunaan concat() javascript ini, kita membuat sebuah variabel a yang berisi amirul . dan variabel b berisi muttaqin, sebenarnya saat di tampilkan bisa saja degan cara a+""+b. tpi degan javascript bisa lebih mudah yaitu menggunakan fungsi concat. yang hasilnya akan menjadi "amirul mutaqin"




Convert string ke array dengan split()
<!DOCTYPE html>
<html>
<head>
    <title>Belajar Javascript </title>
</head>
<body>
<h2>Manipulasi String Javascript</h2>

<p id="contoh"></p>

<script>
    var huruf = "a,b,c";   
 
   // string jadi array
    var convert = huruf.split(","); 
    document.getElementById("contoh").innerHTML = convert[0];
</script>
</body>
</html>
Pada contoh ini, kita membuat sebuah variabel bernama huruf. dan berisi 'a,b,c'. Kemudian kita pecahkan string ini menjadi array dengan split(). dan menetapkan tanda ',' sebagai pemisah.
 var convert = huruf.split(",");
maka yang akan di eksekusi adalah array yang tersimpan dalam variabel convert. dan akan menampilkan array urutan pertama.
document.getElementById("contoh").innerHTML = convert[0];
 hasil



Referensi : www.malasngoding.com

Tidak ada komentar :

Posting Komentar