zoukankan      html  css  js  c++  java
  • 构造函数与实例化之间的关系和原型的引入

    我对构造函数与实例化之间的理解

    当我们的编程是面向对象的时候,
    先是抽象的过程=>然后实例化的过程
    比如我们抽象一个人,我知道一个人的基本信息。
    名称,年龄,性别,....等等
    我们把先是抽象的,在抽象完成后,我们在实例化。
    

    构造函数与实例化之间的关系?

    //这个自定义的构造函数在抽象
    function Person(name,age,sex){
        this.name=name;
        this.age=age;
        this.sex=sex;
        this.say=function(){
            console.log("我叫",name)
        }
    }
    // 这个过程是实例化
    let per1=new Person('司藤',300,'女');
    per1.say();//调用
    
    
    //let per1=new Person('司藤',300,'女');
    通过上面这一行代码。
    我们可以得出一个结论:
    构造函数与实例对象之间的关系是:
    实例对象需要通过构造函数来创建的。
    同时:我们可以知道实例对象的构造器就是构造函数
    我们来证明这一句话是否正确;上面的代码不改变。
    console.log( per1.constructor===Person ) //返回的是true
    充分说明:实例对象的构造器就是构造函数这一句话是正确的。
    

    per1.say是否等于per2.say

     function Person(name,age,like) {
        this.name=name;
        this.age=age;
        this.like=like;
        this.say=function(){
            console.log('我可以不吃饭');
        }
    }
    var per1=new Person("司藤",300,'耍');
    var per2=new Person('白浅','10000','耍');
    per1.say();
    per2.say();
    console.log( per1.say==per2.say ) //false
    

    per1.say不等于per2.say得出的结论

    因为console.log( per1.say==per2.say ) //false
    我们可以得出一个结论。
    那就是per1.say()和per2.say()调用的不是同一个方法
    
    那么他们的内容是否是相等的的呢?
    console.log( per1.say()==per2.say() ) //true
    说明内容是相等的
    

    康康下面这一段代码出现的问题

    function Person(name,age,like) {
        this.name=name;
        this.age=age;
        this.like=like;
        this.say=function(){
            console.log('我可以不吃饭');
        }
    };
    for (var index = 0; index < 100; index++) {
        var per=new Person("司藤",300,'耍');
        per.say();
    }
    
    这一段代码是它在内存中开辟了100个空间。
    每个空间都有一个say方法。
    但是每一个say方法都是不同的。可是他们输出的内容是相同。
    或者说执行的逻辑是相同的。
    这样就造成了空间浪费。
    所以在项目中,这样就造成了浪费空间。
    我们可不可以来优化呢 ?
    

    优化代码解决造成空间浪费

    function comSay(){
        // 执行相同的逻辑
        console.log('我可以不吃饭')
    };
    
    function Person(name,age,like) {
        this.name=name;
        this.age=age;
        this.like=like;
        this.say=comSay;//不要加括号
    };
    var per1=new Person("司藤",300,'耍');
    var per2=new Person('白浅','10000','耍');
    console.log( per1.say==per2.say ) //true
    
    这样我们就节约了空间。
    每次调用的时候,都是同一个方法。
    

    处理使用这种方法,我们还可以使用原型的方式

    function Person(name,age,like) {
        this.name=name;
        this.age=age;
        this.like=like;
    };
    Person.prototype.comSay=function(){
        console.log('我可以不吃饭')
    }
    var per1=new Person("司藤",300,'耍');
    var per2=new Person('白浅','10000','耍');
    console.log( per1.comSay==per2.comSay ) //true
    // 我们还可以通过原型来解决数据共享
    
    原型的作用:数据共享,节约空间。
    
  • 相关阅读:
    转:Intellij idea创建javaWeb以及Servlet简单实现
    IntelliJ IDEA控制台启动Tomcat输出中文乱码问题
    Tomcat 输出日志出现中文乱码
    转:Java Web 项目发布到Tomcat中三种部署方法
    运行tomcat7w.exe提示指定的服务未安装 解决办法
    (转)ASP.NET MVC:Razor 引入命名空间
    (转)解决WinDbg调试Dump文件不同环境mscordacwks.dll版本问题
    svn移动目录时如何保留原来的日志
    Memcached 教程
    最近帮朋友写了一个百度竞价关键词快速分词(分组)工具,支持与或逻辑分组,附源码和工具下载链接
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/15595837.html
Copyright © 2011-2022 走看看