码迷,mamicode.com
首页 > 编程语言 > 详细

javaScript prototype

时间:2016-02-06 14:30:13      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:js prototype

对js对象原型的测试:

<html>
<head>
<title>
了解prototype
</title>
<script type="text/javascript">
function baseClass(){
//对象方法
this.showMsg=function(){
   console.log("baseClass::showMsg");
}
}

function extendClass(){
//对象方法
  this.upd=function(){
  console.log("this.upd");
  }
}

extendClass.prototype=new baseClass();   //克隆base到extendClass,此时extendClass已经含有方法showMsg
extendClass.prototype.updFun=function(){
  console.log("updFun is called");
}    //在extendClass添加原型方法updFun,和在extendClass加一个此方法一样,主要区别是这样可以添加方法,而不修改原本的类,而且这个又可以当成类方法,可以直接调用

//类方法
extendClass.updClass=function(args){
    console.log("updClass");  
}

//原型方法,但对应的是一个json,当extendClass初始化的时候,会调用baseas的匿名方法
extendClass.prototype.updd={
  baseas:(function(args){
     //args即是window
    console.log("has in based");
	console.log(args);
  })(window),
    //非匿名方法,不会主动调用,如何调用还不知道
  base2:function(args){
    console.log("has in badsed2222");
	console.log(args);
  }
}
var instance=new extendClass();
extendClass.prototype.updFun();
//不能写成instance.updClass,对象上没有该方法,和原型方法区别比较明显
extendClass.updClass();
//调用对象方法
instance.showMsg();
//调用原型方法,和extendClass.prototype.updFun()一样
instance.updFun();
//调用upd方法
instance[‘upd‘].call();
//如果有xbig,则使用,否则就是{}
 var xbig= xbig||{};
console.log("xbig:"+JSON.stringify(xbig));  //xbig:{}
//给xbig的ins赋值json串,fb对应的是方法
 xbig.ins={fa:"1",fb:function(){
 console.log("fb");
}}
 xbig.ins.module= {upd:function(args){
  //call的第一个参数为this,第二个参数是args,在这个方法内部,可以操作this,如果是一个节点,则可以修改节点的值
   console.log(this);
   console.log("I`d like to do");
   console.log("args:"+args);
}};
xbig.ins.module[‘upd‘].call({a:1},"somesthing1");
var xbig2= xbig||{};    
console.log("xbig2:"+JSON.stringify(xbig2));  //xbig2:{"ins":{"fa":"1","module":{}}}
xbig2.ins.module[‘upd‘].call(instance,"somesthing2");
</script>
</head>
<body>
<h1>prototype到底是什么意思1</h1>
</body>
</html>


javaScript prototype

标签:js prototype

原文地址:http://lj3331.blog.51cto.com/5679179/1741302

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!