博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
JavaScript模式读书笔记 第6章 代码复用模式
阅读量:5084 次
发布时间:2019-06-13

本文共 2379 字,大约阅读时间需要 7 分钟。

主要使用代码继承来完成复用。
1,使用类式继承。
    -1,类式继承:按照类的方式来实现继承,即所谓的类式。
    -2,类式继承:通过构造函数(child)获取来自parent的属性,从而创建对象。
  
 
<script>
//parent
function Parent(name){
this.name = name || 'Adam';
}
Parent.prototype.say = function(){
 
return this.name;
}
//child
function Child(name){
 
}
//此处实现继承,需要自己实现
inherit(Child, Parent);
 
  </script>
    -3,默认模式
 
 
//默认模式
function inherit(C, P){
C.prototype = new P();
}
 
var kid = new Child();
console.log(kid.say());//输出Adam
    -4,借用构造函数
    
    借用父类构造函数,它传递子对象以绑定到this,并且还转发任意参数。
 
<script>
//父构造函数
function Article(){
this.tags = ['js', 'css'];
}
var article = new Article();
 
function BlogPost(){
 
}
BlogPost.prototype = article;//获取到对应对象的一个引用
var blog = new BlogPost();
 
function StaticPost(){
Article.call(this);//获取到对应对象成员的副本,相当于在本对象中生成同样的一个成员变量
}
var page = new StaticPost();
console.log(article.hasOwnProperty('tags'));//true
console.log(blog.hasOwnProperty('tags'));//false
console.log(page.hasOwnProperty('tags'));//true
 
  </script>
    -5,借用和设置原型
     
 
<script>
function Child(a, b, c, d){
Parent.apply(this, arguments);//通过借用获取到父类的成员变量
}
 
Child.prototype = new Parent();//通过此处获父类的方法
 
  </script>
  
 
<script>
function Parent(name){
this.name = name || "Tom";
}
Parent.prototype.say = function(){
return this.name;
}
function Child(name){
Parent.apply(this, arguments);
}
 
Child.prototype = new Parent();
 
var kid = new Child("Child");
console.log(kid.name);//child
console.log(kid.say());//child
delete kid.name;
console.log(kid.say());//Tom
 
  </script>
    -6,共享原型
 
function inherit(C, P){
C.prototype = P.prototype;
}
如果继承链下方的某个子类修改原型,那么会影响到所有原型链上的对象。
    -7,临时构造函数
 
function inherit(C, P){
 
var F = function(){};
F.prototype = P.prototype;
C.prototype = new F();
}
    -8,Klass
       a. 都有一套关于如何命名类方法的公约。
    
    b. 存在从其他类所继承的类。
    
    c.在子类中可以访问父类或超类。
 
 <script>
var klass = function(Parent, props){
var Child, F, i;
 
//1. 新构造函数
Child = function(){
if(Child.uber && Child.uber.hasOwnProperty("_construct")){
Child.uber._construct.apply(this, arguments);
}
 
if(Child.prototype.hasOwnProperty("_construct")){
Child.prototype._construct.apply(this, arguments);
}
};
 
//2. 继承
Parent = Parent || Object;
F = function(){};
 
F.prototype = Parent.prototype;
Child.prototype = new Child();
Child.uber = Parent.prototype;
Child.prototype.constructor = Child;
 
//3.添加实现方法
for(i in props){
if(props.hasOwnProperty(i)){
Child.prototype[i]= props[i];
}
}
 
return Child;
 
};
 
  </script>
代码复用才是目的,继承只是实现这一目标的方法之一。

转载于:https://www.cnblogs.com/jingLongJun/p/4491077.html

你可能感兴趣的文章
Unity3D研究院之打开Activity与调用JAVA代码传递参数(十八)【转】
查看>>
python asyncio 异步实现mongodb数据转xls文件
查看>>
TestNG入门
查看>>
【ul开发攻略】HTML5/CSS3菜单代码 阴影+发光+圆角
查看>>
IOS-图片操作集合
查看>>
IO—》Properties类&序列化流与反序列化流
查看>>
测试计划
查看>>
Mysql与Oracle 的对比
查看>>
jquery实现限制textarea输入字数
查看>>
Codeforces 719B Anatoly and Cockroaches
查看>>
jenkins常用插件汇总
查看>>
c# 泛型+反射
查看>>
第九章 前后查找
查看>>
Python学习资料
查看>>
jQuery 自定义函数
查看>>
jquery datagrid 后台获取datatable处理成正确的json字符串
查看>>
ActiveMQ与spring整合
查看>>
web服务器
查看>>
第一阶段冲刺06
查看>>
EOS生产区块:解析插件producer_plugin
查看>>