Cara menggunakan menghilangkan karakter di javascript

Untuk menghilangkan karakter kosong<spasi> pada inputan text di HTML kita dapat menggunakan javascript. Script yang digunakan adalah sebagai berikut :

  <script language="javascript" type="text/javascript">
		function hilang_spasi(string) {
 			return string.split(' ').join('');
		}
</script>

Untuk penggunaanya di HTML seperti skrip di bawah ini :

<input type="text" 
id="data" 
onblur="this.value=hilang_spasi(document.GetElementById('data').value);" 
 >

Semoga Bermanfaat !!!

Method String dapat membantu kita dalam memanipulasi data string, kita tidak perlu membuat fungsi untuk memanipulasi string secara manual.

JavaScript sudah menyediakan banyak method yang bisa kita gunakan secara langsung.

Misalnya, jika kita ingin mengganti kata tertentu di dalam string, kita bisa menggunakan method replace().

Untuk mengubah string menjadi huruf besar semua, bisa menggunakan method toUpperCase().

Atau sebalik, mengubah string menjadi huruf kesil semua, bisa menggunakan toLowerCase().

Berikut daftar materi yang akan kita bahas terkait method String.

1. Apa Itu Method String
2. Daftar Method String
   1. length - Hitung Panjang String
   2. toUpperCase() - Ubah String ke Huruf Besar
   3. toLowerCase() - Ubah String ke Huruf Kecil
   4. startsWith() - Apakah String Diawali dengan Karakter Tertentu
   5. endsWith() - Apakah String Diakhiri dengan Karakter Tertentu
   6. includes() - Apakah String Berisi Karakter Tertentu
   7. slice() - Ekstrak String
   8. split() - Pecah String dan Ubah Menjadi Array
   9. substring() - Ambil Bagian String
   10. indexOf() - Cari Index Kemunculan Pertama dari Karakter Tertentu
   11. lastIndexOf() - Cari Index Kemunculan Terakhir dari Karakter Tertentu
   12. trim() - Hapus Spasi di Awal dan Akhir String
   13. trimStart() - Hapus Spasi di Awal String
   14. trimEnd() - Hapus Spasi di Akhir String
   15. repeat() - Ulang String
   16. replace() - Ganti Karakter Tertentu Sesuai yang Ditentukan
   17. replaceAll() - Ganti Semua Karakter Tertentu Sesuai yang Ditentukan

Apa Itu Method String?

Sesuai namanya, method String adalah fungsi atau method yang ada di dalam objek String.

Nilai string primitif seperti "reza" tidak memiliki properti dan method karena bukan objek.

Tapi di JavaScript, methode yang ada di dalam string non-primitif (new String()) juga dapat digunakan untuk string primitif, ini juga berlaku untuk Boolean dan Number.

Sama seperti objek yang sudah kita bahas sebelumnya, kita bisa mengakses properti dan method menggunakan notasi titik.

string.properti

Contoh:

const nama = 'reza';
nama.toUpperCase(); // REZA

// atau

'reza'.toUpperCase(); // REZA

Jadi jangan bingung, jika kita tiba-tiba bisa mengakses properti dan method, itu semua ada di dalam objek String.

Semua method dan properti mengembalikan nilai baru tidak mengubah string asli atau string sumber yang dimanipulasi, karena di sini kita akan memanipulasi string primitif yang dibuat dengan sintaks literal.

Daftar Method String

Sebetulnya ada banyak method String yang bisa kita gunakan, namun di sini kita mempelajari method yang paling sering digunakan saja.

length - Hitung Panjang String

length sebetulnya bukanlah method, melainkan properti. Oleh karena itu kita tidak perlu menggunakan tanda kurung lengkung ().

length mengembalikan tipe data angka panjang string.

Contoh

const str = 'reza';
console.log(str.length); // 4

toUpperCase() - Ubah String ke Huruf Besar

toUpperCase() mengembalikan string yang dikonversi ke huruf besar.

Contoh

const str = 'reza';
console.log(str.toUpperCase()); // REZA

toLowerCase() - Ubah String ke Huruf Kecil

toLowerCase() mengembalikan string yang dikonversi ke huruf kecil.

const str = 'Reza';
console.log(str.toLowerCase()); // reza

startsWith() - Apakah String Diawali dengan Karakter Tertentu

startsWith() mengecek apakah string diawali dengan karakter yang ditentukan dalam parameter.

Sintaks

startsWith(karakterDicari, posisi);

Parameter

• karakterDicari: karakter yang akan dicari di awal string, peka huruf besar/kecil.
• posisi (opsional): posisi/index awal pencarian, default 0.

Perlu diketahui, karakter pertama string memiliki posisi atau indeks0.

Nilai Kembalian

true jika karakter yang dicari ditemukan di awal string, false jika tidak.

Contoh

const str = 'reza';

console.log(str.startsWith('re')); // true
console.log(str.startsWith('Re')); // false
console.log(str.startsWith('za', 2)); // true
console.log(str.startsWith('za', 3)); // false

endsWith() - Apakah String Diakhiri dengan Karakter Tertentu

endsWith() mengecek apakah string diakhiri dengan karakter yang ditentukan dalam parameter.

Jika ditentukan paremeter kedua (panjang), string akan dipotong sesuai dengan panjang yang ditentukan, string itulah yang kemudian diperiksa apakah diakhiri karakter yang ditentukan atau tidak.

Perlu diperhatikan, panjang/length dimluai dari 1 sedangkan indeks dimulai dari 0.

Sintaks

endsWith(karakterDicari, panjang);

Parameter

• karakterDicari: karakter yang dicari di akhir string, peka huruf besar/kecil.
• panjang (opsional): panjang string, default-nya panjang string sumber (str.length).

Nilai Kembalian

true jika karakter yang dicari ditemukan di akhir string, false jika tidak.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.endsWith('pt')); // true
console.log(str.endsWith('dang', 11)); // true :: 11 - saya se(dang)

includes() - Apakah String Berisi Karakter Tertentu

includes() melakukan pencarian (peka huruf besar/kecil) apakah string berisi atau mengandung karakter yang ditentukan.

Sintaks

includes(karakterDicari, posisi);

Parameter

• karakterDicari: string atau karakter yang dicari.
• posisi (opsional): posisi/index untuk memulai pencarian, default 0.

Nilai Kembalian

true jika karakter ditemukan di mana saja di dalam string, false jika tidak.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.includes('belajar')); // true
console.log(str.includes('saya', 5)); // false
console.log(str.includes('sedang', 5)); // true

slice() - Ekstrak String

slice() melakukan pemotongan atau mengekstrak bagian tertentu pada string mulai dari indeks awal hingga akhir sesuai dengan yang ditentukan.

Karakter yang berada tepat di indeks awal tidak akan diambil, yang diambil adalah karakter selanjutnya.

Jika indeks akhir tidak ditentukan, dipotong hingga akhir string.

Sintaks

slice(indeksAwal, indeksAkhir);

Parameter

• indeksAwal: indeks awal pemotongan.
• indeksAkhir (opsional): indeks akhir pemotongan, default 0.

Nilai Kembalian

Mengembalikan string hasil pemotongan.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.slice(5, 11)); // sedang
console.log(str.slice(5)); // sedang belajar javascript

split() - Pecah String dan Ubah Menjadi Array

split() memecah string menjadi beberapa bagian sesuai separator yang ditentukan, string yang telah dibagi akan dimasukkan ke dalam array.

Separator akan dihapus, tidak ikut dimasukkan ke dalam array.

Jika separator tidak ditentukan, string akan dimasukkan ke dalam array tanpa pembagian.

Dengan kata lain array yang dikembalikan hanya punya satu elemen yang berisi string tersebut.

Sintaks

split(separator, limit);

Parameter

• separator: pola yang menjadi pemisah string, bisa berupa string sederhana atau ekspresi reguler (regex).
• limit (opsional): bilangan bulat positif untuk membatasi jumlah elemen array.

Nilai Kembalian

Mengembalikan array yang berisi elemen string hasil pembagian sesuai separator.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.split()); // ["saya sedang belajar javascript"]
console.log(str.split(' ')); // ["saya", "sedang", "belajar", "javascript"]
console.log(str.split(' ', 2)); //  ["saya", "sedang"]

substring() - Ambil Bagian String

Mirip seperti slice(), substring() mengambil bagian dari string sesuai dengan indeks awal dan akhir yang ditentukan.

Karakter yang berada tepat di indeks awal ikut diambil, sedangkan karakter di indeks akhir tidak diambil.

Sintaks

substring(indeksAwal, indeksAkhir);

Parameter

• indeksAwal: indeks dari karakter pertama yang ingin diambil.
• indeksAkhir (opsional): indeks karakter akhir yang ingin dikecualikan dari string yang dikembalikan.

Nilai Kembalian

Mengembalikan string yang berisi bagian tertentu dari string sumber.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.substring(1, 3)); // ay
console.log(str.substring(5)); // sedang belajar javascript

indexOf() - Cari Index Kemunculan Pertama dari Karakter Tertentu

indexOf() mencari indeks dari karakter tertentu di dalam string. Jika string yang dicari lebih dari satu karakter, yang dikembalikan adalah indeks karakter pertama.

Jika karakter muncul lebih dari sekali dalam string, karakter pertama digunakan.

Sintaks

indexOf(karakterDicari, indexMulaiPencarian);

Parameter

• karakterDicari: karakter yang dicari.
• indexMulaiPencarian (opsional): bilangan bulat yang mewakili indeks untuk memulai pencarian, default 0.

Nilai Kembalian

Indeks kemunculan pertama karakterDicari, atau -1 jika tidak ditemukan.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.indexOf('a')); // 1 :: s(a)ya ...
console.log(str.indexOf('ja')); // 16 :: ... bela(ja)r javascript

lastIndexOf() - Cari Index Kemunculan Terakhir dari Karakter Tertentu

lastIndexOf() mencari indeks dari kemunculan terakhir karakter tertentu di dalam string. Jika string yang dicari lebih dari satu karakter, yang dikembalikan adalah indeks karakter pertama.

Jika karakter muncul lebih dari sekali dalam string, karakter terakhir digunakan.

Sintaks

lastIndexOf(karakterDicari, indexAkhirPencarian);

Parameter

• karakterDicari: karakter yang dicari.
• indexAkhirPencarian (opsional): bilangan bulat yang mewakili indeks akhir pencarian, default Infinity.

Nilai Kembalian

Indeks kemunculan terakhir karakterDicari, atau -1 jika tidak ditemukan.

Contoh

const str = 'saya sedang belajar javascript';

console.log(str.lastIndexOf('a')); // 23 :: ... belajar jav(a)script
console.log(str.lastIndexOf('ja')); // 20 :: ... belajar (ja)vascript
console.log(str.lastIndexOf('ja', 19)); // 16 :: ... bela(ja)r javascript

trim() - Hapus Spasi di Awal dan Akhir String

trim() menghapus spasi (white space) di awal dan akhir string termasuk spasi, tab, dan sebagainya, serta karakter terminator baris seperti CR dan LF.

Sintaks

trim();

Nilai Kembalian

Mengembalikan string sesuai sumber tanpa spasi di awal dan akhir.

Contoh

const str = '     reza      ';

console.log(str.trim()); // "reza"

trimStart() - Hapus Spasi di Awal String

trimStart() menghapus spasi (white space) di awal string termasuk spasi, tab, dan sebagainya, serta karakter terminator baris seperti CR dan LF.

Sintaks

trimStart();

Nilai Kembalian

Mengembalikan string sesuai sumber tanpa spasi di awal.

Contoh

const str = '     reza      ';

console.log(str.trimStart()); // "reza     "

trimEnd() - Hapus Spasi di Akhir String

trimEnd() menghapus spasi (white space) di akhir string termasuk spasi, tab dan sebagainya, serta karakter terminator baris seperti CR dan LF.

Sintaks

trimEnd();

Nilai Kembalian

Mengembalikan string sesuai sumber tanpa spasi di akhir.

Contoh

const str = '     reza      ';

console.log(str.trimEnd()); // "     reza"

repeat() - Ulang String

repeat() mengembalikan string sumber yang diulang sesuai dengan jumlah pengulangan yang ditentukan.

Sintaks

repeat(jumlahPengulangan);

Parameter

• jumlahPengulangan: bilangan bulat positif yang medeskripsikan jumlah pengulangan string.

Nilai Kembalian

Mengembalikan string sumber yang diulang sesuai dengan jumlah pengulangan (jumlahPengulangan) yang ditentukan.

Contoh

const str = 'hello ';

console.log(str.repeat(5)); // hello hello hello hello hello

replace() - Ganti Karakter Tertentu Sesuai yang Ditentukan

replace() mengganti karakter tertentu di dalam string sesuai dengan karakter yang ditentukan.

Jika karakter yang ingin diganti muncul lebih dari sekali di dalam string, hanya yang pertama yang diganti.

Sintaks

replace(target, pengganti);

Parameter

• target: string atau karakter tertentu yang ingin diganti, bisa berupa string sederhana atau ekspresi reguler (regex).
• pengganti: pengganti karakter yang diganti, bisa berupa string sederhana atau fungsi.

Nilai Kembalian

Mengembalikan string baru dengan beberapa karakter yang telah diganti sesuai dengan yang ditentukan.

Contoh

const str = 'aku sedang belajar javascript';
console.log(str.replace('aku', 'saya')); // saya sedang belajar javascript

replaceAll() - Ganti Semua Karakter Tertentu Sesuai yang Ditentukan

replaceAll() mengganti semua karakter tertentu di dalam string sesuai dengan karakter yang ditentukan.

Jika karakter yang ingin diganti muncul lebih dari sekali di dalam string, semuanya diganti.

Sintaks

replaceAll(target, pengganti);

Parameter

• target: string atau karakter tertentu yang ingin diganti, bisa berupa string sederhana atau ekspresi reguler (regex).
• pengganti: pengganti karakter yang diganti, bisa berupa string sederhana atau fungsi.

Nilai Kembalian

Mengembalikan string baru dengan beberapa karakter yang telah diganti sesuai dengan yang ditentukan.

Contoh

const str = 'saya belajar javascript dan saya bersemangat';

console.log(str.replaceAll('aku', 'saya')); // saya belajar javascript dan saya bersemangat