浅谈JavaScript 覆盖原型以及更改原型

 更新时间:2016年08月31日 09:07:53   投稿:jingxian  
下面小编就为大家带来一篇浅谈JavaScript 覆盖原型以及更改原型。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随过来看看吧

覆盖原型

//囚犯示例 
//1.定义原型对象 
var proto = { 
 sentence : 4, //监禁年限 
 probation: 2 //缓刑年限 
}; 
//2.定义原型对象的构造函数 
var Prisoner = function(name, id) { 
 this.name = name; 
 this.id = id; 
}; 
//3.将构造函数关联到原型 
Prisoner.prototype = proto; 
//4.实例化对象——采用工厂函数实例化对象 
var makePrisoner = function(name, id) { 
 //采用工厂函数实力化对象prisoner 
 var prisoner = Object.create( proto ); 
 prisoner.name = name; 
 prisoner.id = id; 
 return prisoner; 
}; 
 
var firstPrisoner = makePrisoner( 'Joe', '12A' ); 
 
//firstPrisoner.sentence在firstPrisoner对象找不到sentence属性, 
//所以查找对象的原型并找到了Both of these output 4 
console.log( firstPrisoner.sentence ); 
console.log( firstPrisoner.__proto__.sentence ); 
//把对象的sentence属性设置为10 
firstPrisoner.sentence = 10; 
//outputs 10 
//确定对象上的属性值已设置为10 
console.log( firstPrisoner.sentence ); 
//但是对象的原型并没有变化,值仍然为4 
console.log( firstPrisoner.__proto__.sentence ); 
//为了使获取到的属性回到原型的值,将属性从对象上删除 
delete firstPrisoner.sentence; 
//接下来,JavaScript引擎在对象上不能再找到该属性, 
//必须回头去查找原型链,并在原型对象上找到该属性 
// Both of these output 4 
console.log( firstPrisoner.sentence ); 
console.log( firstPrisoner.__proto__.sentence );

ubuntu 终端node输出

xxh@xxh-E440:~/workspace$ node t6 
4 
4 
10 
4 
4 
4 

那么如果改变了原型对象的属性值,会发生什么呢?我知道你在思考。

以上这篇浅谈JavaScript 覆盖原型以及更改原型就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • js 触发select onchange事件代码

    js 触发select onchange事件代码

    select 或text的onchange事件需要手动(通过键盘输入)改变select或text的值才能触发,本文为大家介绍下使用js触发select onchange事件
    2014-03-03
  • 微信小程序用户自定义模版用法实例分析

    微信小程序用户自定义模版用法实例分析

    这篇文章主要介绍了微信小程序用户自定义模版用法,结合实例形式较为详细的分析了微信小程序自定义模板的定义、数据调用、布局设置等简单使用技巧,需要的朋友可以参考下
    2017-11-11
  • 关于JavaScript的单双引号嵌套问题

    关于JavaScript的单双引号嵌套问题

    单引号和双引号之间可以相互嵌套。接下来通过本文给大家介绍JavaScript的单双引号嵌套问题 ,感兴趣的朋友一起看看吧
    2017-08-08
  • JS/HTML5游戏常用算法之追踪算法实例详解

    JS/HTML5游戏常用算法之追踪算法实例详解

    这篇文章主要介绍了JS/HTML5游戏常用算法之追踪算法,结合吃豆人游戏的算法原理以实例形式详细分析了追踪算法的相关算法操作技巧与注意事项,需要的朋友可以参考下
    2018-12-12
  • JavaScript中前后端交互Ajax示例详解

    JavaScript中前后端交互Ajax示例详解

    Ajax不是一种新的编程语言,而是使用现有标准的新方法,下面这篇文章主要给大家介绍了关于JavaScript中前后端交互Ajax的相关资料,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2024-03-03
  • js处理包含中文的字符串实例

    js处理包含中文的字符串实例

    下面小编就为大家带来一篇js处理包含中文的字符串实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-10-10
  • JavaScript中关于字符串替换与截取的知识点汇总

    JavaScript中关于字符串替换与截取的知识点汇总

    在日常开发中,经常遇到针对字符串的替换、截取,知识点比较碎容易混淆,所以本文为大家整理了一下相关的知识点,希望对大家有所帮助
    2023-05-05
  • JavaScript加强之自定义event事件

    JavaScript加强之自定义event事件

    event事件在本文以自定义的方式出现,感兴趣的朋友可以参考下,希望对大家有所帮助
    2013-09-09
  • js面向对象之静态方法和静态属性实例分析

    js面向对象之静态方法和静态属性实例分析

    这篇文章主要介绍了js面向对象之静态方法和静态属性,实例分析了静态方法和静态属性的原理及应用,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-01-01
  • JS组件Bootstrap实现弹出框和提示框效果代码

    JS组件Bootstrap实现弹出框和提示框效果代码

    这篇文章主要介绍了JS组件Bootstrap实现弹出框和提示框效果代码,对弹出框和提示框感兴趣的小伙伴们可以参考一下
    2015-12-12

最新评论