[JavaScript知识库]JS构造函数

目录

一、构造函数是什么

二、构造函数的特点

三、构造函数的执行流程

四、构造函数的返回值

一、构造函数是什么

????????在 JavaScript 中，用 new 关键字来调用的函数，称为构造函数。构造函数首字母一般大写

二、构造函数的特点

? ? ? ? 1.函数名与类名相同

? ? ? ? 2、不用定义返回值类型。(不同于void类型返回值，void是没有具体返回值类型;构造函数是连类型都没有)

????????3、不可以写return语句。(返回值类型都没有，故不需要return语句)

注:一般函数不能调用构造函数，只有构造函数才能调用构造函数。

  function Fn(name, age) {
      this.name = name;
      this.age = age;
      this.say = function () {
        console.log('炒菜不放盐--乏味');
        console.log(this);
      }
    }

    // Fn('zs', 22)

    // 构造函数中的this,指向实例化后的对象
    let f1 = new Fn('zs', 28);

三、构造函数的执行流程

????????1、当实例化对象（即构造函数以new关键字调用时）会创建一个新的内存空间，标记为构造函数的实例。

????????2、将新建的对象设置为函数中的this

????????3、逐个执行函数中的代码

????????4、将新建的对象作为返回值

四、构造函数的返回值

? ? ? ? 1.没有返回值，返回实例化的对象

    function Fn() {
      this.name = '张三';
      this.age = 18;
      this.say = function () {
        console.log('炒菜不放盐--乏味');
        console.log(this);
      }
    }
    console.log(Fn()); //undefined
    console.log(new Fn());//Fn?{name: "张三", age: 18, say: ?}

????????2.存在返回值

? ? ? ? ? ?（1）返回值为非引用类型（如string,number,boolean,null,undefined），依旧返回实例化的对象

    function Fn() {
      this.name = '张三';
      this.age = 18;
      this.say = function () {
        console.log('炒菜不放盐--乏味');
        console.log(this);
      }
      return '李四'
    }
    console.log(Fn()); //李四
    console.log(new Fn());//Fn?{name: "张三", age: 18, say: ?}

? ? ? ? ? ?（2）返回值为引用类型，则返回该引用类型

    function Fn() {
      this.name = '张三';
      this.age = 18;
      this.say = function () {
        console.log('炒菜不放盐--乏味');
        console.log(this);
      }
      return {
        name: '王二麻子',
        age: 20
      }
    }
    console.log(Fn()); //{name: "王二麻子", age: 20}
    console.log(new Fn()); //{name: "王二麻子", age: 20}