Cara menggunakan javascript menemukan nilai objek

Salah satu kendala saya saat mulai belajar tentang javascript adalah tentang objek javascript. Berbeda dengan bahasa pemrograman lain seperti PHP dan VB, Javascript menggunakan Object sebagai datastore sementara di memorinya. pada artikel ini, kita akan belajar lebih banyak tentang objek dalam javascript

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

let user = new Object(); // "object constructor" syntax
let user = {};  // "object literal" syntax
_

Biasanya, tanda kurung gambar

user.isAdmin = true;
_5 digunakan. Deklarasi itu disebut literal objek

Kami dapat segera memasukkan beberapa properti ke

user.isAdmin = true;
_5 sebagai "key. pasangan nilai”.

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};

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

user.isAdmin = true;
7 dan nilai di sebelah kanannya

Di objek

user.isAdmin = true;
_8, ada dua properti

  1. Properti pertama memiliki nama
    user.isAdmin = true;
    _9 dan nilainya
    delete user.age;
    0
  2. Yang kedua memiliki nama
    delete user.age;
    _1 dan nilai
    delete user.age;
    2

Objek

user.isAdmin = true;
_8 yang dihasilkan dapat dibayangkan sebagai kabinet dengan dua file bertanda tangan berlabel "nama" dan "usia"

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

Nilai properti dapat diakses menggunakan notasi titik

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30

Nilainya bisa dari jenis apa saja. Mari tambahkan yang boolean

user.isAdmin = true;

Untuk menghapus properti, kita dapat menggunakan operator

delete user.age;
_4

delete user.age;

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

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};

Properti terakhir dalam daftar dapat diakhiri dengan koma

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

Itu disebut koma "di belakang" atau "menggantung". Memudahkan penambahan/penghapusan/pemindahan properti, karena semua baris menjadi sama

Untuk properti banyak kata, akses titik tidak berfungsi

// this would give a syntax error
user.likes birds = true

JavaScript tidak mengerti itu. Ia berpikir bahwa kita membahas

delete user.age;
_5, dan kemudian memberikan kesalahan sintaksis saat menemukan
delete user.age;
6 yang tidak terduga

Titik membutuhkan kunci untuk menjadi pengidentifikasi variabel yang valid. Itu menyiratkan. tidak mengandung spasi, tidak dimulai dengan angka, dan tidak menyertakan karakter khusus (

delete user.age;
7 dan
delete user.age;
8 diperbolehkan)

Ada alternatif "notasi braket persegi" 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 dicatat bahwa string di dalam tanda kurung dikutip dengan benar (semua jenis kutipan akan dilakukan)

Tanda kurung siku juga menyediakan cara untuk mendapatkan nama properti sebagai hasil dari ekspresi apa pun – berlawanan dengan string literal – seperti dari variabel sebagai berikut

let key = "likes birds";

// same as user["likes birds"] = true;
user[key] = true;

Di sini, variabel

user.isAdmin = true;
3 dapat dihitung pada saat run-time atau bergantung pada input pengguna. Dan kemudian kami menggunakannya untuk mengakses properti. Itu memberi kami banyak fleksibilitas

Contohnya

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_0

Notasi titik tidak dapat digunakan dengan cara yang sama

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_1

Kita bisa menggunakan tanda kurung siku dalam literal objek, saat membuat objek. Itu disebut properti yang dihitung

Contohnya

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_2

Arti dari properti yang dihitung sederhana.

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
0 artinya nama properti harus diambil dari
let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
1

Jadi, jika pengunjung memasukkan

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
_2,
let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
3 akan menjadi
let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
4

Pada dasarnya, itu bekerja sama dengan

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_3

.. Tapi itu terlihat lebih bagus

Kita dapat menggunakan ekspresi yang lebih kompleks di dalam tanda kurung siku

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_4

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

Jadi sering kali, ketika nama properti diketahui dan sederhana, titik digunakan. Dan jika kita membutuhkan sesuatu yang lebih kompleks, maka kita beralih ke tanda kurung siku

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

Contohnya

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_5

Pada contoh di atas, properti memiliki nama yang sama dengan variabel. Kasus penggunaan membuat properti dari variabel sangat umum, sehingga ada singkatan nilai properti khusus untuk membuatnya lebih pendek

Alih-alih

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
_5 kita bisa menulis
let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
6, seperti ini

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_6

Kita dapat menggunakan properti normal dan singkatan dalam objek yang sama

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_7

Seperti yang telah kita ketahui, sebuah variabel tidak boleh memiliki nama yang sama dengan salah satu kata yang dilindungi bahasa seperti "untuk", "biarkan", "kembalikan", dll.

Tapi untuk properti objek, tidak ada batasan seperti itu

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_8

Singkatnya, tidak ada batasan pada nama properti. Itu bisa berupa string atau simbol apa pun (tipe khusus untuk pengidentifikasi, yang akan dibahas nanti)

Jenis lain secara otomatis dikonversi menjadi string

Misalnya, angka

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
_7 menjadi string
let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
8 bila digunakan sebagai kunci properti

let user = {     // an object
  name: "John",  // by key "name" store value "John"
  age: 30        // by key "age" store value 30
};
_9

Ada gotcha kecil dengan properti khusus bernama

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
9. Kami tidak dapat mengaturnya ke nilai non-objek

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_0

Seperti yang kita lihat dari kode, penetapan ke

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

Kami akan membahas sifat khusus

let user = {
  name: "John",
  age: 30,
  "likes birds": true  // multiword property name must be quoted
};
_9 di bab selanjutnya, dan menyarankan cara untuk memperbaiki perilaku tersebut

Fitur penting dari objek dalam JavaScript, dibandingkan dengan banyak bahasa lainnya, adalah memungkinkan untuk mengakses properti apa pun. Tidak akan ada kesalahan jika properti tidak ada

Membaca properti yang tidak ada hanya mengembalikan

let user = {
  name: "John",
  age: 30,
}
2. Jadi kita dapat dengan mudah menguji apakah properti itu ada

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_1

Ada juga operator khusus

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

Sintaksnya adalah

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_2

Contohnya

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_3

Harap diperhatikan bahwa di sisi kiri

let user = {
  name: "John",
  age: 30,
}
4 harus ada nama properti. Itu biasanya string yang dikutip

Jika kita menghilangkan tanda kutip, itu berarti sebuah variabel harus berisi nama sebenarnya yang akan diuji. Contohnya

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_4

Mengapa operator

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

Yah, sebagian besar waktu perbandingan dengan

let user = {
  name: "John",
  age: 30,
}
2 bekerja dengan baik. Tapi ada kasus khusus ketika gagal, tapi
let user = {
  name: "John",
  age: 30,
}
3 bekerja dengan benar

Saat itulah properti objek ada, tetapi menyimpan

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

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_5

Pada kode di atas, properti

// this would give a syntax error
user.likes birds = true
_0 secara teknis ada. Jadi operator
let user = {
  name: "John",
  age: 30,
}
_4 bekerja dengan benar

Situasi seperti ini sangat jarang terjadi, karena

let user = {
  name: "John",
  age: 30,
}
2 tidak boleh ditetapkan secara eksplisit. Kami kebanyakan menggunakan
// this would give a syntax error
user.likes birds = true
3 untuk nilai "tidak diketahui" atau "kosong". Jadi operator
let user = {
  name: "John",
  age: 30,
}
_4 adalah tamu eksotis dalam kode

Untuk berjalan di atas semua kunci suatu objek, ada bentuk khusus dari loop.

// this would give a syntax error
user.likes birds = true
_5. Ini adalah hal yang sama sekali berbeda dari konstruksi
// this would give a syntax error
user.likes birds = true
6 yang kita pelajari sebelumnya

Sintaks

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_6

Misalnya, mari tampilkan semua properti

user.isAdmin = true;
8

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_7

Perhatikan bahwa semua konstruksi "untuk" memungkinkan kita untuk mendeklarasikan variabel perulangan di dalam perulangan, seperti

// this would give a syntax error
user.likes birds = true
8 di sini

Juga, kita bisa menggunakan nama variabel lain di sini, bukan

user.isAdmin = true;
3. Misalnya,
let user = {};

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

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

// delete
delete user["likes birds"];
_0 juga banyak digunakan

Apakah objek dipesan?

Jawaban singkatnya adalah. "dipesan dengan cara khusus". properti bilangan bulat diurutkan, yang lain muncul dalam urutan pembuatan. Detailnya menyusul

Sebagai contoh, mari pertimbangkan objek dengan kode telepon

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_8

Objek dapat digunakan untuk menyarankan daftar opsi kepada pengguna. Jika kami membuat situs terutama untuk pemirsa Jerman, kami mungkin ingin

let user = {};

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

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

// delete
delete user["likes birds"];
1 menjadi yang pertama

Tetapi jika kita menjalankan kodenya, kita melihat gambaran yang sama sekali berbeda

  • AS (1) lebih dulu
  • lalu Swiss (41) dan seterusnya

Kode telepon masuk dalam urutan terurut menaik, karena merupakan bilangan bulat. Jadi kita melihat

let user = {};

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

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

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

Properti bilangan bulat?

Istilah "properti bilangan bulat" di sini berarti string yang dapat dikonversi ke-dan-dari bilangan bulat tanpa perubahan

Jadi,

let user = {};

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

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

// delete
delete user["likes birds"];
_3 adalah nama properti bilangan bulat, karena ketika diubah menjadi bilangan bulat dan sebaliknya, masih tetap sama. Tapi
let user = {};

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

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

// delete
delete user["likes birds"];
4 dan
let user = {};

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

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

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

// get property values of the object:
alert( user.name ); // John
alert( user.age ); // 30
_9

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

user.isAdmin = true;
0

Jadi, untuk memperbaiki masalah kode telepon, kita bisa "menipu" dengan membuat kode non-integer. Menambahkan tanda tambah

let user = {};

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

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

// delete
delete user["likes birds"];
_6 sebelum setiap kode sudah cukup

Seperti ini

user.isAdmin = true;
1

Sekarang berfungsi sebagaimana dimaksud

Objek adalah array asosiatif dengan beberapa fitur khusus

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

  • Kunci properti harus berupa string atau simbol (biasanya string)
  • Nilai bisa dari jenis apa pun

Untuk mengakses properti, kita dapat menggunakannya

  • Notasi titik.
    let user = {};
    
    // set
    user["likes birds"] = true;
    
    // get
    alert(user["likes birds"]); // true
    
    // delete
    delete user["likes birds"];
    7
  • Notasi tanda kurung siku
    let user = {};
    
    // set
    user["likes birds"] = true;
    
    // get
    alert(user["likes birds"]); // true
    
    // delete
    delete user["likes birds"];
    8. Tanda kurung siku memungkinkan mengambil kunci dari variabel, seperti
    let user = {};
    
    // set
    user["likes birds"] = true;
    
    // get
    alert(user["likes birds"]); // true
    
    // delete
    delete user["likes birds"];
    9

Operator tambahan

  • Untuk menghapus properti.
    let key = "likes birds";
    
    // same as user["likes birds"] = true;
    user[key] = true;
    0
  • Untuk memeriksa apakah ada properti dengan kunci yang diberikan.
    let key = "likes birds";
    
    // same as user["likes birds"] = true;
    user[key] = true;
    1
  • Untuk mengulang objek.
    let key = "likes birds";
    
    // same as user["likes birds"] = true;
    user[key] = true;
    2 putaran

Apa yang telah kita pelajari dalam bab ini disebut "objek biasa", atau hanya

let key = "likes birds";

// same as user["likes birds"] = true;
user[key] = true;
3

Ada banyak jenis objek lain di JavaScript

  • let key = "likes birds";
    
    // same as user["likes birds"] = true;
    user[key] = true;
    4 untuk menyimpan koleksi data yang dipesan,
  • let key = "likes birds";
    
    // same as user["likes birds"] = true;
    user[key] = true;
    5 untuk menyimpan informasi tentang tanggal dan waktu,
  • let key = "likes birds";
    
    // same as user["likes birds"] = true;
    user[key] = true;
    6 untuk menyimpan informasi tentang kesalahan
  • ...Dan seterusnya

Mereka memiliki ciri khusus yang akan kita pelajari nanti. Kadang-kadang orang mengatakan sesuatu seperti "tipe Array" atau "tipe Tanggal", tetapi secara formal mereka bukan tipe mereka sendiri, tetapi milik tipe data "objek" tunggal. Dan mereka memperluasnya dengan berbagai cara

Objek dalam JavaScript sangat kuat. Di sini kita baru saja menggores permukaan topik yang sangat besar. Kita akan bekerja erat dengan objek dan mempelajari lebih lanjut tentangnya di bagian selanjutnya dari tutorial ini

Simbol apa yang dapat digunakan untuk membuat objek dalam javascript?

Objek pada javascript , dapatkan dibuat dengan tanda kurung kurawal dengan isi berupa key dan value. Kode di atas juga bisa ditulis seperti ini. var mobil = { jenis. "Fiat", modelnya. "500", warna. "putih" };

Apa yang dimaksud dengan metode dalam javascript?

Metodemetode digunakan untuk manipulasi array, seperti menambahkan item baru, menghapus, dan segera.

Metode apa yang bisa kita gunakan untuk mengurutkan elemen array berdasarkan kondisi tertentu dan akan membuat array baru?

filter() .