• 关于js构造函数的继承(读了阮一峰老师的博客之后有些感想)


     1 <--改代码样例是参考阮一峰老师博客的代码!-->
     2 <!DOCTYPE html>
     3 <html lang="en">
     4 <head>
     5     <meta charset="UTF-8">
     6     <title>Object_3</title>
     7 </head>
     8 <body>
     9 <script>
    10   function Animal(){
    11     this.species = '动物';
    12   }
    13 
    14   function Cat(name, color){
    15     //Animal.apply(this, arguments);
    16     this.name = name;
    17     this.color = color;
    18   }
    19 
    20   //Cat.prototype.constructor = Animal;//用new构造函数的时候,用的是Cat的prototype,没有用constructor里面的
    21   Cat.prototype = new Animal();
    22   //Cat.prototype.constructor = Cat;//这句话在new的时候并不会关系到对象的结构,它只是指向构造函数而已,最关键的是上面那句关于prototype的
    23   var cat1 = new Cat('Hua', 'blue');
    24   console.log(cat1.name);//Hua
    25   console.log(cat1.color);//blue
    26   console.log(cat1.species);//动物  (该结果是加了21行或者15行才会有)
    27 </script>
    28 </body>
    29 </html>

    其实第22行   代码并不会影响你new关系到对象的结构,它只是指向构造函数而已,最关键的是上面那句关于prototype的

    关于第21行     prototype属性的作用就是让该函数所实例化的对象们都可以找到公用的属性和方法,

    而21行       中执行哪行代码之后,prototype变成了一个对象,而这个对象里面有species属性,依据prototype的理解就知道所以此时cat1可以使用species的属性

    或者如果想实现属性的继承,其实直接对Cat的prototype操作就行了

    Cat.prototype.species = '动物'

    文章参考http://www.ruanyifeng.com/blog/2010/05/object-oriented_javascript_inheritance.html

  • 相关阅读:
    第一个C#程序
    定位网页元素
    盒子模型
    浮动
    css3美化网页元素
    html css3
    java表单基础
    表单
    html5基础
    java程序题目解析
  • 原文地址:https://www.cnblogs.com/WildSky/p/11008895.html
Copyright © 2020-2023  润新知