objek JavaScript


Objek JavaScript ialah data yang mempunyai sifat dan kaedah.

Objek kehidupan sebenar, sifat dan kaedah

Dalam kehidupan sebenar, kereta ialah objek.

Objek mempunyai atributnya, seperti berat dan warna, dsb., dan kaedahnya termasuk mula dan berhenti, dsb.:

对象属性方法

car.name = Fiat

car.model = 500

car.weight = 850kg

car.color = white
car.start()

car.drive()

car.brake()

car.stop()

Semua kereta mempunyai atribut ini, tetapi atribut setiap kereta adalah berbeza.

Semua kereta mempunyai kaedah ini, tetapi ia dilaksanakan pada masa yang berbeza.

Objek JavaScript

Dalam JavaScript, hampir semuanya adalah objek.


Note在 JavaScript 中，对象是非常重要的，当你理解了对象，就可以了解 JavaScript 。


Anda telah mempelajari tentang tugasan pembolehubah JavaScript.

Kod berikut menetapkan nilai pembolehubah kereta kepada "Fiat":

var kereta = "Fiat" ;

Objek juga pembolehubah, tetapi objek boleh mengandungi berbilang nilai (berbilang pembolehubah).

var kereta = {jenis:"Fiat", model:500, warna:"putih"};

Dalam contoh di atas, 3 nilai ("Fiat", 500, "putih") diberikan kepada kereta berubah-ubah.

Dalam contoh di atas, 3 pembolehubah (jenis, model, warna) diberikan kepada kereta pembolehubah.


NoteJavaScript 对象是变量的容器。


Definisi objek

Anda boleh menggunakan aksara untuk mentakrif dan mencipta objek JavaScript:

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建 JavaScript 对象。</p>
<p id="demo"></p>
<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
document.getElementById("demo").innerHTML =
	person.firstName + " 现在 " + person.age + " 岁.";
</script>

</body>
</html>

Jalankan contoh»

Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Tentukan objek JavaScript boleh menjangkau berbilang baris, ruang dan pemisah baris tidak diperlukan daripada:

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建 JavaScript 对象。</p>
<p id="demo"></p>
<script>
var person = {
    firstName : "John",
    lastName  : "Doe",
    age       : 50,
    eyeColor  : "blue"
};
document.getElementById("demo").innerHTML =
	person.firstName + " 现在 " + person.age + " 岁。";
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk lihat contoh dalam talian

Sifat objek

Boleh dikatakan bahawa "objek JavaScript ialah bekas pembolehubah".

Walau bagaimanapun, kami biasanya menganggap "objek JavaScript sebagai bekas pasangan nilai kunci".

pasangan nilai kunci biasanya ditulis sebagai nama : nilai (kunci dan nilai dipisahkan oleh titik bertindih).

pasangan nilai kunci dalam objek JavaScript sering dipanggil sifat objek.


NoteJavaScript 对象是属性变量的容器。


Pasangan nilai kunci objek ditulis seperti:

  • Associative array dalam PHP

  • Kamus dalam Python

  • Jadual Hash dalam C

  • Peta Hash dalam Java

  • Jadual Hash dalam Ruby dan Perl

Mengakses sifat objek

Anda boleh mengakses sifat objek dalam dua cara:

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>
有两种方式可以访问对象属性：
</p>
<p>
你可以使用 .property 或 ["property"].
</p>
<p id="demo"></p>
<script>
var person = {
    firstName : "John",
    lastName : "Doe",
    id : 5566
};
document.getElementById("demo").innerHTML =
	person.firstName + " " + person.lastName;
</script>

</body>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>
有两种方式可以访问对象属性: 
</p>
<p>
你可以使用 .property 或 ["property"]。
</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566
};
document.getElementById("demo").innerHTML =
	person["firstName"] + " " + person["lastName"];
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian


Kaedah Objek

Kaedah objek mentakrifkan fungsi dan disimpan sebagai sifat objek.

Kaedah objek dipanggil (sebagai fungsi) dengan menambah ().

Instance ini mengakses kaedahNama() penuh bagi objek orang:

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建和使用对象方法。</p>
<p>对象方法作为一个函数定义存储在对象属性中。</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
	{
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
	
</body>
</html>

Instance yang sedang berjalan»

Klik butang "Jalankan Instance" untuk melihat contoh dalam talian

Jika anda ingin mengakses sifat Nama penuh objek orang, ia akan dikembalikan sebagai rentetan yang mentakrifkan fungsi:

Instance

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建和使用对象方法。</p>
<p>对象方法是一个函数定义,并作为一个属性值存储。</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
	{
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("demo").innerHTML = person.fullName;
</script>
	
</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

NoteJavaScript 对象是属性和方法的容器。

Selepas Anda akan mengetahui lebih lanjut tentang fungsi, sifat dan kaedah dalam tutorial ini.

Mengakses kaedah objek

Anda boleh mencipta kaedah objek menggunakan sintaks berikut:

Nama kaedah : function() { baris kod }

Anda boleh mengakses kaedah objek menggunakan sintaks berikut:

objectName.methodName()

biasanya fullName () ialah kaedah objek orang, fullName tersedia sebagai atribut.

Terdapat banyak cara untuk mencipta, menggunakan dan mengubah suai objek JavaScript.

Terdapat juga banyak cara untuk mencipta, menggunakan dan mengubah suai sifat dan kaedah.


Note在随后的教程中，你将学习到更多关于对象的知识。


Lagi kejadian

Buat JavaScript objek I

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建 JavaScript 对象。</p>
<p id="demo"></p>
<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
document.getElementById("demo").innerHTML =
	person.firstName + " 现在 " + person.age + " 岁.";
</script>

</body>
</html>

Jalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

Cipta JavaScript Object II

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建 JavaScript 对象。</p>
<p id="demo"></p>
<script>
var person = {
    firstName : "John",
    lastName  : "Doe",
    age       : 50,
    eyeColor  : "blue"
};
document.getElementById("demo").innerHTML =
	person.firstName + " 现在 " + person.age + " 岁。";
</script>

</body>
</html>

Jalankan contoh»

Klik butang "Jalankan contoh" untuk melihat contoh dalam talian

Akses sifat objek I

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>
有两种方式可以访问对象属性：
</p>
<p>
你可以使用 .property 或 ["property"].
</p>
<p id="demo"></p>
<script>
var person = {
    firstName : "John",
    lastName : "Doe",
    id : 5566
};
document.getElementById("demo").innerHTML =
	person.firstName + " " + person.lastName;
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat instance dalam talian

Akses Object Properties II

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>phn.cn</title> 
</head>
<body>

<p>
有两种方式可以访问对象属性: 
</p>
<p>
你可以使用 .property 或 ["property"]。
</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566
};
document.getElementById("demo").innerHTML =
	person["firstName"] + " " + person["lastName"];
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk lihat contoh dalam talian

Atribut fungsi diakses sebagai kaedah

Instance

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php.cn</title> 
</head>
<body>

<p>创建和使用对象方法。</p>
<p>对象方法作为一个函数定义存储在对象属性中。</p>
<p id="demo"></p>
<script>
var person = {
    firstName: "John",
    lastName : "Doe",
    id : 5566,
    fullName : function() 
	{
       return this.firstName + " " + this.lastName;
    }
};
document.getElementById("demo").innerHTML = person.fullName();
</script>
	
</body>
</html>

Run Instance»

Klik butang "Jalankan Instance" untuk melihat Instance dalam talian

Atribut fungsi diakses sebagai atribut

Instance

rreee

Menjalankan Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian