Add Parameter To Url Javascript

3 min read Jun 22, 2024
Add Parameter To Url Javascript

Menambahkan Parameter ke URL dalam JavaScript

Parameter URL adalah informasi tambahan yang ditambahkan ke akhir URL untuk menentukan tindakan atau data spesifik yang diminta. Parameter dipisahkan dengan tanda tanya (?) dan terdiri dari pasangan kunci-nilai yang dipisahkan oleh tanda sama dengan (=). Misalnya, https://www.example.com/search?q=javascript&page=2 memiliki parameter q dengan nilai javascript dan parameter page dengan nilai 2.

Cara Menambahkan Parameter ke URL dalam JavaScript

Ada beberapa cara untuk menambahkan parameter ke URL dalam JavaScript:

1. Menggunakan URLSearchParams

URLSearchParams adalah objek yang disediakan oleh browser untuk bekerja dengan parameter URL. Anda dapat membuatnya dengan menggunakan konstruktor URLSearchParams atau dengan mengambil parameter dari URL yang ada.

// Membuat URLSearchParams baru
const params = new URLSearchParams();
params.append('name', 'John Doe');
params.append('age', 30);

// Membuat URL dengan parameter
const url = new URL('https://www.example.com/profile');
url.search = params.toString();

console.log(url.toString()); // Output: https://www.example.com/profile?name=John%20Doe&age=30

2. Menggunakan String Manipulation

Anda dapat menambahkan parameter ke URL dengan memanipulasi string secara manual. Gunakan operator + atau += untuk menggabungkan URL dengan string parameter.

// Menambahkan parameter ke URL
let url = 'https://www.example.com/search';
url += '?q=javascript';
url += '&page=2';

console.log(url); // Output: https://www.example.com/search?q=javascript&page=2

3. Menggunakan Library Eksternal

Ada beberapa library eksternal seperti qs yang dapat membantu dalam bekerja dengan parameter URL. Library ini menyediakan fungsi yang lebih mudah dan terstruktur untuk membuat, memanipulasi, dan parsing parameter URL.

// Menggunakan library qs
const qs = require('qs');

const params = {
  name: 'John Doe',
  age: 30,
};

const url = 'https://www.example.com/profile';
const urlWithParams = url + '?' + qs.stringify(params);

console.log(urlWithParams); // Output: https://www.example.com/profile?name=John%20Doe&age=30

Kesimpulan

Menambahkan parameter ke URL dalam JavaScript sangat berguna untuk mengirimkan data tambahan ke server atau untuk mengontrol perilaku halaman web. Anda dapat memilih metode yang paling sesuai dengan kebutuhan Anda. Pastikan untuk menggunakan encoding URL yang tepat untuk karakter khusus dalam nilai parameter.

Latest Posts