logo logo

Portal media terdepan yang menyajikan informasi terkini seputar dunia teknologi, gadget, dan inovasi digital di Indonesia.

Sentral Media

Langganan Update Teknologi

Dapatkan rangkuman berita mingguan langsung ke email Anda.

Daftar Newsletter

Surabaya, Indonesia

Kota Surabaya, Jawa Timur

Email: redaksi@sentralmediateknologi.id

Frontend & Ui/Ux

String Methods: length, toUpperCase, substring, split, replace.

Dalam pengembangan web, data string (teks) adalah salah satu tipe data yang paling sering kita olah. Baik itu memformat nama pengguna, memotong ringkasan artikel, hingga mengubah format data dari API. JavaScript menyediakan berbagai built-in methods yang sangat kuat untuk mempermudah pekerjaan ini. Artikel ini akan membahas 5 String Methods paling esensial: length, toUpperCase, substring, split, dan replace.

avatar
Super Administrator

SentralMediaTeknologi.id


  • 14 Mei 2026
  • 00:17 WIB

 

Dalam pengembangan web, data string (teks) adalah salah satu tipe data yang paling sering kita olah. Baik itu memformat nama pengguna, memotong ringkasan artikel, hingga mengubah format data dari API. JavaScript menyediakan berbagai built-in methods yang sangat kuat untuk mempermudah pekerjaan ini.

Artikel ini akan membahas 5 String Methods paling esensial: length, toUpperCase, substring, split, dan replace.


1. String.length: Mengukur Panjang Teks

length sebenarnya adalah sebuah properti, bukan fungsi (method). Ia digunakan untuk menghitung jumlah karakter dalam sebuah string, termasuk spasi dan karakter khusus.

  • Kegunaan: Validasi panjang password, membatasi karakter pada input, atau pengecekan data kosong.

JavaScript
const pesan = "Halo Dunia";
console.log(pesan.length); // Output: 10

2. toUpperCase() & toLowerCase()

Method ini digunakan untuk mengubah seluruh karakter dalam string menjadi huruf kapital atau huruf kecil.

  • Kegunaan: Menyamakan format data (misalnya email) sebelum disimpan ke database agar konsisten.

JavaScript
const username = "BudiSantoso";
console.log(username.toUpperCase()); // Output: "BUDISANTOSO"
console.log(username.toLowerCase()); // Output: "budisantoso"

3. substring(start, end)

substring digunakan untuk mengambil sebagian karakter dari string berdasarkan indeks tertentu.

  • start: Indeks awal (inklusif).

  • end: Indeks akhir (eksklusif/tidak termasuk karakter di indeks tersebut).

  • Kegunaan: Membuat "Read More" pada artikel atau mengambil kode tertentu dari sebuah serial number.

JavaScript
const teks = "Belajar JavaScript";
const hasil = teks.substring(0, 7); console.log(hasil); // Output: "Belajar"

4. split(separator)

split adalah method yang sangat sakti. Ia memecah sebuah string menjadi sebuah Array berdasarkan karakter pemisah (separator) yang ditentukan.

  • Kegunaan: Mengubah kalimat menjadi daftar kata, atau mengolah data CSV sederhana.

JavaScript
const hobi = "Coding, Reading, Gaming";
const arrayHobi = hobi.split(", "); console.log(arrayHobi); // Output: ["Coding", "Reading", "Gaming"]
console.log(arrayHobi[0]); // Output: "Coding"

5. replace(search, replacement)

Method ini digunakan untuk mencari karakter atau pola tertentu dalam string dan menggantinya dengan karakter baru.

  • Kegunaan: Sensor kata kasar, mengubah format tanggal, atau memperbaiki typo secara otomatis.

JavaScript
const kalimat = "Saya suka makan apel";
const kalimatBaru = kalimat.replace("apel", "jeruk"); console.log(kalimatBaru); // Output: "Saya suka makan jeruk"

Catatan: Secara default, .replace() hanya mengganti kata pertama yang ditemukan. Jika ingin mengganti semua kata yang sama, gunakan .replaceAll().


Tabel Ringkasan String Methods

Method Fungsi Utama Hasil (Return Value)
length Menghitung jumlah karakter Number
toUpperCase Mengubah ke huruf kapital String Baru
substring Mengambil potongan teks String Baru
split Memecah teks menjadi daftar Array
replace Mengganti teks tertentu String Baru

Tutorial Praktis: Memformat Nama User

Mari kita gabungkan beberapa method di atas untuk merapikan input user yang berantakan.

JavaScript
function formatNama(input) { // 1. Ambil 10 karakter pertama saja (substring) let namaCek = input.substring(0, 10); // 2. Ubah semua jadi huruf besar (toUpperCase) return namaCek.toUpperCase();
} const inputUser = "RianPermanaPutra";
console.log(formatNama(inputUser)); // Output: "RIANPERMAN"

Kesimpulan

Menguasai manipulasi string adalah fondasi penting bagi setiap developer. Dengan memahami length, toUpperCase, substring, split, dan replace, Anda sudah memiliki alat yang cukup untuk menangani sebagian besar kasus pengolahan teks di sisi frontend maupun backend.

Stories

avatar

Jurnalis dan analis internasional, mengurai dinamika geopolitik, ekonomi global, dan konflik dunia dengan ketajaman dan kedalaman.


Bagikan artikel ini

Stay Connected