zoukankan      html  css  js  c++  java
  • js重写原型对象

    function Person(){}

    Person.prototype = {
             constructor:Person,
             name:"Nic",
             age:"29",
             sayName:function(){
                           alert(this.name)
                   }
          };
    var friend1 = new Person(); //实例在这里
    friend1.sayName();

    ----------------------------------------------------------

    function Person(){}

    var friend2 = new Person(); //实例在这里
    Person.prototype = {
            constructor:Person,
            name:"Nic",
            age:"29",
            sayName:function(){
                 alert(this.name);
              }
         };

    friend2.sayName();

    两个例子都是重写了原型对象,但是实例创建的顺序直接导致了俩个输出的结果。

    第一个弹出 “Nic”,而第二个会报错“TypeError: friend2.sayName is not a function” !!!

    两端代码唯一的区别就是实例在原型对象重写之前还是之后。

    第一段重写后再创建实例,此时实例指向改写后的原型对象,所以能调用到原型中的sayName()。

    第二段创建实例后再重写,此时实例还是指向刚开始的原型对象。重写原型对象后会将 之前原型对象 的属性和方法全部清除,所以实例访问不到sayName()。

    另外读《JavaScript高级程序设计(第3版)》中156页与157页,分别是:

    “实例中的指针仅指向原型,而不是指向构造函数”。

    “重写原型对象切断了现有原型与任何之前已经存在的对象实例之间的关系;它们引用的仍然是最初的原型”。

  • 相关阅读:
    分别使用vue和react创建一个可伸缩的树
    渲染一颗树(分别使用vue和react创建)
    n皇后问题JS实现(N-Queens)
    中序遍历二叉树(js)
    LeetCode 258 Add Digits
    js二维数组去重
    js 数组中sort方法存在的问题
    原生js实现一个简单轮播效果
    原生js实现一个连连看小游戏(三)-----------点击列表获取索引
    js生成随机不重复数字的几种方法
  • 原文地址:https://www.cnblogs.com/aixiuxiu/p/6505825.html
Copyright © 2011-2022 走看看