Javascript是一种基于对象(object-based)的语言,
你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class(类)。
但是ES6新增了类这个概念。
一、 生成实例对象的原始模式
假定我们把花看成一个对象,它有"名字"和"产地"两个属性。
创建一个对象有两种方法:
<script type="text/javascript">
var flower=new Object();
flower .name="牡丹";
flower.area="洛阳";
flower.showName=function () {
alert(flower.name);
};
</script>
var flower={ name:"牡丹", area:"洛阳花会", flower:showName=function () { alert(flower.name); } }; //调度函数 flower.showName();</script>
二、 原始模式的改进
我们可以写一个函数,解决代码重复的问题。
<script type="text/javascript">
function Flower(name,area){
this.name=name;
this.area=area;
this.showName=function(){
alter(this.name);
};
; }
//创建一个flower对象
var f1=new Flower("红牡丹","洛阳白马寺");
f1.showName();
var f2=new Flower("红牡丹","洛阳白马寺");
f2.showName();
</script>
这种方法的问题依然是,f1和f2之间没有内在的联系,不能反映出它们是同一个原型对象的实例。
用一个方法将他们的共同方法提出:
<script type="text/javascript">
function Flower(name,area){
this.name=name;
this.area=area;
this.showName=myName;
}
//全局对象
function myName(){
alter(this.name);
};
//创建一个flower对象
var f1=new Flower("红牡丹","洛阳白马寺");
f1.showName();
var f2=new Flower("红牡丹","洛阳白马寺");
f2.showName();
</script>
但是,这种方法对服务器的负担较重
<script type="text/javascript">
function Flower(){
//空模板
}
Flower.prototype.name="牡丹花";
Flower.prototype.area="洛阳白马寺、龙门石窟";
Flower.prototype.showName=function(){
alert(this.name);
};
var flag=Flower.prototype.constructor==Flower;
alert(flag);
var flower1=new Flower();
flower1.showName();
if(flower._proto_==Flower.prototype){
alert("==========");
}
</script>
还有一种
<script type="text/javascript">
function Humens(){
return this.foot;
}
//关于Humens的一个原型上的方法,获取到foot
Humens.prototype.getFoot=function(){
return this.foot;
};
//写一个子类
function Man(){
this.head=1;
}
Man.prototype=new Humens();
Man.prototype.getHead=function(){
return this.head;
};
var man1=new Man();
alert(man1,foot);
</script>
接下来模拟一下java中的类和对象
<script type="text/javascript">
function Humens(){
this.sport=["basketball","football","pingpong-ball"];
}
function Man(){
Humens.call(this);
}
Man.prototype=new Humens();
var man1=new Man();
man1.sport.push("baseball");
alert(man1.sport);
var man2=new Man();
alert(man2.sport);
</script>