构造函数小记

cangck_X 发布于2019-08-26 10:15 / 2351人阅读

摘要：也就是说这个变量，保存的内存地址就是，同时被标记为的实例以上就是构造函数的整个执行过程。

前言算是

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

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

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

构造函数的执行流程：

当以 new 关键字调用时，会创建一个新的内存空间

函数体内部的 this 指向该内存"也就是Person的实例"

        * 每当创建一个实例的时候，就会创建一个新的内存空间(#f2, #f3)，
        * 创建 #f2 的时候，函数体内部的 this 指向 #f2, 
        * 创建 #f3 的时候，函数体内部的 this 指向 #f3。

执行函数体内的代码
（给 this 添加属性，就相当于给实例添加属性）

默认返回 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);  // "中性"

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

云服务器 GPU云服务器构造函数私有构造函数非构造函数构造函数对比

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/105870.html

JDK1.8 ArrayList部分源码分析小记

摘要：部分源码分析小记底层数据结构底层的数据结构就是数组，数组元素类型为类型，即可以存放所有类型数据。初始容量大于初始化元素数组新建一个数组初始容量为为空对象数组初始容量小于，抛出异常无参构造函数。 JDK1.8 ArrayList部分源码分析小记底层数据结构底层的数据结构就是数组，数组元素类型为Object类型，即可以存放所有类型数据。我们对ArrayList类的实例的所有的操作底层都...

王军 2019-08-15 11:56 评论0 收藏0
javascript小记

摘要：模板字面量相当于格式化字符串字符串用两个包含起来并且内部的占位符用标识一般用于标识多行文本或者配合函数使用与箭头函数用于数组是用于让数组每一个元素都调用函数的语法基本格式为其中为数组元素下标为当前元素所属的数组对象在实际调用时只需要箭头函数 1.模板字面量相当于格式化字符串,字符串用两个``包含起来,并且内部的占位符用${variable}标识.一般用于标识多行文本或者配合函数使用. ...

waltr 2019-08-23 16:23 评论0 收藏0
面向对象小记

摘要：面向对象原型面向对象想开一个车，你不需要自己去造一个车，只需要一把钥匙，车对于你来说就是一个对象。使用构造函数模式和原型模式组合初学笔记，个人记录备忘，如有谬误，欢迎指正。面向对象、原型面向对象想开一个车，你不需要自己去造一个车，只需要一把钥匙，车对于你来说就是一个对象。在JavaScript中的对象, 具有属性,当属性的值是一个函数时,那么此属性就是这个对象的方法.访问属性的方...

mmy123456 2019-08-22 16:26 评论0 收藏0
几道前端面试题小记

摘要：全局环境调用函数的对象实际为，所以函数内的指向构造函数通过构造函造函数生成了一个新对象，指向这个新对象。学习前端一个月，上一周面试了大概多家，收获的却是寥寥。为了效率，前端各方面的内容都有涉猎，深度却相当不足，面试时暴露各种问题。最近面试了不少家，苦于前端经验薄弱，被各种血虐。做了不少家面试题，把各种不会的回来再做一遍，作为经验总结吧。 1.如何最优性能去重一个数组？方法有好多，比...

tulayang 2019-08-29 11:20 评论0 收藏0
几道前端面试题小记

摘要：全局环境调用函数的对象实际为，所以函数内的指向构造函数通过构造函造函数生成了一个新对象，指向这个新对象。学习前端一个月，上一周面试了大概多家，收获的却是寥寥。为了效率，前端各方面的内容都有涉猎，深度却相当不足，面试时暴露各种问题。最近面试了不少家，苦于前端经验薄弱，被各种血虐。做了不少家面试题，把各种不会的回来再做一遍，作为经验总结吧。 1.如何最优性能去重一个数组？方法有好多，比...

yhaolpz 2019-08-21 14:31 评论0 收藏0