JavaScript教程-44-JavaScript实现继承的方式_js实现 son 类,继承 father,增加一个属性 age,增加一个方法 run-CSDN博客

本文链接：https://blog.csdn.net/qq_35938103/article/details/105393965

本文介绍了JavaScript中三种实现继承的方法：1) 通过原型对象继承，子类原型指向父类实例；2) 类继承，只继承模版，不继承原型；3) 前两者混合使用。在讨论中提到了每种方式的优缺点，并提到作者提供丰富的学习资源和B站教学视频。

摘要由CSDN通过智能技术生成

1：通过原型对象继承，子类的原型对象指向父类实例。缺点：创建子类对象的时候，父类中的属性必须通过父类的构造方法去初始化。

2：类继承（只继承模版，不继承原型对象）也称为借用构造函数式继承。

3：上述两种的混合使用。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>继承的三种实现</title>
		<script type="text/javascript">
			//在JavaScript中可以通过三种方式实现继承。
			//1：通过原型继承。
			function Father(name){
				this.name = name;
			}
			Father.prototype.show = function(){
				alert("name = "+this.name);
			}
			
			//定义所谓的子类
			function Son(age){
				this.age = age;
			}
			
			//让子类的原型对象指向父类的实例，子类对象就拥有了父类属性
			Son.prototype = new Father("张三");
			//通过子类对象访问父类中的成员
			var son = new Son(13);
			alert(son.name);//张三
			alert(son.age);//13
			son.show();//name = 张三
			//该方式的问题是创建子类对象的时候，必须通过父类的去给父类中的成员赋值。
			
			//2：类继承（只继承模版，不继承原型对象）也称为借用构造函数式继承。
			function Father1(name, age){
				this.name = name;
				this.age = age;
			}
			//通过父类的原型对象添加方法
			Father1.prototype.show = function(){
				alert(this.name);
			}
			//可以通过子类对象给所有的属性赋值
			function Son1(name, age , sex){
				//使用call 、apply 调用父类的构造方法
				Father1.call(this,name,age);
				this.sex = sex;
			}
			//创建子类对象
			var son1 = new Son1("小明",12,"男");
			alert(son1.name);//小明
			alert(son1.age);//12
			alert(son1.sex);//男
//			son1.show(); 这样的方式不能继承父类中的原型对象中的内容。

			//3：将上述的两种方式混合使用。函数原型对象+借用构造函数
			function Father2(name,age){
				this.name = name;
				this.age = age;
			}
			Father2.prototype.show = function(){
				alert("父类中的方法");
			}
			function Son2(name,age,sex){
				//借用构造函数
				Father2.call(this,name,age);
				this.sex = sex;
			}
			//通过原型对象继承
			Son2.prototype = new Father2();
			
			var son2 = new Son2("小马",12,"女");
			alert(son2.name);//小明
			alert(son2.age);//12
			alert(son2.sex);//男
			son2.show();
			
		</script>
	</head>
	<body>
	</body>
</html>

PS：笔者有大量的学习资料：java、python、大数据、人工智能、前端等。需要的小伙伴请加群：711408961

笔者的b站中有一些教学视频分享。感兴趣的小伙伴可以关注：https://space.bilibili.com/412362068