js中面向對象和純面嚮對象語言中的對象是不同的, js中的對象是: 無序屬性的集合, 其屬性可以包含基本值 ,對象或者函數.
js可以像java一樣寫代碼, 能夠面向對象編程. 在js中 每一個function其實就是個對象. 可以基於Object對象創建, 還可以基於對象字面量方式
一 基於函數創建對象
1. 定義對象
function Load(){
console.log('我是一個方法也是一個對象 我叫: Load');
}
console.log('---產生一個對象---');
var obj = new Load();
上面的程序 在瀏覽器運行之後在控制檯會顯示出來結果是:
—產生一個對象—
我是一個方法也是一個對象 我叫: Load
2. 給對象添加實例方法和屬性
使用 prototype原型關鍵字添加的是公共的,可以理解是pubic類型的
格式:有點像json的感覺, 注: 參數列表 直接 寫變量名 如 aa 不要加var 如var aa 這樣就錯了.
對象名稱.prototype = {
屬性名 : 屬性值,
方法名 : function(參數列表) {
方法體;
}
}
Load.prototype = {
sex:'女',
address:'河南新鄉',
fun1:function(){
console.log('這個fun1是Load對象的公共方法');
}
};
console.log('---輸出類的公共的方法和屬性---');
obj.fun1();
console.log('obj 中 sex 是: ' + obj.sex + '; obj 中 address 是: '+ obj.address);
結果是:
—輸出類的公共的方法和屬性—
這個fun1是Load對象的公共方法
obj 中 sex 是: 女; obj 中 address 是: 河南新鄉
3. 給對象添加靜態方法和屬性
直接使用類名定義, 必須用類名調用 使用對象調用會報錯
//添加靜態屬性和方法
Load.staticName = 'load name is wangming staic';
Load.static1 = function(){
console.log('this is load method static')
};
console.log('---輸出Load類的靜態方法和靜態屬性, 和java相似,必須用類名調用---');
console.log(Load.staticName);
Load.static1();
結果:
—輸出Load類的靜態方法和靜態屬性, 和java相似,必須用類名調用—
object.html:43 load name is wangming staic
object.html:35 this is load method static
4. 對象添加私有屬性和方法
直接在對象定義的屬性和方法就是私有的.
function Load(){
console.log('我是一個方法也是一個對象 我叫: Load');
//添加私有的屬性和方法
var privateProto = '我是一個Load中的私有的屬性';
this.publicFun1 = function(){ //對外提供共有的方法,可用於輸出對象中的私有屬性值
console.log('對象Load的私有屬性privateProto 是: ' + privateProto);
};
function privateFun2(){
console.log('我是Load中的第二個私有的方法 我叫 privateFun2');
}
privateFun2(); //私有屬性
}
console.log('---輸出類的私有的方法和屬性---');
obj.publicFun1();
//obj.privateFun2(); //不能調用私有的方法 js會提示錯誤
console.log(obj.privateProto); //不能調用私有的成員屬性 所以是爲: undefined
結果是:
—輸出類的私有的方法和屬性—
對象Load的私有屬性privateProto 是: 我是一個Load中的私有的屬性
undefined
全部的代碼爲
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<script type="text/javascript">
//Load方法也可以是對象
function Load(){
console.log('我是一個方法也是一個對象 我叫: Load');
//添加私有的屬性和方法
var privateProto = '我是一個Load中的私有的屬性';
this.publicFun1 = function(){ //對外提供共有的方法,可用於輸出對象中的私有屬性值
console.log('對象Load的私有屬性privateProto 是: ' + privateProto);
};
function privateFun2(){
console.log('我是Load中的第二個私有的方法 我叫 privateFun2');
}
privateFun2(); //私有屬性
}
//給對象添加實例方法和屬性 使用 prototype原型關鍵字
Load.prototype = {
sex:'女',
address:'河南新鄉',
fun1:function(){
console.log('這個fun1是Load對象的公共方法');
}
};
//添加靜態屬性和方法
Load.staticName = 'load name is wangming staic';
Load.static1 = function(){
console.log('this is load method static')
};
//測試方法
function test(){
console.log('---產生一個對象---');
var obj = new Load();
console.log('---輸出Load類的靜態方法和靜態屬性, 和java相似,必須用類名調用---');
console.log(Load.staticName);
Load.static1();
console.log('---輸出類的公共的方法和屬性---');
obj.fun1();
console.log('obj 中 sex 是: ' + obj.sex + '; obj 中 address 是: '+ obj.address);
console.log('---輸出類的私有的方法和屬性---');
obj.publicFun1();
// obj.privateFun2(); //不能調用私有的方法 js會提示錯誤
console.log(obj.privateProto); //不能調用私有的成員屬性 所以是爲: undefined
}
window.onload = test();
</script>
</body>
</html>
注: 打開瀏覽器的控制檯, 按F12鍵
二 基於Object對象
var person = new Object();
person.name = 'My Name';
person.age = 18;
person.getName = function(){
return this.name;
};
console.log(person.getName()); //My Name
console.log(person.age); //18
console.log(person.name); //My Name
三 基於對象字面量方式(比較清楚的查找對象包含的屬性及方法)
var person = {
name : 'My name',
age : 18,
getName : function(){
return this.name;
}
}
以上三種方式 都可以使用 ‘.’ 操作符來動態的添加屬性, 可以使用delete操作符將屬性設置爲 undefined 來刪除屬性
person.newAtt= 'new Attr';//添加屬性
console.log(person.newAtt);//new Attr
delete person.age;
console.log(person.age);//undefined(刪除屬性後值爲undefined);
參考 http://www.cnblogs.com/gaojun/archive/2013/10/24/3386552.html
參考 http://www.cnblogs.com/keke/archive/2010/08/17/1801363.html