文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

JS构造函数实例对象和原型对象之间的关系是什么

2024-04-02 19:55

关注

本篇内容介绍了“JS构造函数实例对象和原型对象之间的关系是什么”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

    //自定义构造函数   
     function Person(name,age,gender) 
     {          
         this.name = name;          
         this.age = age;          
         this.gender = gender;          
         this.eat = function () 
         {            
             console.log("吃大蒜拌臭豆腐加榴莲酱");          
         };     
     }

       构造函数---->创建对象per

       var per = new Person('Linda',23,‘female’);

       

       补充:console.dir(per)可以打印出对象per的结构(属性与属性值)       

JS构造函数实例对象和原型对象之间的关系是什么

   以上我们可以得出实例对象与构造函数之间的关系如下:

1. 实例对象是通过构造函数来创建的---创建的过程叫实例化

 2. 如何判断对象是不是某构造器实例化的结果?(推荐第二种

     1) 通过构造器的方式, 即实例对象.构造器==构造函数名字: console.log(dog.constructor==Animal);

     2) 实例对象 instanceof 构造函数名字: console.log(dog instanceof Animal);


构造函数创建对象会带来问题,我们来看以下例子

       function Person(name, age) {
          this.name = name;
          this.age = age;
          this.eat = function () {
            console.log("今天吃红烧土豆");
          }
        }
        var per1 = new Person("小白", 20);
        var per2 = new Person("小黑", 30);
            per1.eat();
            per2.eat();

   JS构造函数实例对象和原型对象之间的关系是什么

    通过打印结果为false可以得出结论per1,per2并不共享eat方法,那么这很容易推论出通过自定义构造函数创建的对象实例并不节约内存空间,以此引出了原型来解决这个问题。

            function Person(name,age) {
                  this.name=name;
                  this.age=age;
             }
             
             //通过原型来添加方法,解决数据共享,节省内存空间
             Person.prototype.eat=function () {
                 console.log("吃凉菜");
             };
                
             var p1=new Person("小明",20);
             var p2=new Person("小红",30);

JS构造函数实例对象和原型对象之间的关系是什么

通过打印结果我们发现p1,p2两个实例对象共享eat方法,实现了数据共享,节省内存空间。但是我们查看实例对象的结构并没有发现eat方法 ,但是对象确实能调用到eat方法,这是什么原因呢?

     接着我们再来查看一下构造函数Person的结构

JS构造函数实例对象和原型对象之间的关系是什么

       通过console.dir(p1)查看对象的结构时,我们发现它除了age,name属性外,还存在一个_proto_属性,值是一个对象,在JavaScript中被称为隐式原型。一个对象的隐式原型指向构造该对象的构造函数的原型prototype, 这也保证了实例能够访问在构造函数原型中定义的属性和方法。

“JS构造函数实例对象和原型对象之间的关系是什么”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注编程网网站,小编将为大家输出更多高质量的实用文章!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯