原型prototype

JS对象的比较

由于JS是解释执行的语言，那么代码中出现函数与对象如果重复执行，会创建多个副本

1. 创建一个Person构造函数，要求有name,age,gender,sayHello
2. 代码如下：

    function Person(name,age,gender){
        this.name=name;
        this.age=age;
        this.gender=gender;
        this.sayHello=function(){};
    }
   

3. 这种构造函数会影响性能，容易造成多个对象有多个对象副本，应该将方法单独抽取出来，让所有的对象共享该方法. 代码如下：

    function sayHello(){};
    function Person(name,age,gender){
            this.name=name;
            this.age=age;
            this.gender=gender;
            this.sayHello=sayHello;
        }
   

4. 可以考虑将方法全部放到外面，但是有安全隐患
   • 在开发中会引入各种框架和库，自定义的成员越多，出现命名冲突的几率越大
   • 在开发中会有多个构造函数，，每一个构造函数有很多方法，就会变得不容易维护
5. 解决办法是外面的函数不占用名字，而且在构造函数旗下就可以了
6. 每一个构造函数在定义的时候，都会有一个神秘对象被创建出来
7. 每一个由构造函数创建出来的实例对象都会默认的连接到该神秘对象上 代码如下：

    function Person(name,age,gender){
                this.name=name;
                this.age=age;
                this.gender=gender;
            }
     Person.prototype.sayHello=function(){
            console.log( 'hello!' ) ;
     };
    var p1=new Person('张三',10,'male');
    p1.sayHello()
    var p2=new Person('张四',13,'male');
    p2.sayHello();

1. 该神秘对象就是prototype，由构造函数创建出来的众多对象共享的一个对象
2. 只需要将共享的东西，重复会多占用内存的东西放到构造函数.prototype中，那么所有的对象都可以共享

原型相关的概念

1. 关于面向对象的概念

   • 类 class 在js中就是构造函数
     • 在传统的面向对象语言中，使用一个叫类的东西定义模版，然后使用模版创建对象
     • 在构造方法中也具有类似的功能，因此称其为类
   • 实例与对象
     • 实例一般是指某一个构造函数创建出来的对象，我们称这个对象为这个构造函数的实例
     • 实例就是一个对象，对象是一个泛称
   • 键值对与属性和方法
     • 在js中键值对的集合称为对象
     • 如果值为数据（非函数），就称该键值对为对象的属性 property
     • 如果值为函数，就称为对象的方法 method
   • 父类与子类
     • 传统的面向语言中使用类来继承，就有父类，子类的概念
     • 父类又称为基类, 子类又称为派生类
     • 在 js 中常常称为父对象, 子对象. 基对象, 派生对象

2. 原型相关的概念

   • 神秘对象针对构造函数称为 "原型属性"
     • 神秘对象就是构造函数的原型属性
     • 简称原型
   • 神秘对象针对构造函数创建出来的对象称为"原型对象"
     • 当访问实例对象的属性时或方法时，如果构造函数没有，就到到对应的原型对象中去找
     • 简称原型
   • 对象继承自其原型
     • 构造函数创建的对象 继承自 构造函数的原型属性
     • 构造函数创建的对象 继承自 该对象的原型对象
     • 构造函数创建的对象与构造函数的原型属性表示的是两个不同的对象
       • 原型中的成员可以直接被实例对象所使用
       • 实例对象继承自原型
       • 这样的继承就是 "原型继承"

3. 如何使用原型

   • 使用对象的动态特性
     • 构造函数.prototype.XXX = vvvv;
   • 直接替换

        Student.prototype = {
             sayHello: function () {},
             study: function () {}
         };