js原生设计模式——2面向对象编程之继承—new+call(this)组合式继承

最新推荐文章于 2025-05-25 23:07:52 发布

weixin_34162695

最新推荐文章于 2025-05-25 23:07:52 发布

阅读量64

点赞数

文章标签：设计模式 php javascript ViewUI

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>groupInherit</title>
   <script type="text/javascript">
   //声明父类
   function superClass(name){
       this.name = name;
       this.books = ['html','css','js'];
   }
   superClass.prototype.getName = function(){
       console.log(this.name);
   }
   superClass.prototype.getBooks = function(){
       console.log(this.books);
   }
   //声明子类
   function subClass(name,time){
       superClass.call(this,name);//让子this指向父this，后面带的是父类需传入的参数name
       this.time = time;
   }
   subClass.prototype = new superClass();//类式继承
   subClass.prototype.getTime = function(){
       console.log(this.time);
   }
   //测试用例：实例化对象测试
   var test1 = new subClass('js book',2015);
   var test2 = new subClass('css book',2014);
   test1.books.push('php');//test2插入的数据'php'不影响test1

   console.log(test1.name);      //'js book'
   console.log(test1.books);   //["html", "css", "js", "php"]
   test1.getName();              //'js book'
   test1.getBooks();           //["html", "css", "js", "php"]
   test1.getTime();            //2015

   console.log(test2.name);      //'css book'
   console.log(test2.books);   //["html", "css", "js"]
   test2.getName();              //'css book'
   test2.getBooks();           //["html", "css", "js"]
   test2.getTime();            //2014

   //本例已经通过验证,this属性和原型方法均能访问
   </script>
</head>
<body>

</body>
</html>