javascript与OOP

来源：互联网发布：jackson string 转json 编辑：程序博客网时间：2024/05/22 05:29

-----------在pet.js中：---------
//类创建模型
var Class = {
  create:function(){
           return function() {this.initialize.apply(this,arguments)};
  }
};

//模拟继承
var Extend = function(desc,src){
     for(var property in src){
          desc[property]=src[property];
    }
    return desc;
};

//动态为object添加extend方法，用来完成继承
Object.prototype.extend = function(obj){
    Extend.apply(this,[this,obj]);
    return this;
};

//宠物类
var Pet = Class.create();
//为宠物添加抽象方法
Pet.prototype={
//初始化函数，相当于构造方法
   initialize:function(name){this.name=name},
   reason:function(){
       this.受宠_reason();//相当于抽象方法，不需要任何实现，等子类去实现
  }
};

//猪类(子类)
var Pig=Class.create();
Pig.prototype=(new Pet()).extend({
  受宠_reason: function(){
       alert(this.name+ ":由于笨受到 people 的宠爱！！！");
  }
});
//狗类(子类)
var Dog=Class.create();
Dog.prototype=(new Pet()).extend({
   受宠_reason: function(){
      alert(this.name+ ":由于乖受到 people 的宠爱！！！");
}
});

----------在text.html中-------------
<HTML>
<HEAD>
<TITLE> JS_OOP </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="wade.hou">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script src="pet.js" charset="utf-8"></script>
<script language="javascript">
var pig=new Pig("猪头");
pig.reason();

var dog=new Dog("哈巴狗");
dog.reason();
alert("呵呵，你呢？");
</script>
<BODY>
</BODY>
</HTML>

javascript中面向对象的机制，挺有意思的，很有艺术感。对更好的学习js有很大的帮助。
以前项目中也用到过很多js和以及包括用jquery实现的，以前只晓得用，却不晓得原理。
这几天学习了一下javascript中的oop，解决了我好多疑问！
其实jquery的实现机制就是这样的。看下这个小例子吧，会有点感觉的！
<HTML>
<HEAD>
<TITLE> New Document </TITLE>

</HEAD>
<BODY>
<table>
  <tr><td id="txt" name="txt">HHHHHHHHHHHHHH</td></tr>
</table>
</BODY>
<script>
var hh = function (id) {
  return "string" == typeof id ? document.getElementById(id) : id;
};
alert(hh("txt").innerHTML);
</script>
</HTML>

如果想更多的了解jquery的实现机制可以看下它的源码！

我对js很感兴趣，希望朋友们有什么好的知识分享一下！