共计 1042 个字符,预计需要花费 3 分钟才能阅读完成。
前言
最近在学习数据结构,在学习树的时候,忽然想起 js 的类的函数定义在构造函数外部和内部有什么区别,于是上网查了一下总结一下。
区别
- 在构造函数内定义的函数,会在类创立的实例的属性上,毛病是节约内存,因为每次创立实例都会反复该函数。
- 在构造函数外定义的函数,会在类的属性上,在类创立的实例的原型上,实例能够调用该办法,看见一篇文,说这样只会创立一个函数,在类上,这样节约内存,实例在调用办法的时候,先从本身属性上查找,如果找不到,就会向上找。
class Demo {constructor(name){ | |
this.name=name; | |
// 构造函数中定义函数,将会在每个实例中存在改函数的属性 | |
this.getNameIn = ()=>{console.log(this.name,'getNameIn') | |
} | |
// this.getNameOut = this.getNameOut.bind(this); | |
} | |
// 构造函数里面定义函数,将会存在这个实例的原型链上,实例遍历原型链获取改函数 | |
getNameOut (){console.log(this.name,'getNameOut') | |
} | |
// 此时留神的是写箭头函数,和在构造函数外面写一样,会绑定在实例的属性上。getName=()=>{console.log(this.name,'getNameOut') | |
} | |
} | |
const demo1 = new Demo('Lillian'); | |
const demo2 = new Demo('Lillian'); | |
console.log(demo1.__proto__.getNameIn) | |
console.log(demo1.__proto__.getName) | |
console.log(demo1.__proto__.getNameOut) | |
console.log(demo1.getNameIn===demo2.getNameIn) | |
console.log(demo1.getNameOut===demo2.getNameOut) | |
console.log(Object.getOwnPropertyNames(demo1)) | |
console.log(Demo.prototype) | |
console.log(Demo.prototype.getNameOut) | |
demo1.getNameIn(); | |
demo1.getNameOut(); |
输入内容
留神
- 在构造函数外应用一般函数定义的办法,他会在类的属性上。
- 在构造函数外应用箭头函数定义的办法,他会在类的实例的属性上。
正文完
发表至: javascript
2020-11-23