一、提到原型模式,和构造函数关系密切,先讲一下它

javascript没有类,通过函数来模拟实现类,用new来创建对象,函数内部的this指针来指向调用它的对象。

事例中创建对象myGril,这个对象就获取了构造函数内this指向的所有属性和方法。

var GirlFriend=function (temperament) {
this.temperament=temperament;
this.loseTemper=function(){
return "When angry:"+this.temperament;
}
}
var myGirl=new GirlFriend("温柔");
console.log(myGirl.loseTemper()); //When angry:温柔

二、要是没有this的属性呢

通过new运算符创建的对象,只能访问this指向的属性和方法,实例中,myGirl只能访问temperament,lostTemper

temperament2无法访问。

var GirlFriend=function (temperament) {
this.temperament=temperament;
this.loseTemper=function(){
return "When angry:"+this.temperament;
}
var temperament2=temperament;
}
var myGirl=new GirlFriend("温柔");
console.log(myGirl.temperament2);//undefined

三、讲了一大堆,和原型有什么关系呢?关键是构造函数内的方法,如果新建对象myGirl2 那么就会再创建一个lostTemper方法引用,对象建多了,对内存来说也是一种浪费,因为方法用的都是同一个,不像属性那样,每个对象都不同。这里就用到了原型对象,在构造函数的原型对象中添加一个这个方法,会使所有通过该构造函数创建的对象都具备该方法。

var GirlFriend=function (temperament) {
this.temperament=temperament;
}
GirlFriend.prototype.loseTemper=function(){
return "When angry:"+this.temperament;
}
var myGirl=new GirlFriend("温柔");
console.log(myGirl.loseTemper());

四、刚才看到原型对象上添加一个方法,要是把该构造函数的原型对象改变引用位置,也就是指向一个新对象呢。

下例中两个方法同样都能访问,那我们什么时候可以用呢?一定要确认构造函数的原型对象的所有属性和方法在哪后才能这样做,因为这已经改变了指向,要是有原型对象的其他方法创建过,就失效了,所以很危险。

    var GirlFriend=function (temperament) {
this.temperament=temperament;
} GirlFriend.prototype={
loseTemper:function(){
return "When angry:"+this.temperament;
},
notLoseTemper:function(){
return "When not angry:"+this.temperament;
}
}
var myGirl=new GirlFriend("温柔");
console.log(myGirl.loseTemper());//When angry:温柔
console.log(myGirl.notLoseTemper());//When not angry:温柔

JavaScript原型模式的更多相关文章

  1. Javascript原型模式总结梳理

    在大多数面向对象语言中,对象总是由类中实例化而来,类和对象的关系就像模具跟模件一样.Javascript中没有类的概念,就算ES6中引入的class也不过是一种语法糖,本质上还是利用原型实现.在原型编 ...

  2. 面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统

    面向对象的JavaScript --- 原型模式和基于原型继承的JavaScript对象系统 原型模式和基于原型继承的JavaScript对象系统 在 Brendan Eich 为 JavaScrip ...

  3. Javascript:原型模式类继承

    原型模式 每个函数(准确说不是类.对象)都有一个prototype属性,这个属性是一个指针,指向一个对象. 使用原型对象的好处是可以让所有对象实例共享它包含的属性和方法.   1.原型对象 (1)当创 ...

  4. javascript原型模式理解

    传统的面向对象语言中,创建一个对象是通过使用类来创建一个对象的,比如通过类飞行器来创建一个对象,飞机. 而js这种没有类概念的动态设计语言中,创建对象是通过函数来创建的,所以通常也把js称为函数式语言 ...

  5. JavaScript原型模式-理解对象

    一:简述 当初学编程一看到什么什么模式就比较头晕,不过本文我们通过简单的示例代码来说一下js 对象这个话题 ,来看下如何理解这个原型模式. 二:理解对象 1.简单对象 js对象中没有java.C#等类 ...

  6. JavaScript原型模式(prototype)

    1.原型是一个对象,其他对象可以通过它实现属性的继承所有对象在默认的情况下都有一个原型,因为原型的本身也是对象,所以一个类的真正原型是被类的内部[prototype]属性所指出.每个函数都有一个属性叫 ...

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

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

  8. [设计模式] JavaScript 之 原型模式 : Object.create 与 prototype

    原型模式说明 说明:使用原型实例来 拷贝 创建新的可定制的对象:新建的对象,不需要知道原对象创建的具体过程: 过程:Prototype => new ProtoExam => clone ...

  9. 理解javascript中的原型模式

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

随机推荐

  1. 【Java基础01】Java InputStream的read方法

    JDK关于InputStream中的read方法的描述: (1) read() :  从输入流中读取数据的下一个字节,返回0到255范围内的int字节值.如果因为已经到达流末尾而没有可用的字节,则返回 ...

  2. Eclipse中如何恢复已删除文件

    [转自] http://zhangjunhd.blog.51cto.com/113473/23092

  3. Learning WCF Chapter2 WCF Contracts and Serialization

    So far I’ve talked about the standards behind it all,but in fact WCF hides most of this from the dev ...

  4. bzoj1597

    首先不难想到排序,这种无规律的东西一般都要转化为有规律才好做 首先以x为第一关键字,y为第二关键字升序排序 拍完序我们发现,若存在两块土地i,j x[i]<=x[j],y[i]<=y[j] ...

  5. 【转】Android源代码编译命令m/mm/mmm/make分析--不错

    原文网址:http://blog.csdn.net/luoshengyang/article/details/19023609 在前文中,我们分析了Android编译环境的初始化过程.Android编 ...

  6. Android --- px与dip换算

    px = (density/160)dpdensity一般为3个常用固定值240/160/120分别对应WVGA/HVGA/QVGA不知道知己做的分辨率对应的density是多少可以点击AVD Man ...

  7. GIS大讲堂内所有讲座的索引(更新至2008年6月26日)(转)

    转自:http://www.cnblogs.com/xiexiaokui/archive/2008/11/20/1337934.html GIS大讲堂内所有讲座的索引(更新至2008年6月26日)   ...

  8. ElasticSearch elasticsearch-servicewrapper 在linux上的安装部署全程记录

    原文地址:http://www.cnblogs.com/tianjixiaoying/p/4316011.html 由于项目需求,需要在linux平台搭建一套ES服务.在搭建过程中,遇到各种各样的问题 ...

  9. 我的第一篇Markdown博客

    我的第一篇Markdown博客 这是我第一次用Markdown写博客,发现还是比较好用的,加上Marsedit也支持了Markdown的博客预览,博客园也加了Markdown的格式支持,就更加方便了, ...

  10. Java web.xml加载顺序

     web.xml加载过程(步骤): 1.启动WEB项目的时候,容器(如:Tomcat)会去读它的配置文件web.xml.读两个节点:   <listener></listener&g ...