zoukankan      html  css  js  c++  java
  • 原型的实时局部修改与全部重写的区别(原型的动态性)

     1     //代码1-原型原理:
     2     function Student(){
     3         //创建了一个空的构造函数
     4     }
     5 
     6     //注意:创建了函数Student的同时Student.prototype原型对象就立即产生了
     7 
     8     var person1 = new Student();//实例person1默认都会从Student.prototype 继承属性与方法
     9     var person2 = new Student();//实例person2默认都会从Student.prototype 继承属性与方法
    10 
    11     //实例可以使用原型共享的属性或方法:
    12     //实例使用原型属性或方法的方式是 "实例名.属性" 或 "实例名.方法名() "
    13     //person1.methodName();//这里的两个实例使用的methodName方法由于并未在原型中定义,所以会报错
    14     //person2.methodName();//
    15 
    16     /*
    17      提示:
    18      1、创建了一个函数即就会立即创建一个相应的原型对象,如例子中创建的函数Student,
    19      那么就会立即产生一个Student.prototype 这个原型,在没有向原型里新增属性或方法时,
    20      这个原型里有只有一个属性,名为constructor,是一个指针,指向创建这个原型的函数Student,即值为Student
    21     */
    22 
    23 
    24 
    25 
    26     //代码2-实时局部修改原型属性或方法:
    27     function Student(){
    28         //创建了一个空的构造函数
    29     }
    30 
    31     //在创建的函数Student的原型里新增几个属性与方法,方法是Student.prototype.属性名或方法名 = 赋值;
    32     //以这种方法新增或修改的原型属性可以理解为在函数创建时产生的原型基础上新增或修改的方法
    33     Student.prototype.name = "zhangsan";
    34     Student.prototype.age = 29;
    35     Student.prototype.sayName = function(){
    36         alert(this.name);
    37     };
    38 
    39     var person1 = new Student();
    40     var person2 = new Student();
    41 
    42     person1.sayName();//zhangsan
    43     person2.sayName();//zhangsan
    44 
    45 
    46 
    47     /*
    48     *
    49     * 提示:这个Student.prototype原型里的属性和方法是可以新增修改的
    50     *
    51     * */
    52 
    53 
    54     //代码3-全部重写原型属性或方法:
    55     function Student(){
    56         //创建了一个空的构造函数
    57     }
    58 
    59     //在代码2中,我们使用的是这个方法新增或修改原型属性与方法:Student.prototype.属性名或方法名 = 赋值;
    60 
    61     //全部重写原型我们使用这个方法:对象字面量的方法
    62     //这个方法有两个特点:
    63     // 1、方便大量方法属性定义时均需要频繁输入Student.prototype
    64     // 2、会完全修改函数创建时默认产生的原型对象,甚至可以理解为这个原型对象里面的任何值都被清空了,新值为后续定义的值
    65     // 3、完全重写原型对象切断了函数与创建的原型对象之间的关系
    66 
    67     console.log(Student.prototype);
    68     Student.prototype.name = "zhangsan";
    69     Student.prototype.sayName = function(){
    70         console.log(this.name);
    71     };
    72     var person1 = new Student();//在以下原型全部重写之前创建原型实例,这个创建的实例会有一个指针指向最初的原型,哪怕下面全部重写了原型,原有的指向依然不变
    73     console.log(Student.prototype.constructor);//Student()
    74 
    75     //原型全部重写
    76     Student.prototype = {
    77             //constructor : Student, //给重写原型增加constructor指定将重写将该原型构造函数指针指向Student
    78             name : "lisi",
    79             age : 29,
    80             sayName : function(){
    81                 console.log(this.name);
    82             }
    83     };
    84     console.log(Student.prototype.constructor);//全部重写原型后,Student.prototype指针指向构造函数Object()而不是Student()了
    85 
    86 
    87     /* 注意:默认原型与全部重写后的原型是一种并列同时存在的关系 */
    88     var person2 = new Student();//以上的原型全部重写破坏切断了构造函数Student 与 Student.prototype之间的关系,在此之后创建的实例的属性方法均继承自该重写后的原型
    89     person1.sayName();//zhangsan
    90     person2.sayName();//lisi
    91     console.log(person1.__proto__);//Student
    92     console.log(person2.__proto__);//Object
  • 相关阅读:
    《破茧成蝶》读书笔记——价值
    《破茧成蝶》读书笔记——技能(2)
    《破茧成蝶》读书笔记——技能(1)
    《破茧成蝶》读书笔记——信念
    《HeadFirst:HTML & CSS(第二版)》——开篇废话
    图片旋转方法
    uploadify 3.0 详细使用说明
    提高mysql千万级大数据SQL查询优化30条经验(Mysql索引优化注意)
    Sql 中 不等于'<>'与 NULL
    c#中获取存储过程的返回值(return Value)
  • 原文地址:https://www.cnblogs.com/rapale/p/4675513.html
Copyright © 2011-2022 走看看