HTML-JavaScript物件及初識面向物件
物件是什麼
物件是包含相關屬性和方法的集合體（屬性）（方法）
什麼是面向物件
1.面向物件僅僅是一個概念或者程式設計思想
2.通過一種叫做原型的方式來實現面向物件程式設計
JavaScript中的基本資料型別：
- number（數值型別）
- string（字串型別）
- boolean(布林型別)
- null(空型別) 【判斷後的值是object】
- undefined(未定義型別)
- object(例項化的物件是一組資料或者功能的集合)
建立物件
1.自定義物件 2.內建物件
自定義物件：1、基於Object物件的方式建立物件
語法：var 物件名稱
【通過 . 新增屬性和方法】
示例：
var flower=new Object();
flower.name="長春花";
flower.genera="夾竹桃科 長春花屬";
flower.area="非洲、亞熱帶、熱帶以及中國大陸的華東、西南、中南等地";
flower.uses="觀賞或用藥等";
flower.showName=function(){ alert(this.name); }
flower.showName();
2、使用字面量賦值方式建立物件
示例：
var flower={ name:"長春花", genera:"夾竹桃科 長春花屬", area:"非洲、亞熱帶、熱帶以及中國大陸的華東、西南、中南等地", uses:"觀賞或用藥等", showName:function(){ alert(this.name); } } flower.showName();
內建物件：常見的內建物件
1. String（字串）物件
length屬性
indexOf( )方法、replace( )方法
2. Date（日期）物件
get×××：獲取年、月、日、時、分、秒等等
set×××：設定年、月、日、時、分、秒等等
3. Array（陣列）物件
length屬性
sort( )、concat( )、join( )方法
4. Boolean（邏輯）物件
true或者false
toString( )方法
5. Math（算數）物件
round( )、max( )、min( )方法
6. RegExp物件
RegExp是正則表示式的縮寫
建構函式和原型物件
如何解決使用同一個介面不需要建立很多物件，減少產生大量的重複程式碼？
1.建構函式 2.原型物件
建構函式
①建立特定型別的物件
②通過this變數控制屬性和方法，實現屬性和方法的呼叫
③通過new操作符來建立對應的建構函式的例項，也就是物件
示例:
function Flower(name,genera,area,uses){
<建構函式始終都應該以一個大寫字母開頭>
this.name=name;
…….
this.showName=function(){
alert(this.name);
}
}
var flower1=new Flower("長春花","夾竹桃科 長春花屬","非洲、亞熱帶、熱帶以及中國大陸的華東、西南、中南等地","觀賞或用藥等")
flower1.showName();var flower2=new Flower("牡丹","芍藥科 芍藥屬","中國","觀賞、食用或藥用");
flower2.showName();
var flower3=new Flower("曼陀羅花","茄科 曼陀羅屬","印度、中國北部","觀賞或藥用");
flower3.showName();
呼叫構函式的4個步驟
1.建立一個新物件
2.將建構函式的作用域賦給新物件（this就指向了這個新物件）
3.執行建構函式中的程式碼
4.返回新物件
constructor屬性:constructor屬性指向Flower
示例:
alert(flower1.constructor==Flower);
alert(flower2.constructor==Flower);
alert(flower3.constructor==Flower);
instanceof操作符
使用instanceof操作符檢測物件型別
alert(flower1 instanceof Object);
alert(flower1 instanceof Flower);
alert(flower2 instanceof Object);
alert(flower2 instanceof Flower);
alert(flower3 instanceof Object);
alert(flower3 instanceof Flower);
最後輸出都是true
原型物件
1.每個函式都有一個prototype屬性，這個屬性是一個指標，指向一個物件
2.prototype就是通過呼叫建構函式而建立的那個物件例項的原型物件
示例1.
function Flower(){
}
Flower.prototype.name="曼陀羅花";
Flower.prototype.genera="茄科 曼陀羅屬";
Flower.prototype.area="印度、中國北部";
Flower.prototype.uses="觀賞或藥用";
Flower.prototype.showName=function() {
alert(this.name);
}
var flower1=new Flower();
flower1.showName();
var flower2=new Flower();
flower2.showName();
alert(flower1.showName==flower2.showName);
原型物件結構：
flower1和flower2都有proto屬性、建構函式Flower和原型物件Flower.prototype；當建立了原型物件之後會自動獲得一個constructor屬性；同時也可以通過constructor新增其他的屬性和方法，再通過例項建立flower1和flower2。
示例2.
function Flower(){
}
Flower.prototype.name="曼陀羅花";
Flower.prototype.genera="茄科 曼陀羅屬";
Flower.prototype.area="印度、中國北部";
Flower.prototype.uses="觀賞或藥用";
Flower.prototype.showName=function() {
alert(this.name);
}
var flower1=new Flower();
var flower2=new Flower();
flower1.name="長春花";
alert(flower1.name);
alert(flower2.name);
繼承
1.原型鏈
①一個原型物件是另一個原型物件的例項
②相關的原型物件層層遞進，就構成了例項與原型的鏈條，就是原型鏈
示例：
function Humans(){
this.foot=2;
}
Humans.prototype.getFoot=function(){
return this.foot;
}
function Man(){
this.head=1;
}
Man.prototype=new Humans(); //繼承了Humans
Man.prototype.getHead=function(){
return this.head;
}
var man1=new Man();
alert(man1.getFoot()); //2
alert(man1 instanceof Object); //true
alert(man1 instanceof Humans); //true
alert(man1 instanceof Man); //true
建構函式和原型之間的關係
呼叫man1.getFoot( ) 經歷的三個步驟
1.搜尋例項 2.搜尋Man.prototype 3.搜尋Humans.prototype
完整的原型鏈
Object在原型鏈中的位置
如果沒有搜尋到會自動的往上一級進行檢索；先在Man中進行檢索查詢是否有getFoot這個方法；如果沒有繼續向上找到Man.prototype這個原型物件中的相關資訊；如果沒有繼續向上找到Humans.prototype這個原型物件中的相關資訊；如果沒有繼續向上找到Object Prototype這個原型物件中的相關資訊；同時明白Object在原型鏈中的位置在最上層。
2.物件繼承
示例
function Humans(){
this.clothing=["trousers","dress","jacket"];
}
function Man(){ }
//繼承了Humans
Man.prototype=new Humans();
var man1=new Man();
man1.clothing.push("coat");
alert(man1.clothing);
var man2=new Man();
alert(man2.clothing);
Man這個建構函式是把所有屬性和方法共享；使用時會把陣列中的資訊進行一個應用。
其中man1.clothing和man2.clothing輸入的資訊一樣，為什麼？
建立子型別的例項時，不能向父型別的建構函式中傳遞引數；我們可以使用借用建構函式來解決這樣的問題。
【借用建構函式就是在子類建構函式中呼叫父類建構函式，來實現屬性和方法的繼承】
借用建構函式
語法：apply([thisOjb[,argArray]])
應用某一物件的一個方法，用另一個物件替換當前物件
語法：call([thisObj[,arg1[,arg2[, [,argN]]]]])
呼叫一個物件的一個方法，以另一個物件替換當前物件
示例
function Humans(name){
this.name=name;
}
function Man(){
Humans.call(this,"mary"); //繼承了Humans,同時還傳遞了引數
this.age=38; //例項屬性
}
var man1=new Man();
alert(man1.name); //輸出mary
alert(man1.age); //輸出38
組合繼承
組合繼承：有時也叫做偽經典繼承
1.將原型鏈和借用建構函式的技術組合到一塊，發揮二者之長的一種繼承模式
2.使用原型鏈實現對原型屬性和方法的繼承，而通過借用建構函式來實現對例項屬性的繼承
