什么是原型
原型是定义函数时,由js自动分配给函数的一个可以被所有构造函数实例变量对象共享的对象变量,也叫对象属性。
为什么要用原型?
原型上的所有属性和方法都可以被构造函数的实例所共享。(一旦对这个属性或者方法进行修改,所有实例的的访问结果也都修改了)
每new一个对象出来,都会在堆中开辟一段内存,用来存储这个变量。对象之间相同的属性和方法,就可以挂载到构造函数的原型对象空间,就不用为每一个对象分配单独的属性空间,可以在一定程度上减少空间浪费
function Person (name, age) {
this.name = name;
this.age = age
}
Person.prototype.love = function () {
return ['money', 'girl', '健身']
}
const person1 = new Person('luccy', 20)
console.log("person1.name====", person1.name);//person1.name==== luccy
console.log("person1.age====", person1.age);//person1.age==== 20
console.log(person1.love());//[ 'money', 'girl', '健身' ]
const person2 = new Person('luffy', 18)
console.log("person2.name====", person2.name);//person2.name==== luffy
console.log("person2.age====", person2.age);//person2.age==== 18
console.log(person2.love());//[ 'money', 'girl', '健身' ]
Person.prototype.love = function () {
return ['money', 'girl', '健身', 'hhhh']
}
console.log("修改后person1.love===", person1.love());
//修改后person1.love=== [ 'money', 'girl', '健身', 'hhhh' ]
console.log("修改后person2.love===", person2.love());
//修改后person2.love=== [ 'money', 'girl', '健身', 'hhhh' ]
易错题目
题目1
let obj = {
name: 'jjjj'
}
obj = {
name: 'xxx'
}
console.log(obj);// { name: 'xxx' }
分析
这种重新赋值的方式,相当于修改了obj的指针---> obj存的是地址,这个地址指向堆中对应的存储空间。 重新赋值以后,比喻成钥匙和房间的关系,现在给了obj一个新的钥匙,这把钥匙只能打开{ name: ‘xxx’ }的门。之前的房间,也就打不开了
题目2
let obj = { name: 'jjjj' }
let obj1 = obj;
console.log("obj1", obj1);//obj1 { name: 'jjjj' }
obj = { name: 'hhhh' }
console.log("obj", obj);// obj { name: 'hhhh' }
console.log("obj1", obj1);//obj1 { name: 'jjjj' }
分析
还是用钥匙和房间的关系来比喻:
obj的钥匙,是能开 { name : 'jjj' } 的门,然后,obj把钥匙给了obj1一把。这个时候,obj obj1 都能开这个房间。 后面,把obj的钥匙,换成了 { name :'hhhh'} 的房间。obj就打不开之前的房间。但是并不影响obj1的钥匙。他俩没有捆绑到一起的关系
题目3
function fn (name) { this.name = name }
fn.prototype.commonData = [1, 2, 3]
fn.prototype = { commonData: [1, 2, 3, 4, 5] }
let fn1 = new fn('李华')
console.log(fn1.commonData);//[1, 2, 3, 4, 5]
分析
fn.prototype去赋值一个新对象以后,就变成了普通的对象属性。于是就和上一题一样