js new一个函数和直接调用函数的区别

第一种情况(无返回值)

function Person(name){
    this.name=name;
    this.sayName=function(){
        console.log(this.name);
    };
}
const a = Person('张三');//执行了Person('张三')，但是没有返回值
//a=执行后的Person('张三')=无返回值=undefined
const b = new Person('李四');//新建了一个Person('李四')对象
a.sayName();//报错
b.sayName();//李四
window.sayName();//张三

为什么会出现这种情况？

• 如果声明时没有new，其实就是简单的函数调用并赋值，如果函数也没有返回值，那么函数调用并没有什么意义，也就是说声明的a=undefined，然后执行了Person('张三')，但是是属于window对象，所以执行window.sayName()能输出张三
• 如果声明时有new，具体发生如下
  1.创建一个继承自构造函数原型的新对象，也就是创建一个新的内存空间，然后让该内存空间的__ proto__指向构造函数的prototype。(继承构造函数的原型链)
  2.将构造函数中的this指向刚创建的内存空间
  对象的__ proto__属性能够访问到原型，IE下则没有暴露出相应的属性
  3.使用指定的参数执行构造函数中的代码
  因此相当于新建了一个Person对象，所以执行b就是我们想要的结果

第二种情况(有返回值)

//返回数值类型
function Person1(name)  {  
    this.name = name;  
    return this.name;  
}  
var a1= new Person1('张三');   //新建了一个Object 对象，它有一个name 属性，并且返回一个字符串test 
var b1 = Person1('李四');    // 函数Test()属于Function对象，返回"test"字符串，所以test2单纯是一个字符串  
console.log(a1)//Object
console.log(b1)//李四
console.log(a1.name)//张三
console.log(b1.name)//undefined

//返回引用类型
function Person2(name)  {  
    this.name = name;  
    return [1,2,3];  
}  
var a2= new Person2('张三');   //新建了一个Object 对象，它有一个name 属性，并且返回一个字符串test 
var b2 = Person2('李四');    // 函数Test()属于Function对象，返回"test"字符串，所以test2单纯是一个字符串  
console.log(a2)//[1,2,3]
console.log(b2)//[1,2,3]
console.log(a2==b2)//false

还是分两种情况：

• 如果没有new，但是函数有返回值，那么就会把返回值赋值给a

• 如果有new：
  1.函数返回值为常规意义上的数值类型（Number、String、Boolean）时，new函数将会返回一个该函数的实例对象
  2.函数返回一个引用类型（Object、Array、Function）时，则new函数与直接调用函数产生的结果相同，执行构造函数之后把引用类型返回
  下面是chrome浏览器控制台输出的效果

  
  Chrome控制台