初识JavaScriptOOP(js面向对象)
Posted 会飞的豆子
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了初识JavaScriptOOP(js面向对象)相关的知识,希望对你有一定的参考价值。
初识javascriptOOP(js面向对象)
Javascript是一种基于对象(object-based)的语言,
你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有class
(类)。
一、 生成实例对象的原始模式
假定我们把花看成一个对象,它有"名字"和"产地"两个属性。
创建一个对象有两种方法:
01.
<script type="text/javascript"> var flower=new Object(); flower .name="牡丹"; flower.area="洛阳"; flower.showName=function () { alert(flower.name); }; </script>
02.
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>
以上是关于初识JavaScriptOOP(js面向对象)的主要内容,如果未能解决你的问题,请参考以下文章