Pelajari objek JSON JavaScript lengkap seperti akses property, looping JSON, nested object, update data, dan hapus property.
Objek JSON JavaScript Lengkap untuk Pemula
Pembukaan
JSON (JavaScript Object Notation) adalah format data ringan yang digunakan untuk pertukaran data antara:
Server
API
Database
Website
Aplikasi realtime
JSON sangat penting dalam pengembangan modern karena digunakan untuk:
Monitoring CCTV
Analytic camera system
Dashboard server
Data jaringan
API realtime
Dalam sistem profesional seperti Haikal IT Support, JSON digunakan untuk komunikasi data analytic camera, monitoring server, dan management network.
Berikut penjelasan lengkap objek JSON JavaScript.
1. Mengakses Properti Menggunakan .property
Gunakan titik (.) untuk membaca property JSON.
Contoh Kode
let server = {
"nama": "Server CCTV",
"status": "Online"
};
console.log(server.nama);
Hasil Demo
Server CCTV
Penjelasan
server.namaMengambil property
nama.
2. Mengakses Properti Menggunakan [property]
Property JSON juga dapat diakses menggunakan bracket.
Contoh Kode
let camera = {
"nama": "CCTV Lobby",
"status": "Aktif"
};
console.log(camera["status"]);
Hasil Demo
Aktif
Penjelasan
Cocok untuk property dinamis.
3. Mengulangi Properti JSON
Gunakan for...in.
Contoh Kode
let server = {
"nama": "Server Monitoring",
"ip": "192.168.1.1",
"status": "Online"
};
for(let data in server) {
console.log(data);
}
Hasil Demo
nama
ip
status
Penjelasan
for...inmembaca semua property JSON.
4. Mengulangi Nilai Properti JSON
Contoh Kode
let server = {
"nama": "Server Monitoring",
"status": "Online"
};
for(let data in server) {
console.log(server[data]);
}
Hasil Demo
Server Monitoring
Online
Penjelasan
Mengambil semua value JSON.
5. Akses Objek JSON yang Disarangkan
JSON dapat memiliki object di dalam object.
Contoh Kode
let camera = {
"nama": "CCTV 1",
"network": {
"ip": "192.168.1.10",
"status": "Online"
}
};
console.log(camera.network.ip);
Hasil Demo
192.168.1.10
Penjelasan
networkadalah nested object.
6. Ubah Nilai Menggunakan Notasi Titik
Contoh Kode
let server = {
"status": "Offline"
};
server.status = "Online";
console.log(server.status);
Hasil Demo
Online
Penjelasan
Property dapat diubah kapan saja.
7. Ubah Nilai Menggunakan Notasi Braket
Contoh Kode
let camera = {
"status": "Offline"
};
camera["status"] = "Aktif";
console.log(camera["status"]);
Hasil Demo
Aktif
Penjelasan
Bracket cocok untuk property dinamis.
8. Hapus Properti Objek JSON
Gunakan delete.
Contoh Kode
let server = {
"nama": "Server CCTV",
"status": "Online"
};
delete server.status;
console.log(server);
Hasil Demo
{
nama:"Server CCTV"
}
Penjelasan
Property
statusberhasil dihapus.
Menampilkan JSON di HTML
Contoh Kode
<!DOCTYPE html>
<html>
<body>
<h2 id="demo"></h2>
<script>
let camera = {
"nama": "Analytic Camera",
"status": "Online"
};
document.getElementById("demo").innerHTML =
camera.nama;
</script>
</body>
</html>
Hasil Demo
Analytic Camera
Penyebab Error JSON JavaScript
Beberapa kesalahan umum:
Kurang tanda kutip
Salah property
Nested object salah akses
Salah penggunaan bracket
Cara Mengatasi Error JSON
1. Pastikan Format JSON Benar
Salah:
{
nama: Server
}
Benar:
{
"nama": "Server"
}
2. Pastikan Property Ada
Salah:
camera.network.address
Benar:
camera.network.ip
3. Gunakan for...in
Contoh Kode
for(let x in server) {
console.log(x);
}
Hasil Demo
nama
status
Contoh Kasus
Kasus:
Dashboard monitoring CCTV menerima data JSON dari API camera.
Contoh Kode
let camera = {
"nama": "CCTV Lobby",
"analytic": {
"motion": true
}
};
console.log(camera.analytic.motion);
Hasil Demo
true
Tips Tambahan
Gunakan JSON untuk API modern.
Gunakan nested object untuk data kompleks.
Gunakan
deletedengan hati-hati.Gunakan
for...inuntuk membaca JSON dinamis.
Internal Link
Artikel terkait di Haikal IT Support:
Objek JavaScript
Properti Objek JavaScript
Array JavaScript
Fungsi JavaScript
Dasar JavaScript
Kesimpulan
Objek JSON JavaScript digunakan untuk menyimpan dan mengelola data terstruktur dalam aplikasi modern. JavaScript menyediakan berbagai cara untuk mengakses, mengubah, menghapus, dan membaca property JSON.
Pemahaman JSON sangat penting dalam pengembangan dashboard monitoring CCTV, analytic camera system, server management, dan network system profesional di Haikal IT Support.
