少废话,先上代码:

function Human() { }
Human.prototype.name = "成吉思汗";
Human.prototype.sex = "男";
Human.prototype.say = function () {
alert(this.name);
}
var man = new Human();
man.say(); //成吉思汗
var woman = new Human();
woman.say(); //成吉思汗
alert(man.say == woman.say);//true

prototype是javascript中非常核心的知识点之一.他是javascript中的面向对象思想中起着至关重要的作用.

我们来看看prototype是何方妖孽,拥有如此大的威力.

js中每一个函数都有一个prototype属性,我们称之为原型.(这个解释有点烂,等于没说,没办法,不知道怎么给他下定义了^_^);

使用原型对象的好处之一就是让所有的实例共享同样的位于原型上的属性和方法.

上面例子中,name,sex,say都位于prototype上,所以man和woman共享这些属性和方法.内存中虽然有了2个实例,但是他们却只有一份name和sex和say.

这在复杂的项目中可谓是极大的节省了内存.

也因为如此,原型模式才更优胜于上章节介绍的构造函数模式.

这种简单的原型模式一眼就能看出有很多不切合实际的东东:

1.既然所有的属性和方法都共享了,那么我实例化一个对象不就够了吗?

2.每一个对象都是一个个体(有自己特有的属性或方法),而又有相似性(共同的属性和方法),

接下来就有了构造函数模式和原型模式共同作用的结果.这种组合模式在下一章继续.

javascript创建对象之原型模式(三)的更多相关文章

  1. 理解javascript中的原型模式

    一.为什么要用原型模式. 早期采用工厂模式或构造函数模式的缺点:  1.工厂模式:函数creatPerson根据接受的参数来构建一个包含所有必要信息的person对象,这个函数可以被无数次的调用,工厂 ...

  2. Javascript设计模式之原型模式、发布订阅模式

    原型模式 原型模式用于在创建对象时,通过共享某个对象原型的属性和方法,从而达到提高性能.降低内存占用.代码复用的效果. 示例一 function Person(name) { this.name = ...

  3. 浅谈JavaScript中的原型模式

    在JavaScript中创建对象由很多种方式,如工厂模式.构造函数模式.原型模式等: <pre name="code" class="html">/ ...

  4. 再起航,我的学习笔记之JavaScript设计模式09(原型模式)

    我的学习笔记是根据我的学习情况来定期更新的,预计2-3天更新一章,主要是给大家分享一下,我所学到的知识,如果有什么错误请在评论中指点出来,我一定虚心接受,那么废话不多说开始我们今天的学习分享吧! 我们 ...

  5. JavaScript面向对象OOM 2(JavaScript 创建对象的工厂模式和构造函数模式)

      在创建对象的时候,使用对象字面量和 new Object() 构造函数的方式创建一个对象是最简单最方便的方式.但是凡是处于初级阶段的事物都会不可避免的存在一个问题,没有普适性,意思就是说我要为世界 ...

  6. OC编程之道-创建对象之原型模式

    一 什么是原型模式?(what) 有些对象的创建代价过大或过于复杂,要是可以重建相同的对象并作轻微的改动,事情会容易的多(效率变高).典型的例子是复制组合结构(eg树形结构),从零开始构建一个树型组合 ...

  7. JavaScript设计模式-3.原型模式

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. JavaScript设计模式 (1) 原型模式

    原型模式(Prototype):用原型实例指向创建类对象,使用于创建新对象的类共享原型对象的属性以及方法. //图片轮播类 var LoopImages = function (imgArr, con ...

  9. js面向对象的程序设计 --- 中篇(创建对象) 之 原型模式

    ·原型模式 我们创建的每一个函数都由一个prototype(原型)属性,这个属性是一个指针,指向一个对象,而这个对象的用途是包含可以由特定类型的所有 实例共享的属性和方法. 如果按照字面意思来理解,那 ...

随机推荐

  1. koa 微信小程序 项目

    这个微信号入门, 应该能自己模仿做一个微信公众号了 另外 微信小程序开发 和 微信公众号h5嵌入 还是有区别的 h5嵌入在体验上和 微信小程序 差距还是比较大, 因为小程序直接调用了微信的原生组件, ...

  2. WebGL编程指南理论分析之物体的运动和点光源

    之前的所有案例中物体都是静止的并且是平行光照射,这里我们来讨论一下运动物体和点光源. 一.运动物体 我们知道对于一个提供原始顶点坐标和原始顶点法向量数据的着色器绘制出来的图形看上去是这样的: 看上去很 ...

  3. Vue实例的的data对象

    介绍 Vue的实例的数据对象data 我们已经用了很多了,数据绑定离不开data里面的数据.也是Vue的核心属性. 它是Vue绑定数据到HTML标签的数据源泉,另外Vue框架会自动监视data里面的数 ...

  4. .NET 中使用 Mutex 进行跨越进程边界的同步

    Mutex 是 Mutual Exclusion 的缩写,是互斥锁,用于防止两个线程同时对计算机上的同一个资源进行访问.不过相比于其他互斥的方式,Mutex 能够跨越线程边界. 本文内容 Mutex ...

  5. test20180922 古代龙人的谜题

    题意 问题描述 Mark Douglas是一名调查员.他接受了「调查古代龙人」的任务.经过千辛万苦,Mark终于找到了一位古代龙人.Mark找到他时,他正在摆弄一些秘药,其中一些药丸由于是从很久以前流 ...

  6. HTML/CSS/Javascript代码在线压缩、格式化(美化)工具

    CSS 格式化 ProCSSor - http://procssor.com/   CSS 压缩 CSS Compressor - http://www.cssdrive.com/index.php/ ...

  7. 关于 Vue 方法前面的美元符号

    关于 Vue 方法前面的美元符号 学到这一段,不明白什么意思,然后手贱把 $ 删除了,出现未定义方法. vm.$watch('counter', function(nval, oval) { aler ...

  8. python之 数据类型判定与类型转换

    一. 判断数据类型 0.type(x)type()可以接收任何东西作为参数――并返回它的数据类型.整型.字符串.列表.字典.元组.函数.类.模块,甚至类型对象都可以作为参数被 type 函数接受. & ...

  9. java 搭建新项目,最佳组合:spring boot + mybatis generator

    java 搭建新项目,最佳组合:spring boot + mybatis generator

  10. vue-cli 下的 webpack 优化

    app bundle 可以通过组件懒加载优化 vender 优化方法: 使用 cdn,然后在 webpack 配置中指定 externals. 利用 webpack 的插件 DllPlugin 和 D ...