文档章节

javascript继承实现

指尖残雪
 指尖残雪
发布于 2016/05/22 23:56
字数 377
阅读 1
收藏 0
点赞 2
评论 0

使用javascript写自己的继承方法,主要用到javascript原型和构造方法方面的知识。


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
		<title>使用javascript实现继承</title>
		<script type="text/javascript" charset="GBK">
			//sub是子类,sup是父类
			function extend(sub,sup){
				// 目的: 实现只继承父类的原型对象
				var F = new Function();// 1 创建一个空函数    目的:空函数进行中转
				F.prototype = sup.prototype;// 2 实现空函数的原型对象和超类的原型对象转换
				sub.prototype = new F(); // 3 原型继承 
				sub.prototype.constructor = sub;//4还原子类的构造器
				//保存一下父类的原型对象: 一方面方便解耦  另一方面方便获得父类的原型对象
				sub.superClass = sup.prototype;//自定义一个子类的静态属性 接受父类的原型对象
				//判断父类的原型对象的构造器 (加保险)
				if(sup.prototype.constructor == Object.prototype.constructor ){
					sup.prototype.constructor = sup;
				}
			}
			//应用举例
			//父类
			function Person(name , age){
				this.name = name;
				this.age = age;
			};
			Person.prototype = {
				constructor:Person,
				sayHello:function(){
					alert("Hello world");
				}
			};			
			//子类
			function Boy(name,age,sex){
				//call 绑定父类的模版函数 实现 借用构造函数继承 只复制了父类的模版
				Boy.superClass.constructor.call(this,name,age);
				this.sex = sex;
			};
			//原型继承的方式: 即继承了父类的模版 又继承了父类的原型对象
			//Boy.prototype = new Person();
			// 只继承一遍父类的原型对象
			extend(Boy , Person);
			
			Boy.prototype.sayHello = function(){
				alert('hi javascript!');
			}
			var b = new Boy('张三' , 20 , '男');
			alert(b.name); 
			alert(b.sex);
			b.sayHello();
			Boy.superClass.sayHello.call(b);//父类的方法
				
		</script>
	</head>
	<body>
	</body>
</html>


本文转载自:http://blog.csdn.net/bq1073100909/article/details/49592683

共有 人打赏支持
指尖残雪
粉丝 7
博文 73
码字总数 0
作品 0
上海
后端工程师
浅谈JavaScript中的继承

近期,公司的业务处于上升期,对人才的需求似乎比以往任何时候都多。作为公司的前端,有幸窥探到了公司的前端面试题目,其中有一题大概是这样的(别激动,题目已经改了) 请用你自己的方式来...

lanzhiheng ⋅ 05/29 ⋅ 0

Lynx技术分析-JS引擎扩展设计

JS Binding 技术 Lynx(一个高效的跨平台框架) 的 JS Binding 技术最主要的目的是搭建一个高效的与 JS 引擎解耦的通信桥梁,同时具备 JS 引擎切换的能力。该技术经历了多次迭代,最终通过抽...

hxxft ⋅ 05/15 ⋅ 0

面向对象,更适合JavaScript

面向对象程序设计是软件开发中一个很庞大很复杂的话题,它并不是仅仅学会类、继承、封装、多态这些面向对象编程语法元素就表示掌握的,这些语法元素只是实现面向对象程序的工具, 就像砖块、...

陈宏鸿 ⋅ 05/07 ⋅ 0

JavaScript核心概念归纳整理

原文出处: 熊俊漉 JavaScript语言本身是一个庞大而复杂的知识体系,复杂程度不低于任何一门后端语言,本文针对JavaScript语言的核心概念进行简单的梳理,对应的每个知识点仅仅点到为止,不作...

音乐宇Code ⋅ 05/27 ⋅ 0

React Native通信原理源码分析一

小伙伴们都知道在Android开发中实现Java和JS的通信可以通过WebView来实现,包括注册JSBridge或者在接口中拦截都可以。然而React Native中并没有用WebView控件的方式,而是基于WebKit内核的方...

juexingzhe ⋅ 04/08 ⋅ 0

javascript面向对象中继承实现?

javascript面向对象中继承实现? 面向对象的基本特征有:封闭、继承、多态。 在JavaScript中实现继承的方法: 1. 原型链(prototype chaining) 2. call()/apply() 3. 混合方式(prototype和c...

lslaiwy ⋅ 06/05 ⋅ 0

JS高级之面试必须知道的几个点

深圳市人人聚财招前端啦 ~~~ 招前端,招前端,招前端,欢迎扫描加群,砸简历过来: 前言 这段时间突然发现JS原生好多东西都忘记了,但有些东西确实很重要,所以又重新再梳理一次。主要有函数的...

小小小 ⋅ 06/08 ⋅ 0

JS进阶(3):人人都能懂的继承

在上一篇文章中,我们主要介绍了 JavaScript 中原型对象的概念。这篇文章我们来聊一聊 JavaScript 中的继承。 一、继承的基本概念 相对于 JavaScript 来说,在其他一些面向对象的编程语言中,...

pantone44 ⋅ 05/09 ⋅ 0

全面解析JavaScript的对象创建和继承

阿里巴巴前端工程师逸翾对JavaScript中的对象进行了详细讲解。首先从理解对象谈起,说明了对象中的两个关键点key和prototype,其次介绍了对创建对象的三种方式,包括字面量、构造函数、Objec...

云迹九州 ⋅ 04/28 ⋅ 0

由js数组类型判断触发的浪漫思绪

一、前言 众所周知,js是门“动态”、“弱类型”编程语言,这意味着在js中可以很任性的定义变量,任性的同时也意味着需常在开发中对变量做类型判断,曾几何时,对数组变量的类型的判断是件很...

hanmin ⋅ 06/08 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

linux 安装docker

通过以下命令下载安装docker wget -qO- https://get.docker.com | sh 执行以上命令后输出以下内容说明安装成功,注意红框中的内容,docker安装成功后默认只有root能使用,红框中给出的提示是...

haoyuehong ⋅ 4分钟前 ⋅ 0

482. License Key Formatting - LeetCode

Question 482. License Key Formatting Solution 思路:字符串转化为char数组,从后遍历,如果是大写字母就转化为小写字母,如果是-就忽略,如果遍历了k个字符(排除-)就追加一个-。 Java实现...

yysue ⋅ 23分钟前 ⋅ 0

聊聊spring cloud gateway的LoadBalancerClientFilter

序 本文主要研究一下spring cloud gateway的LoadBalancerClientFilter GatewayLoadBalancerClientAutoConfiguration spring-cloud-gateway-core-2.0.0.RELEASE-sources.jar!/org/springfram......

go4it ⋅ 47分钟前 ⋅ 0

详解:Nginx反代实现Kibana登录认证功能

Kibana 5.5 版后,已不支持认证功能,也就是说,直接打开页面就能管理,想想都不安全,不过官方提供了 X-Pack 认证,但有时间限制。毕竟X-Pack是商业版。 下面我将操作如何使用Nginx反向代理...

问题终结者 ⋅ 54分钟前 ⋅ 0

002、nginx配置虚拟主机

一、nginx配置虚拟主机可分为三种方式,分别为: 1、基于域名的虚拟主机,通过域名来区分虚拟主机——应用:外部网站 2、基于端口的虚拟主机,通过端口来区分虚拟主机——应用:公司内部网站...

北岩 ⋅ 57分钟前 ⋅ 0

shell脚本之死循环写法

最近在学习写shell脚本,在练习if while等流程控制时,突然它们的死循环写法是怎么样的?经过百度与亲测记录如下: for死循环 #! /bin/bashfor ((;;));do date sleep 1d...

hensemlee ⋅ 59分钟前 ⋅ 0

苹果的ARKit2.0有多可怕,看了就知道

序言 ARKit主要由三部分组成: 跟踪(Tracking) 跟踪是ARKit的核心组件之一,其提供了设备在物理世界中的位置与方向信息,并对物体进行跟踪,如人脸。 2.场景理解(Scene Understanding) 场...

_小迷糊 ⋅ 今天 ⋅ 0

5.1 vim介绍 5.2 vim移动光标 5.3 ,5.4vim一般模式下移动光标,复制粘贴

vim命令 vim是vi的一个升级版;vim可以显示文字的颜色 安装vim这一个包vim-enhanced 如果不知道安装包,可以使用 命令下面命令来查看vim命令是那个包安装的。 [root@linux-128 ~]# yum prov...

Linux_老吴 ⋅ 今天 ⋅ 0

vim一般模式

vim 是什么 vim是什么 ? 在之前接触Linux,编辑网卡配置文件的时候我们用过了vi ,vim简单说就是vi的升级版,它跟vi一样是Linux系统中的一个文本编辑工具。 如果系统中没有vim ,需要安装一...

李超小牛子 ⋅ 今天 ⋅ 0

docker实战

构建企业级Docker虚拟化平台实战 重点剖析虚拟化和云计算概念; 分析Docker虚拟化的概念和原理; 从0开始实战Docker虚拟化平台; 基于Docker构建Nginx WEB服务器和CentOS虚拟机; 基于开源监...

寰宇01 ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部