为什么网站后台怎么换图片,个体户网站备案,p图做网站兼职,漂亮logo图片目录
一、问题引出
二、prototype原型对象
三、小结
四、constructor
五、__proto__对象原型
六、原型链 一、问题引出
由于JS的构造函数存在内存浪费问题#xff1a; function Star(name,age){this.namenamethis.ageagethis.singfunction () {console.log(唱歌 function Star(name,age){this.namenamethis.ageagethis.singfunction () {console.log(唱歌)}}let star01new Star(Jack,18)let star02new Star(Mark,20)console.log(star01.singstar02.sing)
打印不同实例对象的动态方法是不同的会开出新的内存区域用于存储相同的方法。 对此问题提出了原型处理方法。
二、prototype原型对象
我们可以将不变的方法直接定义在prototype属性中以减少内存开销。 对上面的问题代码进行优化 function Star(name,age){this.namenamethis.ageage}Star.prototype.singfunction (){console.log(唱歌)}let star01new Star(Jack,18)let star02new Star(Mark,20)console.log(star01.singstar02.sing)
打印可以看到两个实例对象的该方法是同一个证明都使用了同一个原型里的方法没有新开内存拷贝。 三、小结
1、公共属性写到构造函数里
2、公共函数写到prototype原型对象里
3、构造函数里的this就是指向实例化的对象
4、原型对象里的this还是指向实例化的对象。 四、constructor
prototype里的属性constructor属性就是帮原型确定它的构造函数是谁如构造函数Star的prototype里的constructor属性就是指向Star构造函数的。
作用指向原型对象的构造函数。 function Star(){}console.log(Star.prototype)Star.prototype{sing:function (){console.log(唱歌)},dance:function (){console.log(跳舞)}}console.log(Star.prototype)
打印没构造前有constructor属性构造后没有了
可以看到上面这种写法直接给prototype赋值了新值没有了constructor对象标识正确写法应该是 function Star() {}console.log(Star.prototype)Star.prototype {//重新指回这个原型的构造函数 Starconstructor: Star,sing: function () {console.log(唱歌)},dance: function () {console.log(跳舞)}}console.log(Star.prototype)
打印 五、__proto__对象原型
每个实例化的对象都有一个__proto__而这个__proto__就是指向构造函数的prototype对象的。这样一来每个实例化对象都可以访问prototype里的数据了。 1、这是一个只读属性
2、 function Star() {}const star01new Star()console.log(star01.__proto__ Star.prototype)
打印这里可以看到__proto__指向的是构造函数的原型对象 此外__proto__实例化对象的原型中也有constructor并且是指向prototype原型对象中的constructor的。 六、原型链
只要是对象就是__proto__prototype对象中也有__proto__属性我们按照prototype的__proto__可以一级一级的指向到最顶层Object.prototype.__proto__指向为null。 使用场景比如某个对象需要调用一个方法而这个方法在当前对象里没有就会向上一级查找是否有该方法若仍然没有再往上寻找prototype里是否有该方法依次类推直至到顶层prototype里查找指向为null时结束查找。
可以通过instanceof来判断对象是否在一个原型链上。