随笔- 23 文章- 1 评论- 5 阅读- 10413

javascript类式继承模式#2——借用构造函数

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <title>类式继承模式#2——借用构造函数</title>
 6 </head>
 7 
 8 <body>
 9 <script type="text/javascript">
10 
11     function Article(){
12         this.tags=['js','ajax'];
13     };
14     
15     Article.prototype.say=function(){return this.tags;}
16     
17 /***************************************/
18     var article=new Article();
19 
20     function BlogPost(){};
21     
22     BlogPost.prototype=article;
23     BlogPost.prototype.say=111;
24     
25     var blog=new BlogPost();
26 
27     function StaticPage(){
28         Article.call(this);
29     };
30     StaticPage.prototype={
31         x:100,
32         y:function(){
33             return this.x;
34         }
35     }
36     
37 var page = new StaticPage();
38 
39 
40 //BlogPost的原型继承了new Article（），即使在BlogPost.prototype上添加属性方法，事实上还是给Article构造函数添加属性方法
41 console.log(blog);
42 
43 //将父类Article中的方法属性继承过来，其实就是拷贝过来，占为己有，并且可以覆盖父类中的属性方法，但并没有将父类的原型链拷贝过来；
44 console.log(page);
45 
46 //构造函数模式缺点：调用父构造函数的原型,子构造函数能获取到父构造函数的属性和方法，但却未继承父构造函数的原型，即父构造函数__proto__所保存的链接没有继承给子构造函数。
47 
48 //构造函数模式优点：可以复制父构造函数的属性和方法，并不会出现子构造函数覆盖父构造函数的意外风险，能实现多重继承，可以父子构造函数之间传递参数。
49 
50 
51 </script>
52 </body>
53 </html>