Javascript中的面向對象
來源:程序員人生 發布時間:2015-07-29 07:49:12 閱讀次數:3398次
學習JS這么長時間了,還是對其中面向對象的知識不太了解,最近抽出時間來總結1下,看1看JS中的對象世界。
1.JS中的創建類
在JS中創建類特別的容易,1般使用Function來聲明
<span style="font-family:SimSun;font-size:18px;"><script>
//創建類
function People()
{
}
//判斷類的類型
var someone = new People();
alert(someone instanceof People);
</script></span>
2.JS中的類的屬性
創建了類,下面來看1下如何來自定義屬性
<span style="font-family:SimSun;font-size:18px;"><script>
//類的屬性
function People(name, sex)
{
this.name = name;
this.sex = sex;
}
var susan = new People("Susan", "female");
alert(susan.name);
alert(susan.sex);
</script></span>
3.JS中的類的方法
<span style="font-family:SimSun;font-size:18px;"><script>
//類的方法
function People(name, sex) {
this.name = name;
this.sex = sex;
this.changeName = function (newName) {
this.name = newName;
}
}
var someone = new People("Susan", "female");
alert(susan.name);
someone.changeName("Lily");
alert(someone.name);
</script></span>
4.JS中類的公有屬性和私有屬性
在類中通過this指針添加的屬性均為公有屬性,私有屬性均為var
<span style="font-family:SimSun;font-size:18px;"> <!--共有屬性和私有屬性-->
<!--在類中通過this指針添加的屬性均為公有屬性。公有屬性是可以被外部訪問的屬性-->
<script>
function People(ndame, sex, deposit) {
this.name = name;
this.sex = sex;
var deposit = deposit;
this.changeName = function (newName) {
this.name = newName;
}
this.consume = function (money) {
if (deposit >= money) {
deposit -= money;
} else {
throw new Error("沒有足夠存款");
}
}
}
var susan = new People("susan", "female", 1000);
var name = susan.name;
var deposit = susan.deposit; //訪問不了,私有屬性
alert(deposit);
try {
susan.consume(500);
} catch (e) {
alert(e.message);
}
try {
susan.consume(1000);
} catch (e) {
alert(e.message);
}
</script></span>
5.公有方法和私有方法
屬性有公有和私有之分,方法也是。概念類似。
<span style="font-family:SimSun;font-size:18px;"> <!--公有方法和私用方法-->
<script>
function People(name, sex, deposit) {
this.name = name;
this.sex = sex;
var deposit = deposit; //私有屬性
this.thew = 1; //公有屬性
this.changeName = function (newName) {
this.name = newName;
}
this.consume = function (money) {
this.consume = function (money) {
if (deposit >= money) {
deposit -= money;
} else {
throw new Error("沒有足夠存款");
}
}
}
var _this = this;//保存當前對象到變量,_this中供私有方法使用
var digest = function (food) { //私有方法digest
_this.thew++; //匿名函數內,this指針指向會產生變化,因此程序中使用_this保存People對象援用
}
this.eat = function (food) { //公有方法eat
digest(food);
}
}
</script></span>
6.靜態屬性和方法
面向對象中也有靜態屬性和方法,看看JS是如何做到的
<span style="font-family:SimSun;font-size:18px;"> <!--靜態屬性和靜態方法-->
<!--構造函數本身就是對象,直接將屬性和方法添加到這個對象中,則可以到達靜態屬性和靜態方法的效果-->
<script>
function People() { }
People.staticProperty = "靜態屬性"; //靜態屬性
People.staticMethod = function () { } //靜態方法
</script></span>
7.原型對象
原型對象就好像是1個對象定義的備份,當代碼援用屬性時,如果它其實不存在于對象援用中,那末就會 自動在愛原型中查找這個屬性
<span style="font-family:SimSun;font-size:18px;"> <!--原型對象-->
<!--原型對象就好像是1個對象定義的備份,當代碼援用屬性時,如果它其實不存在于對象援用中,那末就會 自動在愛原型
中查找這個屬性-->
<script>
function People(name, sex, deposit) {
this.name = name;
this.sex = sex;
var deposit = deposit; //私有屬性
this.consume = function (money) {
this.consume = function (money) {
if (deposit >= money) {
deposit -= money;
} else {
throw new Error("沒有足夠存款");
}
}
}
var _this = this;//保存當前對象到變量,_this中供私有方法使用
var digest = function (food) { //私有方法digest
_this.thew++; //匿名函數內,this指針指向會產生變化,因此程序中使用_this保存People對象援用
}
this.eat = function (food) { //公有方法eat
digest(food);
}
}
People.prototype = {
thew: 1,
changeName: function (newName) {
this.name = newName;
}
}
</script></span>
生活不易,碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈