javascript - js组合继承中斧正constructor的指向有什么用。-PHP中文网问答

讲师中心微信公众号

首页

文章

后端开发 web前端数据库开发工具 php框架常见问题人工智能 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程自媒体新闻

专题

后端开发 web前端数据库开发工具 php框架人工智能 Java 系统教程电脑教程硬件教程手机教程软件教程游戏教程新闻

AI工具

AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 AI 提示词

学习

大前端后端开发数据库移动端运维开发计算机基础

编程手册

大前端后端开发数据库移动端运维开发计算机基础

下载

js特效网站源码工具下载类库下载网站素材学习资源插件扩展手机游戏

最近更新

javascript - js组合继承中斧正constructor的指向有什么用。

阿神 2017-04-10 17:55:12

[JavaScript讨论组]

454

Friend.prototype.constructor = Friend
原先Friend.prototype.constructor指向的是Person
但是感觉并没有什么用

有没有弹出的结果都一样，感觉都很好完成了继承

function Person(name,age){
            this.name = name;
            this.age = age;
            if(typeof this.sayName != 'function'){
                Person.prototype.sayName = function(){
                    alert(this.name);
                }
            }
        }
        
        var per1 = new Person('zhang',23);
        var per2 = new Person('wagn',23);

        
        function Friend(name,age,sex){
            Person.call(this,name,age);
            this.sex = sex;
        } 
            Friend.prototype = new Person();
            Friend.prototype.constructor = Friend; //不斧正时，constructor指向Person
            Friend.prototype.saySex=function(){
                alert(this.sex);
            }
        
        var fri1 = new Friend('wang','11','nan');
        var fri2 = new Friend('li','55','nv');

        alert(Person.prototype.constructor);

阿神

闭关修行中......

全部回复(5)

巴扎黑2017-04-10 17:57:12 5楼

用ES6的class语法理解应该会好一点，手机回复，可以先参考mdn，如果不能理解，稍后补全。

更新：
看完其它评论才发现自己理解基础知识也是有时没有太深入，导致一时也不能很好的回复这个问题，但是既然回复了，还是好好的编辑一下自己理解的答案。
用ES6简化了下：

    class Person {

    }

    class Friend extends Person {

    }
    
    console.log('%O', Person.prototype.constructor); // Person
    console.log('%O', Friend.prototype.constructor); // Friend

ES6中已经修复了这个constructor，始终指向类本身
用ES5简化下：

    function Person() {
    
    }
    
    function Friend() {
    
    }
    
    Friend.prototype = new Person();
    // Friend.prototype.constructor = Friend;
    console.log('%O', Person.prototype.constructor); // Person
    console.log('%O', Friend.prototype.constructor); // Person

为什么Friend.prototype.constructor也是Person，这里题主是知道的。我还是自己学习再次总结下，因为实例化Person类时返回的对象中的constructor是Person本身，但是在后续实例化等过程中不会直接使用到constructor，但是出于对该函数本身的含义的理解，于是我们修正了constructor。

constructor 的含义是返回指向创建了该对象原型的函数引用

相关应用例子：

var f = (function() {
    function Person() {
    
    }
    
    function Friend() {
    
    }
    
    Friend.prototype = new Person();
    // Friend.prototype.constructor = Friend;
    return new Friend();
}())
// 如果需要扩展原型方法
f.constructor.prototype.sayHello = function() {
    console.log('hello');
}
f.sayHello(); // hello
console.log(f);

通过上面的例子可以看出修正了的constructor与没有修改的差别是扩展的sayHello方法在原型链上加的位置不一样了。