zoukankan      html  css  js  c++  java
  • Javascript 使用new 关键字调用函数和直接调用函数的区别

    1.函数有返回值

    $(function(){
    function Person(name,age,job){
    var o=new Object();
    o.name=name;
    o.age=age;
    o.job=job;
    o.sayHi=function(){
    console.log(this.name);
    }
    return o;
    }
    var people= new Person('xiaowang',24,'developer');//new
    people.sayHi();

    var people1= Person('xiaowang',24,'developer');
    people1.sayHi();
    });

    验证得到,new关键字调用和直接调用的结果是一样的

    Person函数创建了一个对象,并以相应的属性和方法初始化该对象,然后又返回了这个对象,除了使用new操作符且把使用的包装函数叫做构造函数之外,这个模式跟工厂模式是一模一样的。

    2.如果函数没有返回值

    $(function(){
    function Person(name,age,job){
    //var o=new Object();
    this.name=name;
    this.age=age;
    this.job=job;
    this.sayHi=function(){
    console.log(this.name);
    }
    //return o;
    }
    var people= new Person('xiaowang',24,'developer');//new
    people.sayHi();

    var people1= Person('xiaowang',24,'developer');
    people1.sayHi();
    });

    注意:构造函数在不返回值的情况下,默认返回新对象实例。

    new 调用会正常工作,而直接调用会出错

    3..如果返回值为函数

    $(function(){

    function Person(){
    this.name='test';
    return function(){return true};
    }
    var people= new Person();//构造对象
    var people1= Person();//直接调用

    console.log(people==people1);
    console.log(people===people1);
    });

    虽然浏览器结果一样,但是比较结果都是false,因为javascript对object和function比较是基于引用类型的。

    4.如果返回值为值类型(例如:number)

    $(function(){
    function Person(){
    this.name='test';
    return 2;//function(){return true};
    }
    var people= new Person();//构造对象
    var people1= Person();//直接调用

    console.log(people==people1);
    console.log(people===people1);
    });

    比较结果发现结果都是false。

    所以得出猜测

    如果函数返回值为常规意义上的值类型(Number、String、Boolean)时,new 函数将会返回一个该函数的实例对象,而如果函数返回一个引用类型(Object、Array、Function),虽然new函数与直接调用函数产生的结果等同,但是是两个不同的过程,一个是构造对象、一个是函数调用。

  • 相关阅读:
    卷积神经网络(3)
    卷积神经网络(2)
    五款最佳Linux下载管理器推荐
    SSH如何通过公钥连接云服务器
    揭露QPS增高后的秘密
    总结六条对我们学习Linux系统有用的忠告
    第一款支持容器和云部署的开源数据库Neo4j 3.0
    /etc/bashrc和/etc/profile傻傻分不清楚?
    手把手教你crontab排障
    awk系列:在awk中如何使用流程控制语句
  • 原文地址:https://www.cnblogs.com/Seamless/p/7426627.html
Copyright © 2011-2022 走看看