原型上小心被共享

Posted on | In | 
1
2
3
4
5
6
7
8
9
10
11
12
function Person() {
}
Person.prototype.friends = ["abigale"]
Person.prototype.sayFriends = function() {
    console.log(this.friends)
}
let p1 = new Person()
let p2 = new Person()
p1.friends.push('ypc')
p2.sayFriends() // [ 'abigale', 'ypc' ]

我们在 实例 p1 上添加了一个朋友，但从 实例p2 打印出朋友名单却意外得出加在 p1 上的朋友，这是因为 （画重点）

  • 包含引用类型值得原型属性会被所有实例共享
  • JavaScript对象是通过引用来传递的，我们创建的每个新对象实体中并没有一份属于自己的原型副本，当我们修改原型时，与之相关的对象也会继承这一改变。

另一种情况，等同于上述

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
function Person() {
    this.friends = ['abigale']
}
Person.prototype.sayFriends = function() {
    console.log(this.friends)
}
function SubPerson() {
}
SubPerson.prototype = new Person();
let p1 = new SubPerson()
let p2 = new SubPerson()
p1.friends.push('ypc')
p2.sayFriends()

第二种示例，其实就是SubPerson.prototype.friends 它是共享的

如果将上面数组类型改成基本类型就不会出现这种情况了，如Person.prototype.friends = 'abigale'