本文探讨JavaScript中覆盖原型对象及修改原型属性对实例的影响。通过Prisoner示例展示如何定义原型、关联构造函数及实例化对象。重点分析当原型属性值被修改时,通过实例访问该属性会触发原型链查找机制,从而返回最新值。文章结合终端输出验证了原型链查询行为,帮助开发者深入理解原型继承与属性查找的实际效果。
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.js运行脚本,观察输出结果。
终端输出验证与原型链查找机制
xxh@xxh-E440:~/workspace$ node t6
4
4
10
4
4
4
接下来探讨一个关键问题:如果修改了原型对象的属性值,会对现有实例产生什么影响?这是理解原型机制的核心所在。
以上关于JavaScript覆盖原型及更改原型的探讨到此结束,希望这些内容能为您提供参考。