第八章——对象
2019獨角獸企業重金招聘Python工程師標準>>>
????因為JavaScript是一種基于原型的語言,所有JavaScript中對象的工作方式,與其他基于類的語言中的對象不同。JavaScript對象基本上是屬性和值的集合,這在編程中稱為哈希表(hash table)。其中的值可以是任意類型的數據,包括函數、數組和其他對象。可以使用對象從一處向另一處傳遞多個值(當使用JSON在JavaScript和另一門語言之間傳遞數據時,這是非常容易的,后面章節將對此進行討論)
一.創建單一對象(單一對象用于特定目的,例如創建名值對,或創建不與其他對象共享代碼的唯一對象)的方法:
①對象構造函數
var?car=new?Object(); car.seats="cloth"; car.engine="V-6"; car.show_features=function(){window.alert("car:"+car.seats+"seats,"+car.engine+"engine");}; car.show_features();或者(先創造函數,然后將此函數賦值給對象的函數)
var?car=new?Object(); car.seats="cloth"; car.engine="V-6"; function?my_alert(){window.alert("car:"+car.seats+"seats,"+car.engine+"engine");}; car.show_features=my_alert; car.show_features();?②對象字面量表示法
var?car={seats:"cloth",engine:"V-6",?show_features:function(){window.alert("car:"+car.seats+"seats,"+car.engine+"engine");} }二.訪問屬性值:
①圓點表示法:window.alert(car.seats);
②括號表示法:window.alert(car["seats"]);
當需要使用屬性名但它被存儲在變量中時,括號表示法的這個特性會非常有用。因為圓點表示法只允許使用基本的屬性名稱,不能使用變量值。
三.對象結構:當以特定的方式編寫對象時,可以創建一個對象,將它作為其他對象的結構或者模型。
①構造函數,構造函數可以為對象創建可重用代碼(注意函數名以大寫字母(C)開頭,這非必須,但有助于與其他類型的函數區分開來)
function Car(seats,engine,radio){
????this.seats=seats;
????this.engine=engine;
????this.radio=radio;
????this.describe=function(){
????????document.write("This amazing car has these features:");
????????document.write(this.seats+"seats,"+this.engine+"engine,"+this.radio);
????};
}
var car1=new Car("cloth","v-6","Tape Deck");
car1.describe();
在構造函數中添加方法這種方式非常直接,但對于對象的每個實例都會創建一個相同任務的函數方法,將會耗費時間和空間。看下面的方法:
function Car(seats,engine,radio){
????this.seats=seats;
????this.engine=engine;
????this.radio=radio;
????this.describe=describe_car();
}
function describe_car(){
????????document.write("This amazing car has these features:");
????????document.write(this.seats+"seats,"+this.engine+"engine,"+this.radio);
}
不過,這種方法也有不利之處:現在該方法函數是全局,這樣大量應該在Car結構的局部上下文之內的函數都出現在全局上下文中,從而使全局上下文變得混亂。為了解決這個問題,下面將學習使用原型。
四.使用原型:JavaScript中的每個函數都有prototype(原型)屬性,該屬性是一個對象,其中包含用該函數創建的每個對象實例都可以使用的屬性和方法。對于共享的屬性和方法,這種方式將使代碼很容易就可以跨實例重用。
function Car(seats,engine,radio){
????this.seats=seats;
????this.engine=engine;
????this.radio=radio;
}
Car.prototype.locks="automatic";
var car1=new Car("cloths","V-6","Type Deck");
window.alert(car1.locks);//automatic
原理:在JavaScript中,調用對象的屬性或方法將首先檢查嘗試使用它的對象。如果無法找到相應的屬性或方法,并不會立刻放棄。相反,JavaScript將搜索對象原型來檢查是否有匹配的值。實際上可向實例中添加與原型中的屬性同名的屬性,這將有效的隱藏該對象原型中的同名屬性的值。
function Car(seats,engine,radio){
????this.seats=seats;
????this.engine=engine;
????this.radio=radio;
}
Car.prototype.locks="automatic";
var car1=new Car("cloths","V-6","Type Deck");
car1.locks="manual";
window.alert(car1.locks);//manual
五.hasOwnProperty()方法:
有時要確認在對象實例(不是原型)中是否存在某個屬性。如果存在,該方法返回true,否則false;
function Car(seats,engine,radio){
????this.seats=seats;
????this.engine=engine;
????this.radio=radio;
}
Car.prototype.locks="automatic";
var car1=new Car("cloths","V-6","Type Deck");
var ca2=new Car("cloth","V-4","CD Changer");
car1.locks="manual";
window.alert(car1.locks);//manual
window.alert(car1.locks);//automatic
window.alert(car1.hasOwnProperty("locks");//true
window.alert(car2.hasOwnProperty("locks");//false
六.為方法使用原型:因為原型在對象的構造函數之外,并不在全局上下文中,因此它是添加方法函數的最佳位置,這些方法函數將在對象的每個實例之間共享。將對象每個實例的屬性添加到構造函數中(如果它們具有唯一值),并將方法添加到原型中,以便在所有實例中共享。基于上面的原因,生成自定義對象有一種通用模式,被稱為構造函數/原型結合模式。
function Car(seats,engine,radio){
????this.seats=seats;
????this.engine=engine;
????this.radio=radio;
}
Car.prototype.describe=function(){
????document.write("This amazing car has these features:");
????document.write(this.seats+"seats,"+this.engine+"engine,"+this.radio);
}
var car1=new Car("cloth","V-6","Tape Deck");
car1.describe();
七.for-in:JavaScript允許使用for-in循環遍歷對象的屬性,以及使用with語句來輕松訪問特定的對象。
for( var prop_name in car1){
????document.write(prop_name+":"+car1[prop_name]+"<br>");
}
注意,該循環將顯示所有的屬性,包括對象原型中的屬性。如果只希望使用對象實例中的屬性,可以使用hasOwnProperty()方法來檢查每個屬性
for( var prop_name in car1){
????if(car1.hasOwnProperty(prop_name)){
?????????document.write(prop_name+":"+car1[prop_name]+"<br>");
????}
}
②with語句:在with語句中可以直接使用對象的屬性名來訪問屬性值。(通常不鼓勵使用with,因為它存在性能問題,并且在使用它時,容易不小心對全局變量進行賦值或改寫)
with(car1){
document.write("Seats:"+seats+"<br>");
document.write("Engine:"+engine+"<br>");
document.write("Radio:"+theradio);
}
八.兩個預定義對象(這兩個對象都是window對象的一部分,可以通過window.navigator.property訪問其屬性,但是也可以直接使用):
①導航對象navigator對象的屬性:
appCodeName——瀏覽器的代碼名稱
appName——瀏覽器的全名
appVersion——瀏覽器的版本和其他的一些信息
還有一些其他的
②history對象的屬性:
length——返回瀏覽器當前窗口的歷史回話頁面的數量
③history對象的方法:
back(),使瀏覽器返回瀏覽器歷史列表中的后一頁
forward(),使瀏覽器返回瀏覽器歷史列表中的前一頁
go(),接收一個整形參數,可正可負,代表前進和返回幾個頁面,如果參數超過歷史列表內容,將什么也不做。
?
?
?
?
?
轉載于:https://my.oschina.net/u/1415486/blog/338639
總結
- 上一篇: FreeSWITCH与PSTN对接
- 下一篇: C# Linq 查询数据库(DataSe