构造函数的属性和方法

一、构造函数内定义的属性/方法
function Fn(name){
  this.name=name;
};
var a = new Fn('张三');
var b = new Fn('李四');
console.log(a.name)//张三
console.log(b.name)//李四

可以看出:构造函数内定义的属性/方法,对实例来说是不共享的,每一个实例都有各自的一份。互不影响!!

二、被继承的原型对象中属性/方法
function Fn(name){
  this.name=name;
};
Fn.prototype.age='13'
var a = new Fn('张三');
var b = new Fn('李四');
console.log(a.name)//张三
console.log(b.name)//李四
console.log(a.age)//13
console.log(b.age)//13

可以看出:被继承的原型对象中属性/方法是共享的,所有实例全可以共享其构造函数中原型对象的属性/方法;

误导
function Fn(name){
  this.name=name;
};
Fn.prototype.age='13'
var a = new Fn('张三');
var b = new Fn('李四');
Fn.prototype={
	url:'www.baidu.com'
}
console.log(a.name)//张三
console.log(b.name)//李四
console.log(a.age)//13
console.log(b.age)//13
console.log(a.url)//undefined
console.log(b.url)//undefined

既然原型对象属性共享,那么为什么整体置换了原型对象的时候不应该打印下面那种情况吗?为什么不是呢?

console.log(a.name)//张三
console.log(b.name)//李四
console.log(a.age)//undefined
console.log(b.age)//undefined
console.log(a.url)//www.baidu.com
console.log(b.url)//www.baidu.com

原因是:在置换构造函数的原型对象的时候,实例a和实例b已经创立了;
此时:a 和 b 的 _proto_指向的是之前的原型对象;现在的原型对象实质就是将prototype指向一个新的对象;和之前的原型对象没有关系!
如果写成这样,那就是你想的那样子了!

function Fn(name){
  this.name=name;
};
Fn.prototype.age='13'
Fn.prototype={
	url:'www.baidu.com'
}
var a = new Fn('张三');
var b = new Fn('李四');
console.log(a.name)//张三
console.log(b.name)//李四
console.log(a.age)//undefined
console.log(b.age)//undefined
console.log(a.url)//www.baidu.com
console.log(b.url)//www.baidu.com

那如果既想把置换原型的方法写在创造实例之后,又想成功置换,该怎么办呢?很简单 只需要通过_proto_把指针指向新的原型对象即可!
请看代码↓

function Fn(name){
  this.name=name;
};
Fn.prototype.age='13'
var a = new Fn('张三');
var b = new Fn('李四');
Fn.prototype={
	url:'www.baidu.com'
}
//实例通过__proto__把指针指向新置换的原型对象
a.__proto__=Fn.prototype;
b.__proto__=Fn.prototype;
console.log(a.name)//张三
console.log(b.name)//李四
console.log(a.age)//undefined
console.log(b.age)//undefined
console.log(a.url)//www.baidu.com
console.log(b.url)//www.baidu.com

完!
如理解有误,请评论区指出,立马改正!谢谢

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章