js面向物件程式設計思想
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> </head> <body> </body> <script> //例項物件 var per1={ name:"卡卡西", age:20, sex:"男", eat:function(){ console.log("吃拉麵"); }, readBook:function(){ console.log("西遊記"); } } //呼叫系統的建構函式建立物件 var per2=new Object(); per2.name="大蛇丸"; per2.age=30; per2.sex="男"; per2.eat=function(){ console.log("吃榴蓮"); }; per2.play=function(){ console.log("玩蛇"); } //自定義建構函式 function Person(name,age,sex){ this.name=name; this.age=age; this.sex=sex; this.play=function(){ console.log("天天打遊戲"); }; } var per=new Person("小櫻",18,"女"); console.log(per.name); per.play(); //工程模式建立物件 function creatObject(name,age){ var obj=Object(); obj.name=name; obj.age=age; obj.syHi=function(){ console.log("你好"); }; return obj; } //自定義建構函式和工程模式區別 /** * 共同點:都是函式,都可以建立物件,都可以傳入引數 * 工廠: * 函式名是小寫的 * 有new * 有返回值 * new之後的物件是當前的物件 *直接呼叫函式就可以建立物件 * * 自定義建構函式: * 函式名是大寫的首字母 * 沒有new * 沒有返回值 * this是當前物件 * 通過new的方式建立物件 * **/ function Pers(name,age){ this.name=name; this.age=age; } //通過原型來新增方法,解決資料共享,節省記憶體空間 Pers.prototype.eat=function(){ console.log("吃冷盤"); } var p1=new Pers("小明",20); var p2=new Pers("小紅",30); console.log(p1.eat==p2.eat);//結果為真 </script> </html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
</body>
<script>
//例項物件
var per1={
name:"卡卡西",
age:20,
sex:"男",
eat:function(){
console.log("吃拉麵");
},
readBook:function(){
console.log("西遊記");
}
}
//呼叫系統的建構函式建立物件
var per2=new Object();
per2.name="大蛇丸";
per2.age=30;
per2.sex="男";
per2.eat=function(){
console.log("吃榴蓮");
};
per2.play=function(){
console.log("玩蛇");
}
//自定義建構函式
function Person(name,age,sex){
this.name=name;
this.age=age;
this.sex=sex;
this.play=function(){
console.log("天天打遊戲");
};
}
var per=new Person("小櫻",18,"女");
console.log(per.name);
per.play();
//工程模式建立物件
function creatObject(name,age){
var obj=Object();
obj.name=name;
obj.age=age;
obj.syHi=function(){
console.log("你好");
};
return obj;
}
//自定義建構函式和工程模式區別
/**
* 共同點:都是函式,都可以建立物件,都可以傳入引數
* 工廠:
* 函式名是小寫的
* 有new
* 有返回值
* new之後的物件是當前的物件
*直接呼叫函式就可以建立物件
*
* 自定義建構函式:
* 函式名是大寫的首字母
* 沒有new
* 沒有返回值
* this是當前物件
* 通過new的方式建立物件
* **/
function Pers(name,age){
this.name=name;
this.age=age;
}
//通過原型來新增方法,解決資料共享,節省記憶體空間
Pers.prototype.eat=function(){
console.log("吃冷盤");
}
var p1=new Pers("小明",20);
var p2=new Pers("小紅",30);
console.log(p1.eat==p2.eat);//結果為真
</script>
</html>