• 原型的概念

    原型

    更好的解决方案： prototype

    Javascript 规定，每一个构造函数都有一个 prototype 属性，指向另一个对象。这个对象的所有属性和方法，都会被构造函数的实例继承。

    这也就意味着，我们可以把所有对象实例需要共享的属性和方法直接定义在 prototype 对象上。

    构造函数、实例、原型三者之间的关系

     任何函数都具有一个 prototype 属性，该属性是一个对象。

    1. html>
    2. <html lang="en">
    3.  
    4. <head>
    5.   <meta charset="UTF-8">
    6.   <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7.   <meta name="viewport" content="width=device-width, initial-scale=1.0">
    8.   <title>原型title>
    9. head>
    10.  
    11. <body>
    12.  
    13. body>
    14. <script>
    15.   // 一、原型的作用：1、节省内存空间  2、实现数据共享（继承）
    16.   // 二、什么是原型？
    17.   // 结论1的推理
    18.   function fn1 () {
    19.  
    20.   }
    21.   console.log(fn1);
    22.   console.log(fn1.prototype);
    23.   var fn2 = function () { }
    24.   console.log(fn2.prototype);
    25.   // 结论2的推理
    26.   function Person (name) {
    27.     this.name = name;
    28.     // this.age = age;
    29.   }
    30.   console.log(Person.prototype);
    31.   // 四、如何节省内存空间：将公共的属性和方法挂载构造函数的原型对象上
    32.   // 结论3的推理
    33.   Person.prototype.age = 18;
    34.   Person.prototype.eatIceCream = function () {
    35.     console.log(this);
    36.     console.log(this.name + "喜欢吃冰淇淋");
    37.   }
    38.   Person.prototype.eatIceCream()
    39.   var p1 = new Person("小花");
    40.   var p2 = new Person("小丽");
    41.   var p3 = new Person("小红");
    42.  
    43.   console.log(p1);
    44.   console.log(p2);
    45.   console.log(p1.age);
    46.   console.log(p2.age);
    47.   p1.eatIceCream();
    48.   p2.eatIceCream();
    49.   console.log(p3.age);
    50.   p3.eatIceCream();
    51.   // 结论4：上午得出
    52.   console.log(Person == p1.constructor);//true
    53.   // 结论5的推理
    54.   console.log(Person.prototype.constructor);
    55.   console.log(Person.prototype.constructor == Person);//true
    56.   // 结论6的推理
    57.   console.log(p1);
    58.   console.log(p2);
    59.   console.log(p1.__proto__);
    60.   console.log(p2.__proto__);
    61.   var obj = {}
    62.   console.log(obj);
    63.   console.log(obj.__proto__);
    64.   console.log(window);
    65.   console.log(window.__proto__);
    66.   console.log(p1.__proto__ == Person.prototype);//true
    67.  
    68.   /*
    69.       五、函数中this的指向
    70.           6、在原型函数中，
    71.             （1）、如果通过原型调用函数，this指向原型对象
    72.             （2）、如果通过实例化对象调用函数，this指向实例化对象
    73.   
    74.    */
    75. script>
    76.  
    77. html>

    原型、构造函数、实例对象三者关系
          结论：
            1、任何一个函数都有一个prototype属性，它本身是一个对象，我们称之为原型
            2、构造函数也是函数，也有prototype属性
            3、构造函数中原型对象上的属性和方法都可以被构造函数的实例化对象所继承
            4、任何一个对象都有constructor属性，实例对象的constructor属性指向构造函数
            5、原型也是对象，也有constructor属性，原型对象的constructor属性指向构造函数
            6、任何一个对象都有__proto__属性，它是指针，实例化对象的__proto__属性指向构造函数的原型

  • 相关阅读:
    Apisix的ext-plugin-pre-req 中的trace 关联zipkin插件的trace
    大数据技术入门：impala查询引擎
    WebAssembly入门笔记[2]：利用Memory传递字节数据
    826. 单链表
    【Git】（六）子模块跟随主仓库切换分支
    Kotlin与Java写法的变更
    c++ 学习 之 继承的基本语法
    Spring事务简介说明
    学习记录：如何进行PWM 输出
    8.11模拟赛总结
  • 原文地址：https://blog.csdn.net/weixin_47619284/article/details/126551129