JS高级中的constructor构造函数

最新推荐文章于 2024-09-15 16:55:54 发布

正在画图的小瓶盖

最新推荐文章于 2024-09-15 16:55:54 发布

阅读量1w

点赞数 17

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/sdybz11zr/article/details/124791190

版权

本文探讨JavaScript中的构造函数与原型对象的constructor属性，解释其在对象实例化过程中的作用。当直接修改原型对象时，constructor属性可能会丢失，需要手动恢复以保持对象与构造函数之间的关联。通过示例展示了如何创建构造函数Star，并在修改原型对象后，如何重新设置constructor属性确保其指向正确的构造函数。

摘要由CSDN通过智能技术生成

1.对象原型__proto__和构造函数原型对象prototype里面都有一个constructor属性

2.constructor 称为构造函数因为它的作用是用于new的实例对象指回构造函数本身

3.constructor 主要用于记录该对象是用于那个构造函数它可以让原型对象prototype重新指向原来构造他的构造函数

注：如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必须手动的利用constructor指回原来的构造函数

我们先创建一个构造函数 Star

构造函数（prototype）原型对象里面都有一个属性 constructor 属性，指回了构造函数Star

    // constructor：指向构造函数本身
        // 作用：1.记录该对象引用于哪个构造函数。 2.它可以让原型对象重新指向原来的构造函数。
        // 该属性位于哪里？？？
        function Star(uname, age) {
            this.uname = uname;
            this.age = age;
        }
        //给构造函数原型prototype对象添加方法
        Star.prototype.sing = function () {
            console.log('我会唱歌');
        };

        Star.prototype.work = function () {
            console.log('我会工作  给你打工   让你压榨我的相对剩余时间');
        };

        
        var smallCaps = new Star('小瓶盖', 18);
        
        console.log(Star.prototype);//star的原型对象prototype

        console.log(Star.prototype.constructor);//指回了star

如果我们修改了原来的原型对象,给原型对象赋值的是一个对象,则必须手动的利用constructor指回原来的构造函数

我的理解：就是直接给prototype赋值了一个对象之前prototype原型里面的constructor属性被覆盖了所以要手动重新添加constructor属性

解决方法手动添加一个constructor属性让其重新值回构造函数Start

  Star.prototype = {
           
            sing: function () {
                console.log('我会唱歌');
            },
            work: function () {
                console.log('我会工作  给你打工   让你压榨我的相对剩余时间');
            }
        }

console.log(Star.prototype.constructor);

控制台输出结果：没有此属性

添加：constructor: Star, //手动添加constructor属性指向Star

        Star.prototype = {
            constructor: Star,   //手动添加constructor属性指向Star
            sing: function () {
                console.log('我会唱歌');
            },
            work: function () {
                console.log('我会工作  给你打工   让你压榨我的相对剩余时间');
            }
        }

        console.log(Star.prototype.constructor);//指向了star；
        console.log(Star.prototype.constructor === Star);