1

前言算是

当一个函数创建好以后,我们并不知道它是不是构造函数(构造函数习惯上首字母大写),只有当一个函数以 new 关键字来调用的时候,我们才能说它是一个构造函数

eg:
    function Person (name, age) {
   this.name = name;
   this.age = age;
  }

var per1 = new Person("yuchen", 22);

构造函数的执行流程:

  1. 当以 new 关键字调用时,会创建一个新的内存空间
  2. 函数体内部的 this 指向该内存"也就是Person的实例"

            * 每当创建一个实例的时候,就会创建一个新的内存空间(#f2, #f3),
            * 创建 #f2 的时候,函数体内部的 this 指向 #f2, 
            * 创建 #f3 的时候,函数体内部的 this 指向 #f3。
  3. 执行函数体内的代码
    (给 this 添加属性,就相当于给实例添加属性)
  4. 默认返回 this
    由于函数体内部的 this 指向新创建的内存空间,默认返回 this ,就相当于默认返回了
    该内存空间,也就是上图中的 #f1。此时,#f1的内存空间被变量 p1 所接受。也就是说
    p1 这个变量,保存的内存地址就是 #f1,同时被标记为 Person 的实例

以上就是构造函数的整个执行过程。

构造函数的返回值

构造函数执行过程的最后一步是默认返回 this,构造函数的返回值还有其它情况

           (1) )没有手动添加返回值,默认返回 this 
                function Person1() {
                  this.name = 'zhangsan';
                }
                var p1 = new Person1();
                
                p1: {
                  name: 'zhangsan'
                }
            (2) 手动添加一个基本数据类型的返回值,最终还是返回 this
                function Person2() {
                  this.age = 28;
                  return 50;
                }
                var p2 = new Person2();
                console.log(p2.age);   // 28
                
                p2: {
                  age: 28
                }
                注意:如果上面是一个普通函数的调用,那么返回值就是 50 !!!
        (3) 手动添加一个复杂数据类型(对象)的返回值,最终返回该对象
                  例一:
                   function Person3() {
                      this.height = '180';
                      return ['a', 'b', 'c'];
                    }

                    var p3 = new Person3();
                    console.log(p3.height);  // undefined
                    console.log(p3.length);  // 3
                    console.log(p3[0]);      // 'a'
                例二:
                    function Person4() {
                      this.gender = '男';
                      return { gender: '中性' }
                    }

                    var p4 = new Person4();
                    console.log(p4.gender);  // '中性'
            

// 构造函数基础点学习完毕啦~


JuliusDeng
12 声望2 粉丝