JavaScript通用继承方法和super

╰半橙微兮° 2022-06-18 08:28 167阅读 0赞

1、JavaScript通用继承的封装和super的使用

/**
    		 * JavaScript通用继承的封装
    		 * @param {Object} Child 子对象
    		 * @param {Object} Parent 子对象要继承的父对象
    		 */
    		function createExtend(Child, Parent) {
    			function F() {}
    			F.prototype = Parent.prototype;
    			Child.prototype = new F();
    			Child.prototype.constructor = Child;
    			//添加父类的指针
    			Child.super = Child.base = Parent.prototype;
    		}

2、测试代码

<!DOCTYPE html>
    <html>
    
    	<head>
    		<meta charset="UTF-8">
    		<title></title>
    	</head>
    	<script>
    		/**
    		 * JavaScript通用继承的封装
    		 * @param {Object} Child 子对象
    		 * @param {Object} Parent 子对象要继承的父对象
    		 */
    		function createExtend(Child, Parent) {
    			function F() {}
    			F.prototype = Parent.prototype;
    			Child.prototype = new F();
    			Child.prototype.constructor = Child;
    			//添加父类的指针
    			Child.super = Child.base = Parent.prototype;
    		}
    
    		//父类的定义
    		function Person(name, age) {
    			this.name = name;
    			this.age = age;
    		}
    		Person.prototype.headCount = 1;
    		Person.prototype.eat = function() {
    			console.log("eating ...");
    		}
    
    		//子类的定义
    		function Programer(name, age, title) {
    			Person.apply(this, arguments);
    			this.title = title;
    		}
    		//继承的实现
    		createExtend(Programer, Person);
    		//在继承之后,再往子类的原型加方法和属性
    		Programer.prototype.language = "JavaScript";
    		Programer.prototype.work = function() {
    			console.log("I am writing code in " + this.language);
    			//继承的方法
    			this.eat();
    		}
    		//测试代码
    		var pro = new Programer("zhang", 18, "haah");
    		pro.work();
    	</script>
    
    	<body>
    	</body>
    
    </html>