javascript继承实现

最新推荐文章于 2024-04-15 15:42:58 发布

指尖残雪

最新推荐文章于 2024-04-15 15:42:58 发布

阅读量514

点赞数

分类专栏： javascript 文章标签： javascript 继承实现

本文链接：https://blog.csdn.net/bq1073100909/article/details/49592683

版权

javascript 专栏收录该内容

16 篇文章 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>

指尖残雪

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
javascript继承实现

使用javascript写自己的继承方法，主要用到javascript原型和构造方法方面的知识。使用javascript实现继承 //sub是子类，sup是父类 function extend(sub,sup){ // 目的：实现只继承父类的原型对象 var F = new Function();// 1 创建一个空函数目的
复制链接

扫一扫