javascript继承笔记
//原型(prototype):原型是一个对象,其他对象可以通过它实现属性继承
/*笔记:
* 1.类式继承:通过原型链继承的方式
* 2.原型式继承:对类式继承的封装
* 3.寄生式继承:对原型继承的二次封装,并且在第二次封装过程中对继承的对象进行扩展
* 4.构造函数式继承:通过构造函数继承的方式
* 5.寄生组合式继承:寄生式继承融合构造函数式继承的优点去除缺点的方式
* 6.组合式继承(类式继承+构造函数式继承 两者优点相加)
*/
//原型式继承
function inheritobject(o){
//声明一个过渡函数对象
function F(){
}
//过渡原型对象继承父对象
F.prototype=o;
//返回过渡对象的一个实列,该实例的原型继承了父对象
return new F();
}
var book={
name:"jsbook",
alikeBook:['css book',"html book"],
};
//寄生式继承(对原型继承的第二次封装,并且在第二次封装过程中对继承的对象进行了扩展)
//声明基对象
function createBook(obj){
//通过原型继承方式创建新对象
var o = new inheritobject(obj);
//扩展新对象
o.getName=function(){
console.log(this.name);
}
//返回扩展后的对象
return o;
}
/*
*寄生式继承 继承原型
* 传递参数subclass 子类
* 传递参数superclass 父类
* */
function inheritPrototype(subclass,superclass){
//复制一份父类的原型副本保存在变量中
var p=inheritobject(superclass.prototype);
//修正因为重写子类原型导致子类的constructor属性被修改
p.constructor=subclass;
//设置子类原型
subclass.prototype=p;
}
//定义父类
function superclass(name){
this.name = name;
this.colors=["red","blue","green"];
}
//定义父类原型方法
superclass.prototype.getName=function(){
console.log(this.name);
}
//定义子类
function subclass(name,time){
//构造函数式继承
superclass.call(this,name);
//子类新增属性
this.time=time;
}
//寄生式继承父类原型
inheritPrototype(subclass,superclass);
//子类新增原型方法
subclass.prototype.getTime = function(){
console.log(this.time);
}
//单继承 extend 属性复制
var extend=function(target,source){
//遍历源对象中的属性
for(var property in source){
//将源对象中的属性复制到目标对象中
target[property]=source[property];
}
return target;
}
//多继承 属性复制 可以绑定到原生对象object上
Object.prototype.mix=function(){
var i=0,//从第一个参数起为被继承的对象
len=arguments.length,//arguments相当于多个传递参数的集合,非常类似数组
//target=arguments[0];//第一个传入参数为目标对象
arg; //缓存参数对象
//遍历被继承的对象
for(; i<len;i++){
//缓存当前对象
arg=arguments[i];
for(var property in arg){
//将被继承对象中的属性复制到目标对象中
this[property]=arg[property];
}
}
}
//测试单继承
var b1={
name:'javascript 设计模式',
alike:['css','html','javascript']
}
var b2={
color:'blue'
}
extend(b2,b1);
console.log("单继承测试:"+b2.name+"-"+b2.alike+"-"+b2.color);
/*寄生组合式继承测试 begin*/
console.log("寄生组合式继承测试");
var instance1=new subclass("js book",2014);
var instance2=new subclass("css book",2013);
instance1.colors.push("black");
console.log(instance1.colors);
console.log(instance2.colors);
instance1.getName();
instance1.getTime();
instance2.getName();
instance2.getTime();
/*寄生组合式继承测试 end*/
/*寄生式继承测试 begin*/
console.log("寄生式继承测试");
var newBook=createBook(book);
newBook.name="ajax book";
newBook.alikeBook.push("xml book");
var otherBook=createBook(book);
otherBook.name="flash book";
otherBook.alikeBook.push("as book");
console.log(newBook.name);
console.log(newBook.alikeBook);
newBook.getName();//对对象进行了二次封装,并进行了扩展
console.log(otherBook.name);
console.log(otherBook.alikeBook);
otherBook.getName();
/*寄生式继承测试 end*/
/*json对象 测试*/
console.log(book.name+":"+book.alikeBook);
//测试多继承
otherBook.mix(b1,b2);
console.log(otherBook);
javascript继承笔记的更多相关文章
- Java程序猿JavaScript学习笔记(2——复制和继承财产)
计划和完成在这个例子中,音符的以下序列: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaSc ...
- 【读书笔记】javascript 继承
在JavaScript中继承不像C#那么直接,C#中子类继承父类之后马上获得了父类的属性和方法,但JavaScript需要分步进行. 让Brid 继承 Animal,并扩展自己fly的方法. func ...
- JS学习笔记——JavaScript继承的6种方法(原型链、借用构造函数、组合、原型式、寄生式、寄生组合式)
JavaScript继承的6种方法 1,原型链继承 2,借用构造函数继承 3,组合继承(原型+借用构造) 4,原型式继承 5,寄生式继承 6,寄生组合式继承 1.原型链继承. <script t ...
- javascript继承机制的设计思想(ryf)
我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...
- Java程序猿的JavaScript学习笔记(汇总文件夹)
最终完结了,历时半个月. 内容包含: JavaScript面向对象特性分析,JavaScript高手必经之路. jQuery源代码级解析. jQuery EasyUI源代码级解析. Java程序猿的J ...
- Java程序猿的JavaScript学习笔记(8——jQuery选择器)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- 转:Javascript继承机制的设计思想
我一直很难理解Javascript语言的继承机制. 它没有"子类"和"父类"的概念,也没有"类"(class)和"实例" ...
- Java程序猿的JavaScript学习笔记(3——this/call/apply)
计划按例如以下顺序完毕这篇笔记: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScript ...
- Java程序猿JavaScript学习笔记(4——关闭/getter/setter)
计划和完成这个例子中,音符的顺序如下: Java程序猿的JavaScript学习笔记(1--理念) Java程序猿的JavaScript学习笔记(2--属性复制和继承) Java程序猿的JavaScr ...
随机推荐
- Hadoop2.2.0安装过程记录
1 安装环境1.1 客户端1.2 服务端1.3 安装准备 2 操作系统安装2.1.1 BIOS打开虚拟化支持2.1.2 关闭防火墙2.1.3 安装 ...
- ASP.NET MVC Model绑定(五)
ASP.NET MVC Model绑定(五) 前言 前面的篇幅对于IValueProvider的获取位置和所处的生成过程做了讲解,本篇将会对IValueProvider的使用做个基础的示例讲解,读完本 ...
- CSharpGL(19)用glReadPixels把渲染的内容保存为PNG图片(C#)
CSharpGL(19)用glReadPixels把渲染的内容保存为PNG图片(C#) 效果图 本文解决了将OpenGL渲染出来的内容保存到PNG图片的方法. 下载 CSharpGL已在GitHub开 ...
- CI Weekly #6 | 再谈 Docker / CI / CD 实践经验
CI Weekly 围绕『 软件工程效率提升』 进行一系列技术内容分享,包括国内外持续集成.持续交付,持续部署.自动化测试. DevOps 等实践教程.工具与资源,以及一些工程师文化相关的程序员 Ti ...
- 解决“Dynamic Web Module 3.0 requires Java 1.6 or newer.”错误
一.问题描述 1.错误截图如下. 2.设计的问题 在Eclipse中新建了一个Maven工程, 然后更改JDK版本为1.6, 结果每次使用Maven > Update project的时候JDK ...
- ASP.NET MVC5+EF6+EasyUI 后台管理系统(54)-工作流设计-所有流程监控
系列目录 先补充一个平面化登陆页面代码,自己更换喜欢的颜色背景 @using Apps.Common; @{ Layout = null; } <!DOCTYPE html> <ht ...
- 细说Promise
一.前言 JavaScript是单线程的,固,一次只能执行一个任务,当有一个任务耗时很长时,后面的任务就必须等待.那么,有什么办法,可以解决这类问题呢?(抛开WebWorker不谈),那就是让代码异步 ...
- 基於tiny4412的Linux內核移植--- 中斷和GPIO學習(1)
作者 彭東林 pengdonglin137@163.com 平臺 tiny4412 ADK Linux-4.4.4 u-boot使用的U-Boot 2010.12,是友善自帶的,爲支持設備樹和uIma ...
- 【Big Data】HADOOP集群的配置(二)
Hadoop集群的配置(二) 摘要: hadoop集群配置系列文档,是笔者在实验室真机环境实验后整理而得.以便随后工作所需,做以知识整理,另则与博客园朋友分享实验成果,因为笔者在学习初期,也遇到不少问 ...
- 安卓Design包之TabLayout控件的简单使用
Google在2015的IO大会上,给我们带来了更加详细的Material Design设计规范,同时,也给我们带来了全新的Android Design Support Library,在这个supp ...