05.构造函数执行机制

John Doe 2021-04-24 00:24:33
Categories: Tags:

一、相关概念

在JavaScript中,有两种创建值的方式:

var o1 = {};                //字面量表达式
var o2 = new Object();       //构造函数模式

对于基本数据类型而言,基于字面量表达式创建的值属于基本类型,构造函数模式创建的值属于引用类型。

var num1 = 10;
var num2 = new Number(20);
alert(typeof num1);         //"number"
alert(typeof num2);         //"object"

二、普通函数执行机制

普通函数执行流程如下:

  1. 形成私有作用域
  2. 形参赋值
  3. 变量提升
  4. 代码自上而下执行
  5. 栈内存释放问题

三、构造函数执行机制

构造函数执行流程与普通函数执行流程类似,但多了两个步骤:

  1. 形成私有作用域
  2. 形参赋值
  3. 变量提升
  4. 在当前私有作用域创建一个空对象,并将函数的执行主体(this)指向该对象
  5. 代码自上而下执行
  6. 将步骤4中创建的堆内存地址返回(浏览器默认操作)

在构造函数执行时,如果函数体中没有return,则浏览器会默认返回创建的实例。

那么问题来了:如果我们手动return,会发生什么?

function Test1(){
    return 1;
}
function Test2(){
    return {};
}
alert(new Test1() instanceof Test1);    //true
alert(new Test2() instanceof Test2);    //false