JavaScript對(duì)象詳細(xì)剖析
JavaScript 不是一種成熟的面向?qū)ο缶幊陶Z言，例如 Java，但它是在簡(jiǎn)單的基于對(duì)象的模型上設(shè)計(jì)的。對(duì)象是具有包含 JavaScript 變量或其他對(duì)象的屬性的構(gòu)造。對(duì)象還具有與其關(guān)聯(lián)的函數(shù)，這些函數(shù)稱為對(duì)象的方法。除了 JavaScript 核心（例如數(shù)組或數(shù)學(xué)）對(duì)象之外，您還可以定義自己的對(duì)象。
簡(jiǎn)介
由于 JavaScript 是一種松散類型、動(dòng)態(tài)且富有表現(xiàn)力的語言，因此您可以通過多種方式完成相同的任務(wù)。本教程的目的是為您提供釋放語言潛力（在創(chuàng)建和使用對(duì)象的上下文中）的指南，從而幫助您了解幕后發(fā)生的事情。不能說這里描述的方法是做事的唯一方法。相反，如果這能幫助您選擇自己的方法，那就太好了。
JavaScript 對(duì)象、創(chuàng)建對(duì)象、語法
JavaScript 對(duì)象
JavaScript 中的“一切”就像一個(gè)對(duì)象，例如字符串、數(shù)字、數(shù)組、函數(shù)……，但有兩個(gè)例外：null和undefined。
JavaScript：創(chuàng)建對(duì)象
在 JavaScript 中，創(chuàng)建對(duì)象的方法有很多種。您可以使用對(duì)象初始值設(shè)定項(xiàng)創(chuàng)建對(duì)象，或編寫構(gòu)造函數(shù)來定義對(duì)象類型并使用 new 運(yùn)算符創(chuàng)建對(duì)象的實(shí)例。 JavaScript 的“對(duì)象初始值設(shè)定項(xiàng)”與 C++ 使用的術(shù)語一致。
句法
使用對(duì)象字面量 - {} 表示法，您可以創(chuàng)建一個(gè)普通對(duì)象：
var objectName = {}或者
您可以通過定義屬性和值來創(chuàng)建新對(duì)象：
var objectName = { property1 : value1,
property2 : value2,
//...,
propertyN : valueN } ; 在哪里
objectName ：新對(duì)象的名稱。
property_1, property_2, .....property_n ：標(biāo)識(shí)符（名稱、數(shù)字或字符串）。
value1, value2,..,valueN ：一個(gè)表達(dá)式，其值由 property_1、property_2、.....property_n 標(biāo)識(shí)。
在 JavaScript 中，您可以創(chuàng)建新對(duì)象而無需創(chuàng)建類。該對(duì)象不屬于任何類；它是同類中唯一的一個(gè)。您可以使用typeof 運(yùn)算符來獲取新創(chuàng)建的對(duì)象的數(shù)據(jù)類型。請(qǐng)參閱以下示例：
*要運(yùn)行代碼，請(qǐng)將鼠標(biāo)懸停在“輸出”面板上，然后單擊“使用 JS 運(yùn)行”按鈕。*
jsbin.com 上的 JS Bin ">檢查對(duì)象的類型
示例：對(duì)象初始值設(shè)定項(xiàng)
以下代碼創(chuàng)建一個(gè)對(duì)象“student”，具有三個(gè)屬性 name、sclass 和 rollno。
var Student = {
name : "David Rayy",
sclass : "VI",
rollno : 12 }使用構(gòu)造函數(shù)
這是創(chuàng)建對(duì)象的另一種方法。
首先通過編寫構(gòu)造函數(shù)定義對(duì)象類型，然后用new創(chuàng)建對(duì)象的實(shí)例。
編寫構(gòu)造函數(shù)時(shí)，我們應(yīng)該遵循以下規(guī)則。
構(gòu)造函數(shù)名稱將是對(duì)象類型名稱。
在構(gòu)造函數(shù)中，this 運(yùn)算符用于引用當(dāng)前對(duì)象。
屬性/方法的值在等號(hào)“=”之后定義。
構(gòu)造函數(shù)中不會(huì)有“return”語句。
構(gòu)造函數(shù)的示例
這是構(gòu)造函數(shù)的示例：
function Student(name, sclass, rollno)
{
this.name = name;
this.sclass = sclass;
this.rollno = rollno; }上面對(duì)象的類型是student，有name、sclass、rollno三個(gè)屬性。對(duì)象的值取決于傳遞給函數(shù)的參數(shù)。讓我們創(chuàng)建一個(gè)名為 Studentv 的對(duì)象，如下所示：
studentv = new student("John", "V", 10); 上面的語句創(chuàng)建一個(gè)名為 Studentv 的對(duì)象，并為其屬性分配指定的值。因此，studentv.name 的值是字符串“John”，studentv.sclass 是字符串“V”，student.rollno 是整數(shù) 10。您可以使用 new 運(yùn)算符創(chuàng)建任意數(shù)量的學(xué)生對(duì)象。例如 -
studentv = new student("John", "V", 10);
studentvi = new student("Scott", "VI", 2);對(duì)象和屬性
屬性是對(duì)象的特征。 JavaScript 對(duì)象具有與其關(guān)聯(lián)的屬性。例如，文檔對(duì)象有一個(gè)名為 fgColor 的屬性，該屬性描述 (document.fgColor = "color_name") 該對(duì)象的背景顏色。 JavaScript 對(duì)象的屬性與 JavaScript 變量基本相同，只是附加了帶有點(diǎn)符號(hào)的對(duì)象名稱。
在javaScript中，對(duì)象名和屬性名都是區(qū)分大小寫的。您可以通過指定值來定義屬性。假設(shè)有一個(gè)名為student的對(duì)象，它具有三個(gè)屬性name、sclass、rollno。他們定義如下：
student.name = "David Rayy";
student.sclass = "V";
student.rollno = 1 ;JavaScript 對(duì)象的屬性也可以使用方括號(hào)表示法來設(shè)置。 JavaScript 中的對(duì)象和數(shù)組密切相關(guān)，實(shí)際上它們是同一數(shù)據(jù)結(jié)構(gòu)的不同接口。您可以按如下方式設(shè)置先前學(xué)生對(duì)象的屬性：
student.["name"] = "David Rayy";
student.["sclass"] = "V";
student.["rollno"] = 1;所述數(shù)組的類型稱為關(guān)聯(lián)數(shù)組，因?yàn)槊總€(gè)索引元素也與一個(gè)字符串值關(guān)聯(lián)。
訪問屬性
有兩種方法可以訪問對(duì)象的屬性：
點(diǎn)符號(hào)
方括號(hào)表示法。
兩種符號(hào)的作用相同。方括號(hào)表示法用于在動(dòng)態(tài)設(shè)置屬性時(shí)確定屬性名稱（即直到運(yùn)行時(shí)才確定屬性名稱）。
var color = {name: 'red'};
color.name; // red
color['name']; // red
var get = 'name';
color[get]; // red刪除屬性
刪除運(yùn)算符刪除對(duì)象的屬性。如果將屬性設(shè)置為 null 或未定義，則只會(huì)刪除與該屬性關(guān)聯(lián)的值，但不會(huì)刪除鍵。請(qǐng)參見以下示例：
var obj = {
property1 : 'value1',
property2 : 'value2',
property3 : 'value3'
};
obj.property1 = undefined;
obj.property2 = null;
delete obj.property3;JavaScript：定義方法
在 JavaScript 中，對(duì)象的方法在該對(duì)象“內(nèi)部”運(yùn)行。方法是與對(duì)象關(guān)聯(lián)的函數(shù)。對(duì)象的鍵稱為屬性，它們是原始值和其他對(duì)象的容器。如果屬性包含函數(shù)作為其值，則它們稱為方法。方法的定義方式與普通函數(shù)的定義方式相同，只不過它們必須被指定為對(duì)象的屬性。請(qǐng)參閱以下代碼：
句法
var myObj = {
...
methodName: Myfunction(parameters)
{
statements;
}
}; 在哪里
“ myObj ”是對(duì)象的名稱。
“ methodName ”是方法的名稱。
“ Myfunction ”是函數(shù)的名稱。
您可以通過以下方式調(diào)用上述方法：
myObj.methodName(參數(shù));您可以通過在對(duì)象構(gòu)造函數(shù)中包含方法定義來定義對(duì)象類型的方法。例如，您可以定義一個(gè)函數(shù)，該函數(shù)將格式化并顯示先前定義的學(xué)生對(duì)象的屬性（即名稱、班級(jí)、卷號(hào)）；請(qǐng)參閱以下示例：
function studentDetails()
{
alert(
"The name of the student is " + this.name + " Class : " + this.class + " Roll No.: " + this.rollno)
}其中alert() - 顯示學(xué)生的詳細(xì)信息。
要使該函數(shù)成為學(xué)生對(duì)象的方法，可以使用以下代碼：
this.studentDetails = 學(xué)生詳細(xì)信息;到對(duì)象定義。
因此，學(xué)生的完整定義現(xiàn)在如下所示：
function student(name, class, rollno)
{
this.name = name
this.class = class
this.class = rollno
this.studentDetails = studentDetails
} 示例：學(xué)生對(duì)象
HTML 代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>working-with-objects-1</title>
</head>
<body>
</body>
</html>JS代碼
var fruitslist = new Array("Orange","Apple","Banana","Chery" );
var newParagraph = document.createElement("p");
var newText = document.createTextNode("List of Fruits : " + fruitslist);
newParagraph.appendChild(newText);
document.body.appendChild(newParagraph);
var newfruitslist =fruitslist.slice(1,3);
var newParagraph = document.createElement("p");
var newText = document.createTextNode("Extract Fruits List : " + newfruitslist);
newParagraph.appendChild(newText);
document.body.appendChild(newParagraph); JavaScript 方法的更多示例
HTML 代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>working-with-objects-2</title>
</head>
<body>
</body>
</html>JS代碼
var myObj = { // object "myobj" with three properties: x, y, z
x: 100, // primitive value
y: {a: 12}, // object "y" with property a
z: function() // function abc -> (method)
{
console.log('Method myObj.z');
}
};
console.log(myObj.x); // 100
console.log(myObj.y); // [object Object]
console.log(myObj.y.a); // 12
myObj.z(); // 'Method myObj.z'原型
在上一節(jié)中，我們將對(duì)象討論為簡(jiǎn)單的鍵和值對(duì)。但是JavaScript對(duì)象中有一個(gè)附加屬性，一個(gè)指向另一個(gè)對(duì)象的指針，稱為該對(duì)象的原型。
JavaScript 不支持經(jīng)典的繼承模型，而是使用原型模型。
JavaScript 中的每個(gè)對(duì)象都包含對(duì)其原型的引用
默認(rèn)是object.prototype
字符串使用 String.prototype 等。
原型可以有原型，等等。
對(duì)象從其原型繼承所有屬性/方法
在下面的示例中，我們創(chuàng)建了一個(gè)構(gòu)造函數(shù)，并將一個(gè)方法（“display”）添加到該函數(shù)的原型屬性中，然后創(chuàng)建一個(gè)新對(duì)象（“stu1”）。
HTML 代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>working-with-objects-3</title>
</head>
<body>
</body>
</html>JS代碼
// Constructor function student
function student() {
this.name = "Robert";
}
// add a method ti function's prototype
student.prototype.display = function() {
console.log("My name is " + this.name);
};
// create a new object stu1
var stu1 = new student();
// stu1 can access the display() method
stu1.display();現(xiàn)在，新創(chuàng)建的對(duì)象“stu1”可以訪問構(gòu)造函數(shù)原型上定義的所有屬性。
刪除對(duì)象
使用刪除運(yùn)算符我們可以刪除一個(gè)對(duì)象。請(qǐng)參閱以下代碼如何刪除對(duì)象。
myobj=新數(shù)組（元素1，元素2）
刪除 myobj
版權(quán)所屬：SO JSON在線解析
原文地址：http://zijieyoumin.cn/blog/528.html
轉(zhuǎn)載時(shí)必須以鏈接形式注明原始出處及本聲明。
如果本文對(duì)你有幫助，那么請(qǐng)你贊助我，讓我更有激情的寫下去，幫助更多的人。
