javascript中类和继承（代码示例+prototype.js）

最新推荐文章于 2024-03-10 07:30:00 发布

我来过我存在

最新推荐文章于 2024-03-10 07:30:00 发布

阅读量109

点赞数

分类专栏： web前端文章标签： prototype JavaScript QQ ViewUI

web前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<html>
 <head>
  <title> New Document </title> 
    <script src="js/prototype.js" type="text/javascript"></script>
 </head>
 <script tupe="text/javascript">
//javascript中自带的创建类的方法   用这种方法是不可引用 prototype.js否则会冲突
var People=function(){
     this.name="";        //属性
     this.getName=function(){
       return "主人给我取名字了，我叫"+this.name+"。主人你希望我是个美女还是帅哥啊？";   //方法
     }
     this.say=function(){
        return "主人你好！我是你的机器人，编号为:"+Person.getNum()+".给我取个名字吧" 
     }
     this.sex="man"
     this.getSex=function(){
        return "我是一个"+this.sex;
     }     
}
People.num=0;      //静态属性
People.getNum=function(){          //静态方法
   People.num=People.num+1;    //用People或this都可
   return People.num;
}


//利用prototype.js来创建类
var Person = Class.create();    //通过Class.create方法创建空类    
//添加非静态属性和方法
/**方法一：*/
Person.prototype = {               //把方法定义到prototype中，注意，是通过initalize方法初始化类的属性    
   name:"name",
  initialize: function(name) {      //这是构造函数，必须实现且为非静态
    alert("正在初始有参数对象对象……")
    this.name = name;     
  },     
  say: function(message) {     
    return this.name + ': ' + message;     
  }     
}; 
/**方法二：
Object.extend(Person.prototype,{
    initialize: function() {   
	    alert("正在初始无参数对象……")
    
    },  
    email:"lkujhn@qq.com",
	getEmail:function (){
	    return this.email
	}
})
*/
//添加静态属性和方法
//方法一：
Object.extend(Person, {                          //扩展一些静态属性, 方法     
    qq : "103430585",   
    getQq : function(){return this.qq;}   
}); 
/**方法二：
Person.num=0;
Person.getNum=function() {
   Person.num=Person.num+1;   //用this.num也可
   return this.name+":"+Person.num;
}
*/

//继承
var PersonSon=Class.create();

//初始化子类，如不初始化，将无法创建新对象（当子类的非静态方法继承了父类的非静态的方法时，构造函数也继承，因此可不初始化）
/**
Object.extend(PersonSon.prototype,{
   name:"personson",
   initialize:function(name){
       this.name=name;
       alert(this.name+"初始子类PersonSon………………")
   }
})
**/
//继承形式1：（静态）继承父类的静态方法 ,继承后子类的该方法、属性依然是静态   
Object.extend(PersonSon,Person);
//继承形式2：（非静态）继承父类的静态方法，继承后子类的该方法、属性为非静态
Object.extend(PersonSon.prototype,Person);
//继承形式3：（静态）继承父类的非静态方法，继承后子类的该方法、属性为静态
Object.extend(PersonSon,Person.prototype)
//继承形式4：（非静态）继承父类的非静态方法，继承后子类的该方法、属性为非静态
Object.extend(PersonSon.prototype,Person.prototype)    //继承后子类的构造函数会被父类覆盖


function ceshi(){

    var pp=new People();   //创建对象
     //p.getNum()  //调用错误
     alert(People.getNum())     //调用静态方法
     t(p.say());     //调用普通方法
     pp.name="test"                //改变对象的属性
     alert(pp.getName());
     alert(pp.getSex());


/**
	var p=new Person("lj");   //创建对象
	//调用非静态方法
	alert(p.say("你好"));
    alert(p.getEmail());
	//调用静态方法
    alert(Person.getQq());  
	alert(Person.getNum());   //静态方法中无法访问非静态属性,此方法中的this.name是为undefined
*/


	var ps=new PersonSon("ljson");//创建子类

    alert("调用的子类静态方法继承父类的静态方法："+PersonSon.getQq());

	alert("调用的子类非静态方法继承父类的静态方法："+ps.getQq());

    alert("调用的子类静态方法继承父类的非静态方法："+PersonSon.say("子类静态方法"));

	alert("调用的子类非静态方法继承父类的非静态方法："+ps.say("子类非静态方法"));

	alert("非静态属性(父类中该属性为静态)："+ps.qq);

	alert("静态属性(父类中该属性为静态)：" +PersonSon.qq)

	alert("非静态属性(父类中该属性为非静态)：" +ps.name)    

	alert("静态属性(父类中该属性为非静态)：" +PersonSon.name)    
}

</script>


 <body>
  <input type="button" value="机器人" οnclick="ceshi()"/>
 </body>
</html>

我来过我存在

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript中类和继承（代码示例+prototype.js）

&lt;html&gt; &lt;head&gt; &lt;title&gt; New Document &lt;/title&gt; &lt;script src="js/prototype.js" type="text/javascript"&gt;&lt;/script&gt; &lt;/head&gt; &lt;
复制链接

扫一扫

专栏目录