zoukankan      html  css  js  c++  java
  • js中构造函数的原型添加成员的两种方式

    首先,js中给原型对象添加属性和方法。

    方式一:对象的动态特效 给原型对象添加成员

        语法:构造函数.prototype.方法名=function (){ }

    方式二:替换原型对象(不是覆盖,而是替换,把原先的同名的直接替换成现在的)    

        语法:构造函数.prototype.方法名={ }

    tips:方式二不常用,因为这样会修改了原型本身

    搜索:JS中通过构造函数添加成员方法和通过原型法添加成员方法的区别

      参考网址  http://blog.csdn.net/xxmzumeng/article/details/38422615

    ① 通过原型法分配的函数是所有对象共享的.

    ② 通过原型法分配的属性是独立.(如果你不修改属性,他们是共享)

    ③ 建议:如果我们希望所有的对象使用同一一个函数,最好使用原型法添加函数,这样比较节省内存.

     构造函数方法很好用,但是存在一个浪费内存的问题。

    请看,我们现在为Cat对象添加一个不变的属性"type"(种类),再添加一个方法eat(吃老鼠)。那么,原型对象Cat就变成了下面这样:

      function Cat(name,color){

        this.name = name;

        this.color = color;

        this.type = "猫科动物";

        this.eat = function(){alert("吃老鼠");};

      } 

    还是采用同样的方法,生成实例:

      var cat1 = new Cat("大毛","黄色");

      var cat2 = new Cat ("二毛","黑色");

      alert(cat1.type); // 猫科动物

      cat1.eat(); // 吃老鼠 

    表面上好像没什么问题,但是实际上这样做,有一个很大的弊端。那就是对于每一个实例对象,type属性和eat()方法都是一模一样的内容,每一次生成一个实例,都必须为重复的内容,多占用一些内存。这样既不环保,也缺乏效率。

      alert(cat1.eat == cat2.eat); //false

    能不能让type属性和eat()方法在内存中只生成一次,然后所有实例都指向那个内存地址呢?回答是可以的。 

    5. Prototype模式 

    Javascript规定,每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。

    这意味着,我们可以把那些不变的属性和方法,直接定义在prototype对象上。

      function Cat(name,color){

        this.name = name;

        this.color = color;

      }

      Cat.prototype.type = "猫科动物";

      Cat.prototype.eat = function(){alert("吃老鼠")}; 

    然后,生成实例。

      var cat1 = new Cat("大毛","黄色");

      var cat2 = new Cat("二毛","黑色");

      alert(cat1.type); // 猫科动物

      cat1.eat(); // 吃老鼠

    这时所有实例的type属性和eat()方法,其实都是一个内存地址,指向prototype对象,因此就提高了运行效率。

      alert(cat1.eat == cat2.eat); //true 

  • 相关阅读:
    【好文翻译】10个免费的压力测试工具(Web)
    【高手介绍】谷歌内部代码审查(code review)介绍[翻译]
    【淘宝内部好文转发】我们每天面对的互联网用户到底在想什么?
    写给开发者:别让他人用你的App赚钱[转]
    新手应该知道的二十三条关于JavaScript的最佳实践
    开发人员应该为这样的代码感到惭愧
    [Web App]必胜客宅急送产品设计思路介绍[转]
    WallsEveryDay 必应桌面壁纸
    GroupLayout 布局
    JButton 做图片框
  • 原文地址:https://www.cnblogs.com/cxzhome/p/7891602.html
Copyright © 2011-2022 走看看