Cara menggunakan OBJEKTS dalam JavaScript

Question

Seperti yang kita ketahui dari bab Tipe Data, ada delapan tipe data dalam JavaScript. Beberapa di antaranya disebut "primitif", karena nilainya hanya berisi satu hal (baik string atau angka atau apa pun)

Table of Contents Show

Apa itu objek dalam javascript?
Apa itu array dan objek dalam javascript?
Bagaimana cara menulis fungsi dalam javascript *?
Apa itu javascript onclick?

Sebaliknya, objek digunakan untuk menyimpan koleksi terkunci dari berbagai data dan entitas kompleks lainnya. Dalam JavaScript, objek menembus hampir setiap aspek bahasa. Jadi kita harus memahaminya terlebih dahulu sebelum masuk lebih dalam

Setiap objek dapat dibuat dengan tanda kurung

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

9 dengan daftar properti opsional. Properti adalah sepasang “kunci. nilai", di mana

user.isAdmin = true;

0 string (juga disebut "nama properti"), dan

user.isAdmin = true;

1 dapat berupa apa saja

Kita bisa membayangkan objek tersebut sebagai lemari dengan file yang ditandai. Setiap potongan data disimpan dalam filenya dengan kuncinya. Mencari file dengan mudah berdasarkan nama atau menambah/menghapus file

Objek kosong ("kabinet kosong") dapat dibuat menggunakan salah satu dari dua sintaks

let user = new Object(); // syntax "konstruktor objek"
let user = {};  // syntax "literal objek"

Biasanya, tanda kurung

user.isAdmin = true;

_2 digunakan. Deklarasi itu disebut literal objek

Kami dapat langsung memasukkan beberapa properti ke

user.isAdmin = true;

_2 sebagai pasangan "kunci". nilai"

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_

Properti memiliki kunci (juga disebut "nama" atau "pengidentifikasi") sebelum tanda titik dua

user.isAdmin = true;

4 dan nilai di sebelah kanan

Di objek

user.isAdmin = true;

_5, ada dua properti

Properti pertama memiliki nama
```
user.isAdmin = true;
```
_6 dan nilai
```
user.isAdmin = true;
```
7

Yang kedua memiliki nama

user.isAdmin = true;

_8 dan nilai

user.isAdmin = true;

9

Hasil objek

user.isAdmin = true;

5 dapat dibayangkan sebagai lemari dengan dua file yang ditandai dengan label "nama" dan "umur"

Kami dapat menambah, menghapus, dan membaca file darinya kapan saja

Nilai properti dapat diakses menggunakan notasi titik

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

Nilainya bisa tipe apa saja. Mari tambahkan nilai boolean

user.isAdmin = true;

_

Untuk menghapus properti, kita dapat menggunakan operator

delete user.age;

1

delete user.age;

Kami juga dapat menggunakan nama properti multi-kata, tetapi harus dikutip

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

Properti terakhir dalam daftar dapat diakhiri dengan koma

let user = {
  name: "John",
  age: 30,
}

Itu disebut koma "ekor" atau "menggantung". Memudahkan kita untuk menambah/menghapus/memindahkan properti, karena semuanya sekarang akan serupa

Untuk properti multi-kata, akses dot tidak berfungsi

// ini akan memberi galat syntax
user.likes birds = true

Javascript tidak akan mengerti itu dan akan mengira kita sedang mencoba mengakses

delete user.age;

2, kemudian akan memberikan kesalahan sintaks ketika sampai ke bagian yang tidak terduga

delete user.age;

3

Titik membutuhkan kunci untuk menjadi pengidentifikasi yang valid. Arti. tidak ada spasi, tidak dimulai dengan angka dan tidak mengandung karakter khusus (

delete user.age;

4 dan

delete user.age;

5 diperbolehkan)

Ada alternatif "notasi braket kotak" yang berfungsi dengan string apa pun

let user = {};

// set
user["likes birds"] = true;

// get
alert(user["likes birds"]); // true

// delete
delete user["likes birds"];

Sekarang semuanya baik-baik saja. Harap perhatikan bahwa string dalam tanda kurung dikutip dengan benar (dapat berupa semua jenis kutipan)

Kurung kotak juga menyediakan cara untuk mendapatkan nama properti sebagai hasil ekspresi - berlawanan dengan string literal - seperti dari variabel berikut

let key = "likes birds";

// sama dengan user["likes birds"] = true;
user[key] = true;

Di sini, variabel

user.isAdmin = true;

0 dapat dihitung pada saat run-time atau bergantung pada input pengguna. Kemudian kami menggunakannya untuk mengakses properti. Ini memberi kami fleksibilitas yang luar biasa

Sebagai contoh

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_0

Notasi titik tidak dapat digunakan dengan cara yang sama

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_1

Kita bisa menggunakan tanda kurung siku di dalam objek literal, saat kita membuat objek. Dipanggil dengan properti yang dihitung

Sebagai contoh

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_2

Arti dari properti yang dihitung itu sederhana.

delete user.age;

_7 berarti nama properti harus diambil dari

delete user.age;

8

Jadi, jika pengunjung memasukkan

delete user.age;

_9,

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

0 akan menjadi

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

1

Pada dasarnya, ini bekerja mirip dengan

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_3

… Tapi lebih manis

Kita dapat menggunakan ekspresi kompleks dalam tanda kurung kotak

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_4

Kurung kotak jauh lebih kuat daripada notasi titik. Mereka mengizinkan nama variabel dan properti apa pun. Tetapi mereka juga lebih rumit untuk ditulis

Seringkali, ketika nama properti dikenal dan sederhana, dot digunakan. Dan jika kita membutuhkan sesuatu yang rumit, maka kita ubah menjadi braket kotak

Dalam kode nyata kita sering menggunakan variabel sebagai nilai untuk nama properti

Sebagai contoh

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_5

Pada contoh di atas, properti memiliki nama yang sama dengan variabel. Kasus penggunaan menggunakan properti dari variabel sangat umum, bahwa ada singkatan nilai properti khusus yang mempersingkatnya

Alih-alih

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

_2 kita bisa menulis

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

3, seperti ini

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_6

Kita dapat menggunakan singkatan dan properti normal secara bersamaan dalam satu objek

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_7

Seperti yang sudah kita ketahui, sebuah variabel tidak boleh memiliki nama yang sama dengan salah satu “kata yang sudah dimiliki oleh bahasa pemrograman” seperti “for”, “let”, “return” dan lain-lain.

Tapi dari properti objek, tidak ada batasan seperti itu

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_8

Singkatnya, tidak ada batasan dalam penamaan properti. String atau simbol apa pun dapat digunakan (untuk jenis pengenal khusus, akan dibahas nanti)

Untuk tipe lainnya, secara otomatis akan diubah menjadi string

Misalnya, angka

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

4 menjadi string

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

5 saat digunakan sebagai kunci properti

let user = {     // objek
  name: "John",  // dengan kunci "name" menyimpan nilai "John"
  age: 30        // dengan kunci "age" menyimpan nilai 30
};

_9

Ada hal kecil dengan properti khusus yang disebut

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

6. Kami tidak dapat menetapkan nilai non-objek ke dalamnya

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

0

Seperti yang kita lihat di kode, memasukkan nilai primitif

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

7 akan diabaikan

Kami akan membahas sifat

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

6 di bab berikutnya, dan menyarankan cara untuk membenarkan sifatnya

Fitur yang dapat direkam dalam objek Javascript, dibandingkan dengan bahasa lain, adalah memungkinkannya mengakses properti apa pun. Tidak akan ada kesalahan jika properti tidak ada

Membaca properti yang tidak ada akan mengembalikan

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

9. Jadi kita akan dengan mudah menguji apakah properti itu ada atau tidak

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_1

Ada juga operator khusus

let user = {
  name: "John",
  age: 30,
}

0 untuk memeriksa keberadaan properti

Sintaks

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_2

Sebagai contoh

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_3

Harap diingat bahwa di sisi kiri

let user = {
  name: "John",
  age: 30,
}

1 harus ada nama properti. Itu biasanya string yang dikutip

Jika tanda kutip kita hilangkan, artinya variabel, harus berisi nama yang akan diuji. Contoh

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_4

Lalu kenapa ada operator

let user = {
  name: "John",
  age: 30,
}

1?

Yah, sebagian besar waktu perbandingan dengan

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

9 bekerja dengan baik. Tetapi ada kasus khusus di mana itu akan gagal, tetapi dengan

let user = {
  name: "John",
  age: 30,
}

0 itu akan berjalan dengan baik

Yaitu ketika ada properti objek, tetapi menyimpan

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

9

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

5

Dalam contoh kode di atas, properti

let user = {
  name: "John",
  age: 30,
}

_7 secara teknis ada. Tapi operator

let user = {
  name: "John",
  age: 30,
}

_1 bekerja dengan baik

Situasi seperti ini jarang terjadi, karena

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // nama properti multi-kata harus diquotasi
};

9 biasanya tidak diatur. Kami sering menggunakan

// ini akan memberi galat syntax
user.likes birds = true

0 untuk nilai "tidak diketahui" atau "kosong". Jadi operator

let user = {
  name: "John",
  age: 30,
}

_1 adalah tamu eksotis dalam kode

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_6

...Sebaliknya, jika kuncinya bukan bilangan bulat, maka kunci tersebut didaftarkan dalam urutan pembuatan, misalnya

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_7

Nah, untuk mengatasi masalah kode telepon, kita bisa melakukan "cheat" dengan membuat kode tersebut menjadi non-integer. Cukup tambahkan tanda tambah

// ini akan memberi galat syntax
user.likes birds = true

_2 sebelum setiap kode

Seperti ini

// ambil nilai properti objek:
alert( user.name ); // John
alert( user.age ); // 30

_8

Sekarang berfungsi sebagaimana dimaksud

Objek adalah array asosiatif dengan beberapa fitur khusus

Objek menyimpan properti (pasangan kunci-nilai), di mana

kunci properti harus berupa string atau simbol (biasanya string)
Nilainya bisa tipe apa saja

Untuk mengakses properti, kita dapat menggunakan

Notasi titik.

// ini akan memberi galat syntax
user.likes birds = true

3

Notasi tanda kurung

// ini akan memberi galat syntax
user.likes birds = true

4. Tanda kurung memungkinkan mengambil kunci dari variabel, seperti

// ini akan memberi galat syntax
user.likes birds = true

5

Operator tambahan

Untuk menghapus properti.

// ini akan memberi galat syntax
user.likes birds = true

6

Untuk memeriksa apakah ada properti dengan nilai yang diberikan.
```
// ini akan memberi galat syntax
user.likes birds = true
```
7

Untuk mengulang objek.

// ini akan memberi galat syntax
user.likes birds = true

8 putaran

Dalam bab ini kita telah mempelajari apa yang disebut "objek biasa" atau "Objek sederhana" atau

// ini akan memberi galat syntax
user.likes birds = true

9

Ada banyak hal tentang objek di Javascript

let user = {};

// set
user["likes birds"] = true;

// get
alert(user["likes birds"]); // true

// delete
delete user["likes birds"];

_0 untuk menyimpan kumpulan data,

let user = {};

// set
user["likes birds"] = true;

// get
alert(user["likes birds"]); // true

// delete
delete user["likes birds"];

_1 untuk menyimpan informasi tentang tanggal dan waktu,

let user = {};

// set
user["likes birds"] = true;

// get
alert(user["likes birds"]); // true

// delete
delete user["likes birds"];

_2 untuk menyimpan informasi tentang kesalahan

...Dan lain-lain

Mereka memiliki fitur khusus lainnya yang akan kita pelajari nanti. Kadang-kadang orang mengatakan hal-hal seperti "tipe array" atau "tipe tanggal/waktu", tetapi secara formal mereka bukan tipe mereka sendiri, tetapi milik tipe data "objek" tunggal. dan mereka dapat meluas ke berbagai arah

Objek dalam Javascript sangat kuat. Kami baru belajar sedikit tentang topik yang sebenarnya sangat luas. Kita akan belajar lebih banyak tentang objek dan belajar tentang objek di bagian selanjutnya

Apa itu objek dalam javascript?

3. 1 Penjelasan Obyek . variabel yang menyimpan nilai (properti) yang dibuat dengan tanda kurung kurawal dengan isi berupa key dan value.

Apa itu array dan objek dalam javascript?

Objek. kalau diterjemahkan ke dalam bahasa Indonesia adalah objek/tujuan/sasaran. Larik. jika diterjemahkan ke dalam bahasa Indonesia adalah susunan/urutan/baris . Himpunan[]. untuk menampilkan daftar nomor.

Bagaimana cara menulis fungsi dalam javascript *?

untuk membuat suatu fungsi, penulisan harus diawali dengan sintaks “fungsi” kemudian dilanjutkan dengan nama fungsi yang akan dibuat. dan isikan from fungsinya ditulis di in kurung kurawal buka " {” dan kurung kurawal tutup “}”.

Apa itu javascript onclick?

onclick adalah atribut HTML untuk menentukan tindakan saat peristiwa mengklik suatu elemen. Atribut ini dapat diisi dengan nama fungsi atau ekspresi javascript . Selain event onclick , ada juga event lainnya seperti onchange, onmouseover, onkeyup, onload, dll.

kode javascript