关于Javascript中通过实例对象修改原型对象属性值的问题
Javascript中的数据值有两大类:基本类型的数据值和引用类型的数据值。
基本类型的数据值有5种:null、undefined、number、boolean和string。
引用类型的数据值往大的说就1种,即Object类型。往细的说有:Object类型、Array类型、Date类型、Regexp类型、Function类型等。
当原型对象的属性值为基本类型的数据值时,通过实例对象修改属性值从而引起原型对象的属性值发生变化的情况不会发生。当原型对象的属性值为引用类型的数据值时,通过实例对象修改属性值就可能引起原型对象的属性值发生变化。下面举例说明。
例1:
function Animal() {}
Animal.prototype = {
constructor: Animal,
number: "very much",
fish: ["shark","sardine"],
bird:{
ability: "fly",
feature: "feather"
}
};
var animal1 = new Animal();
var animal2 = new Animal();
//没有改变原型的number属性,而是自己获得了number属性
animal1.number = 1000;
console.log(animal2.number);//very much
上例中通过构造函数Animal创建了两个实例对象,两个实例对象继承了同一个原型对象的属性。通过实例对象animal1重新设置了number属性,结果是实例对象animal1拥有了自己的number属性,没有改变原型对象的number属性值,实例对象animal2调用的number属性还是原型对象原来的number属性。
例2:
function Animal() {}
Animal.prototype = {
constructor: Animal,
number: "very much",
fish: ["shark","sardine"],
bird:{
ability: "fly",
feature: "feather"
}
};
var animal1 = new Animal();
var animal2 = new Animal();
var animal3 = new Animal();
//没有改写原型中的fish属性,此时animal1实例对象中有了自己的fish属性,向其自己的fish属性中推入和弹出项不会改变原型的fish属性。
animal1.fish = ["cold fish"];
for (var i=0;i<animal2.fish.length;i++) {
console.log(animal2.fish[i]);//shark,sardine,没有cold fish
}
//通过实例对象animal3向fish属性中推入项,改变了原型对象的fish属性,因为实例对象中没有自己的fish属性
animal3.fish.push("voladao");
animal3.fish[0] = "fly fish";
for (var i=0;i<animal2.fish.length;i++) {
console.log(animal2.fish[i]);//fly fish,sardine,voladao
}
例2中实例对象animal1创建了自己的fish属性,没有改变原型对象的fish属性,所以实例对象animal2输出的还是原型对象的fish属性。
实例对象animal3没有自己的fish属性,但通过实例对象animal3向fish属性中推入了一项,并且改变了其中的第一项的值,这些改变都发生在了原型对象的fish属性上,所以实例对象animal2调用fish属性时,其属性值发生了变化。
例3:
function Animal() {}
Animal.prototype = {
constructor: Animal,
number: "very much",
fish: ["shark","sardine"],
bird:{
ability: "fly",
feature: "feather"
}
}
var animal1 = new Animal();
var animal2 = new Animal();
var animal3 = new Animal();
var animal4 = new Animal();
var animal5 = new Animal();
//改写了原型中的bird属性
animal1.bird.ability = "run";
console.log(animal2.bird.ability);//run
//创建animal3的bird属性,没有改变原型对象的bird属性
animal3.bird = {
eat: "fish"
};
console.log(animal4.bird.eat);//undifined
console.log(animal3.bird.eat);//fish
animal5.bird.home = "tree";
console.log(animal4.bird.home);//tree
例3中通过实例对象animal1修改了bird属性的ability属性的值,实例对象animal1没有自己的bird属性,这个修改反映在了原型对象的bird属性上,实例对象animal2输出的bird.ability的值是改变后的值。
实例对象animal3创建了自己的bird属性,这没有改变原型对象的bird属性,所以实例对象4的bird.eat的值为undifined。
通过实例对象animal5添加了bird属性的home属性,实例对象animal5没有自己的bird属性,这个home属性添加到了原型对象的bird属性上,所以animal4的bird.home的值为tree。
至于其他的引用类型的数据值有没有以上特性,暂时还没有想到怎么验证,先这样吧。
关于Javascript中通过实例对象修改原型对象属性值的问题的更多相关文章
- js高级——构造函数,实例对象和原型对象——prototype、__proto__和constructor构造器
一.前言 了解JavaScript面向对象,需要先了解三个名词: 构造函数,实例对象和原型对象. 注意:JavaScript中没有类(class)的概念,取而代之的是构造函数,两者类似却又有很大的差别 ...
- 怎样修改原型对象prototype
修改原型对象的方法分为两种情况, 一种是对原型对象的属性方法做增删改, 一种改变原型对象的指向. 第一种: 对原型对象的属性/方法做增删改 function Person(name){ this.na ...
- JS高级---构造函数,实例对象和原型对象,三者关系
构造函数,实例对象和原型对象,三者关系 构造函数里面有原型(prototype)属性,即原型对象 原型对象里的constryctor构造器指向构造函数 通过构造函数,实例化,创建的就是实例对象. 实例 ...
- JavaScript中两种类型的全局对象/函数【转】
Snandy Stop, thinking is the essence of progress. JavaScript中两种类型的全局对象/函数 这里所说的JavaScript指浏览器环境中的包括宿 ...
- JS对象 JavaScript 中的所有事物都是对象,如:字符串、数值、数组、函数等,每个对象带有属性和方法。
什么是对象 JavaScript 中的所有事物都是对象,如:字符串.数值.数组.函数等,每个对象带有属性和方法. 对象的属性:反映该对象某些特定的性质的,如:字符串的长度.图像的长宽等: 对象的方法: ...
- JavaScript学习系列博客_24_JavaScript 原型对象
原型(prototype) - 创建一个函数(所有函数)以后,解析器都会默认在函数中添加一个属性prototype prototype属性指向的是一个对象,这个对象我们称为原型对象. 创建一个函数My ...
- ListView与.FindControl()方法的简单练习 #2 -- ItemUpdting事件中抓取「修改后」的值
原文出處 http://www.dotblogs.com.tw/mis2000lab/archive/2013/06/24/listview_itemupdating_findcontrol_201 ...
- js sort方法根据数组中对象的某一个属性值进行排序(实用方法)
js sort方法根据数组中对象的某一个属性值进行排序 sort方法接收一个函数作为参数,这里嵌套一层函数用来接收对象属性名,其他部分代码与正常使用sort方法相同. var arr = [ {nam ...
- tween.js是一款可生成平滑动画效果的js动画库。tween.js允许你以平滑的方式修改元素的属性值。它可以通过设置生成各种类似CSS3的动画效果。
简要教程 tween.js是一款可生成平滑动画效果的js动画库.相关的动画库插件还有:snabbt.js 强大的jQuery动画库插件和Tweene-超级强大的jQuery动画代理插件. tween. ...
随机推荐
- Struts 2的数据校验
既然说到了Struts 2的数据校验,我们该怎么去实现呢?又是通过什么来实现呢? 就让我带着大家一起来走进Struts 2的数据校验吧. 首先我们会想到在Stuts 2的登录案例中我们定义了一个Act ...
- USACO翻译:USACO 2012 JAN三题(3)
USACO 2012JAN(题目三) 一.题目概览 中文题目名称 放牧 登山 奶牛排队 英文题目名称 grazing climb lineup 可执行文件名 grazing climb lineup ...
- C语言系统时间读取
1 读出系统时间(每隔一秒)#include#includeint main(){ while(1) { time_t t; t= time(0); struct tm *p; ...
- Python基本数据类型——str
字符串常用操作 移除空白 分割 长度 索引 切片 class str(basestring): """ str(object='') -> string Retur ...
- Unity学习疑问记录之协程
http://blog.csdn.net/huang9012/article/details/38492937 总结:1.协程相当于多线程但不是,(尽管它们看上去是这样的),它们运行在同一线程中,跟普 ...
- 对改善ABP的一些建议
园子里有不少同学对ABP框架很感兴趣,而且也已经将ABP用在了商用项目中,有些可能还在操练阶段.一般来说,我们使用ABP默认的一些功能已经足够了,但还是有很多人想要自己拓展一些功能而自己实现不了或者说 ...
- Google分布式构建软件之三:分布式执行构建步骤
注:本文英文原文在google开发者工具组的博客上[需要FQ],以下是我的翻译,欢迎转载,但请尊重作者版权,注名原文地址. 之前两篇文章分别介绍了Google 分布式软件构建系统Blaze相关的为了提 ...
- Morris.js和flot绘制折线图的比较
[文章摘要] 最近用开源的AdminLTE做框架感觉效果特别好,其针对图表库Morris.js和flot都提供了不错的支持,也都提供了这两者的例子.不过Morris.js是基于Raphael.js来的 ...
- Linux LVM逻辑卷
概述 LVM的产生是因为传统的分区一旦分区好后就无法在线扩充空间,也存在一些工具能实现在线扩充空间但是还是会面临数据损坏的风险:传统的分区当分区空间不足时,一般的解决办法是再创建一个更大的分区将原分区 ...
- ASP.NET MVC 过滤器(五)
ASP.NET MVC 过滤器(五) 前言 上篇对了行为过滤器的使用做了讲解,如果在控制器行为的执行中遇到了异常怎么办呢?没关系,还好框架给我们提供了异常过滤器,在本篇中将会对异常过滤器的使用做一个大 ...