原型陷阱:

在处理原型问题上时,我们要注意两种行为。

  1. 当我们对原型对象执行完全替换的时候,有可能会触发原型链的某种异常。

  2. prototype.constructor 属性是不可靠的。

下面,我们新建一个构造函数,并创建两个对象:

var her = fucntion(){
    this.name = 'Anna';
}
var she1 = her();
var she2 = her();

即使在对象she1和she2对象被创建之后,我们仍然可以对her()的原型添加属性,并且之前创建的这些对象也可以访问这些属性。

her.prototype.say = function(){
    return 'Hello'
}
she1.say(); // Hello
she2.say(); // Hello

如果我们检查一下这些对象的构造函数,会发现一切正常:

she1.constructor === her;  // true
she2.constructor === her;  // true

现在,我们用一个新对象覆盖掉该构造函数的原型对象:

her.prototype = {
    sex : 'women',
    height : '170cm'
}

事实证明,原有对象不能访问这些新增属性了,但原有对象们与她们的构造函数还保持着一种神秘的联系:

she1.sex; // undefinedshe1.say(); // Hello

而我们之后创建的对象使用的或访问的都是更新过后的prototype对象。

var a = her();
a.say(); // a.say() is not defined;
a.sex = 'women';

这时候,新对象的constructor就不会在指向her()了,而是指向Object().

a.constructor;  // function Object(){}she1.constructor; // function her(){this.name = 'Anna'}

当然我们可以设置constructor属性的指向来解决上述异常:

function her(){};
her.prototype = {};
new her().constructor === her;  // false
her.prototype.constructor = her;
new her().constructor === her; // true

当我们重写prototype对象的时候,一定要重置prototype的constructor属性。

  就是辣么酸爽

javascript --- 原型初探七日谈(三)的更多相关文章

  1. javascript --- 原型初探七日谈(一)

    在javascript中,像原型,闭包这样的概念,只要我们能领悟其中的原理,一切都会显得格外清晰与明了. 原型属性(prototype): 下面我们简单定义一个函数 function her(a, b ...

  2. javascript --- 原型初探七日谈(二)

    扩展内建对象: 在javascript中,内建对象的构造函数都是可以通过其原型来进行扩展的.这意味着我们可以做一些事情,例如我们要往数组原型中添加一个新方法,就可以在其所有的数组中使用,下面我们来试试 ...

  3. javascript --- 继承初探七日谈 (一)

    原型链是javascript实现继承的默认方式.下面来一个例子看一下她的魔法吧: 首先定义三个构造函数: function her(){ this.name = 'Anna'; this.toStri ...

  4. javascript 函数初探 (三)--- javascript 变量的作用域

    javascript 变量的作用域: 这是一个至关重要的问题.特别是当我们从别的语言转向javascript时,必须要明白一点,即在javascript中,变量的定义并不是以代码块作为作用域的,而是以 ...

  5. javascript 对象初探 (三)--- 传递/比较对象

    传递对象 当我们拷贝某个对象或者将对象传递给某个函数时,往往传递的都是该对象的引用.因此我们在该对象的引用上做任何改动,实际上都会影响到引用的原对象. var she = {num:1}; var h ...

  6. 浅谈系列之 javascript原型与对象

    在我学习与使用javascript三个月中,我一直对javascript的继承关系以及prototype理解不清,导致很多时候为什么这么用说不出个所以然来.截止到本周为止,通过之前的学习以及自己的再学 ...

  7. JavaScript原型OOP——你上车了吗?

    .title-bar { width: 80%; height: 35px; padding-left: 35px; color: white; line-height: 35px; font-siz ...

  8. Javascript模块化编程(三):require.js的用法

    Javascript模块化编程(三):require.js的用法 原文地址:http://www.ruanyifeng.com/blog/2012/11/require_js.html 作者: 阮一峰 ...

  9. Javascript基础回顾 之(三) 面向对象

    本来是要继续由浅入深表达式系列最后一篇的,但是最近团队突然就忙起来了,从来没有过的忙!不过喜欢表达式的朋友请放心,已经在写了:) 在工作当中发现大家对Javascript的一些基本原理普遍存在这里或者 ...

随机推荐

  1. 使用Nginx配置NodeJs程序(Windows平台)

    简介 Nginx("engine x") 是一个高性能的 HTTP 和 反向代理 服务器,也是一个 IMAP/POP3/SMTP 服务器. Nginx 是由 Igor Sysoev ...

  2. 蒙特·卡罗算法的Python实现

    一 背景 此算法诞生的背景是: 曼哈顿计划,有极大的计算需求. 计算机刚开始发展,最适合做计算. 蒙特卡洛算法理论基础是概率论,实际就是暴力计算逼近理想结果.正是在以上两个背景下,它刚好得到了极大的应 ...

  3. Deep learning:五十(Deconvolution Network简单理解)

    深度网络结构是由多个单层网络叠加而成的,而常见的单层网络按照编码解码情况可以分为下面3类: 既有encoder部分也有decoder部分:比如常见的RBM系列(由RBM可构成的DBM, DBN等),a ...

  4. 解决VS Code调试.NET Core应用遇到的坑

    为什么会有”坑“ 博客园里有好多介绍怎么使用VS Code以及调试.NET Core的文章,但是都是基于直接构建Asp.Net Core Mvc单项目的,有什么区别呢! (1).我们这次遇到的坑是在多 ...

  5. 博客已经转移到http://geekori.cn,本博客不再更新

    已经建立了独立博客:极客起源(http://geekori.cn),并将大部分博文已经转移到新的博客,本博客不再更新.

  6. Socket.Available 属性

    获取已经从网络接收且可供读取的数据量. 命名空间:   System.Net.Sockets程序集:  System(System.dll 中) 从网络接收的.可供读取的数据的字节数. 异常   Ex ...

  7. Spring MVC 对于@ModelAttribute 、@SessionAttributes 的详细处理流程

    初学 Spring MVC , 感觉对于 @ModelAttribute 和 @SessionAttributes 是如何被Spring MVC处理的,这一流程不是很清楚, 经过Google资料,有了 ...

  8. jQuery uploadify在谷歌和火狐浏览器下无法上传

    原因: 由于jQuery uploadify是借助flash来实现上传的,每一次向后台发送数据流请求时,ie会自动把本地cookie存储捆绑在一起发送给服务器.但firefox.chrome不会这样做 ...

  9. Winform开发中常见界面的DevExpress处理操作

    我们在开发Winform程序的时候,需要经常性的对界面的一些控件进行初始化,或者经常简单的封装,以方便我们在界面设计过程中反复使用.本文主要介绍在我的一些项目中经常性的界面处理操作和代码,以便为大家开 ...

  10. CIO:让IT成为企业的一种竞争优势

    在你的公司,IT是将自己视为服务提供者,业务部门的合作伙伴,还是创新驱动者?其他部门的领导者是怎么看待IT的?在老板的眼里,IT是如何的一个定位?在过去一年的,身为企业的CIO,你是否知道哪些应用或新 ...