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

通过原型法分配的函数是所有对象共享的.
通过原型法分配的属性是独立.-----如果你不修改属性,他们是共享

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

例子:

//----构造函数模式
为Cat对象添加一个不变的属性"type"(种类),再添加一个方法eat(吃老鼠)。那么,原型对象Cat就变成了下面这样:

  1. <script>
  2. function Cat(name, color) {
  3. this.name = name;
  4. this.color = color;
  5. this.type = "猫科动物";
  6. this.eat = function () {
  7. alert("吃老鼠");
  8. };
  9. }
  10. //生成实例:
  11. var cat1 = new Cat("大毛", "黄色");
  12. var cat2 = new Cat("二毛", "黑色");
  13. alert(cat1.type);         // 猫科动物
  14. cat1.eat();       // 吃老鼠
  15. alert(cat1.eat == cat2.eat); //false
  16. </script>

那就是对于每一个实例对象,type属性和eat()方法都是一模一样的内容,每一次生成一个实例,都必须为重复的内容,多占用一些内存。这样既不环保,也缺乏效率。
  

//----Prototype模式 
Javascript规定,每一个构造函数都有一个prototype属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。
这意味着,我们可以把那些不变的属性和方法,直接定义在prototype对象上。

  1. <script>
  2. function Cat(name, color) {
  3. this.name = name;
  4. this.color = color;
  5. }
  6. Cat.prototype.type = "猫科动物";
  7. Cat.prototype.eat = function () {
  8. alert("吃老鼠")
  9. };
  10. //生成实例。
  11. var cat1 = new Cat("大毛", "黄色");
  12. var cat2 = new Cat("二毛", "黑色");
  13. alert(cat1.type); // 猫科动物
  14. cat1.eat();// 吃老鼠
  15. alert(cat1.eat == cat2.eat);//trueF
  16. </script>

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

JS----构造函数与原型prototype 区别的更多相关文章

  1. 关于构造函数和原型prototype对象的理解

    构造函数     1.什么是构造函数 构造函数,主要用于对象创建的初始化,和new运算符一起用于创建对象,一个类可以有多个构造函数,因为函数名相同,所以只能通过参数的个数和类型不同进行区分,即构造函数 ...

  2. js 构造函数 & 静态方法 & 原型 & 实例方法

    js 构造函数 & 静态方法 & 原型 & 实例方法 ES5 "use strict"; /** * * @author xgqfrms * @licens ...

  3. 深入研究js构造函数和原型

    很快就要从新浪离职了,最近心情比较轻松,抽点空整理一下构造函数和原型的机理. 我们都知道,在经典设计模式中我们最常用的就是工厂模式.构造函数模式.原型模式这几种,听起来‘模式’好像很高大上的样子,实际 ...

  4. JS构造函数、原型对象、隐含参数this

    This 解析器再调用函数每次都会向函数内部传递一个隐含的参数this,this指向的是一个对象(函数执行的上下文对象) 1.以函数形式调用时,this永远是window. 2.以方法形式调用时,th ...

  5. 完整原型链详细图解之JS构造函数、原型 原型链、实例化对象

    一.首先说一下什么是构造函数: 构造函数:用来在创建对象时初始化对象.特点:构造函数名一般为大写字母开头:与new运算符一起使用来实例化对象. 举例: function Person(){} //Pe ...

  6. js 中的原型prototype

    每次创建新函数,就会根据规则为该函数创建一个 prototype 属性,该属性是一个指向函数原型对象的指针.并且原型对象都默认拥有一个 constructor 属性,该属性是一个指向那个新建函数的指针 ...

  7. 笔记: js构造函数与原型

    目录 构造函数与原型介绍 涉及三种引用的操作 有关原型及原型链的一些相关方法总结 @ 构造函数与原型介绍 1.函数与函数的原型对象(prototype object): 在JavaScript中,创建 ...

  8. JS 中的原型 -- prototype、__proto__ 以及原型链

    原文: 1.深入理解javascript原型和闭包——prototype原型 2.三张图搞懂JavaScript的原型对象与原型链 打开浏览器控制台,任意定义一个对象,打印出来后,会发现有最后一定有一 ...

  9. js中的原型prototype

    var arr1 = new Array(12,34,98,43,38,79,56,1); arr1.sum=function (){ var result = 0; for(var i=0; i&l ...

随机推荐

  1. mongodb Install the MongoDB service

    在用到mongodb时,首先要运行mongod.exe以启动mongo,这样就会出现命令框( command prompt),为了避免出现这种情况.要以服务的形式来启动mongo,这样就不会出现命令框 ...

  2. php调用whois接口域名查询

    由两部分组成,一个index.php文件,一个whois的接口文件: <html> <head> <title>域名到期查询</title> <s ...

  3. jquery delegate

    代码如下:   $('#container').delegate('a','click',function(){alert('That tickles!')} JQuery扫描文档查找$('#cont ...

  4. Javascript事件传播

    MicroSoft的设计是当事件在元素上触发时,该事件将接着在该节点的父节点触发,以此类推,事件一直沿着DOM树向上传播,直到到达顶层对象document元素.这种自底向上的事件传播方式称为" ...

  5. delphi xe5 android 使用样式(风格)

    1.在界面上添加 TStyleBook 控件 2.点击Resource 选择xe5程序安装带的几个风格的其中之一,路径存放在: C:\Program Files\Embarcadero\RAD Stu ...

  6. shell 流程控制

    for循环: #!/bin/bash for file in $(ls /ect) do echo $file done

  7. 目标识别:Bag-of-words表示图像

    BOW (bag of words) 模型简介 Bag of words模型最初被用在文本分类中,将文档表示成特征矢量.它的基本思想是假定对于一个文本,忽略其词序和语法.句法,仅仅将其看做是一些词汇的 ...

  8. ANDROID_MARS学习笔记_S02_006_APPWIDGET3_AppWidget发送广播及更新AppWidget

    一.简介 二.代码1.xml(1)example_appwidget.xml <?xml version="1.0" encoding="utf-8"?& ...

  9. 关于HSL和HSV颜色空间的详细论述

    目前在计算机视觉领域存在着较多类型的颜色空间(color space).HSL和HSV是两种最常见的圆柱坐标表示的颜色模型,它重新影射了RGB模型,从而能够视觉上比RGB模型更具有视觉直观性. HSV ...

  10. WCF - Architecture

    WCF - Architecture WCF has a layered architecture that offers ample support for developing various d ...