JavaScript之原型

原型的作用：数据共享 ，继承 目的都是:为了节省内存空间

1.解决数据共享,节省内存空间

<script>
    function Person(name,age) {
      this.name=name;
      this.age=age;
    }
    //通过原型来添加方法,解决数据共享,节省内存空间
    Person.prototype.eat=function () {
      console.log("吃凉菜");
    };

    var p1=new Person("小明",20);
    var p2=new Person("小红",30);
  </script>

构造函数，原型对象，实例化对象三者之间的关系

1 构造函数可以实例化对象
2 构造函数中有一个属性叫prototype,是构造函数的原型对象
3 构造函数的原型对象(prototype)中有一个constructor构造器,这个构造器指向的就是自己所在的原型对象所在的构造函数
4 实例对象的原型对象(__proto__)指向的是该构造函数的原型对象(prototype)
5 构造函数的原型对象(prototype)中的方法是可以被实例对象直接访问的

利用原型共享数据

需要共享的数据就可以写原型中
原型的作用之一:数据共享

属性需要共享,方法也需要共享
不需要共享的数据写在构造函数中,需要共享的数据写在原型中

 //构造函数
    function Student(name,age,sex) {
        this.name=name;
        this.age=age;
        this.sex=sex;
    }
    //所有学生的身高都是188,所有人的体重都是55
    //所有学生都要每天写500行代码
    //所有学生每天都要吃一个10斤的西瓜

    //原型对象
    Student.prototype.height="188cm";
    Student.prototype.weight="55kg";
    Student.prototype.study=function () {
        console.log("学习使我快乐，每天都要敲很多代码");
    };
    Student.prototype.eat=function () {
        console.log("我不喜欢吃西瓜，但是多吃西瓜能够敲好代码，所以我每天吃一个十斤的大西瓜");
    };
    //实例化一个对象
    var student01=new Student("东方不败",18,"女");
    var student02=new Student("韦小宝",48,"不详");
    console.log(student01);
    console.log(student01.name);
    console.log(student01.study());
    console.log(student02);
    console.log(student02.sex);
    console.log(Student);

简单的原型写法：其中包含原型的那一部分代码可以写为：

注意！！！这种方法比较简单，但是必须手动修改构造器的指向，否则会失去构造器

 Student.prototype={
        //手动修改构造器的指向
        constructor:Student,
        height:"188cm",
        weight:"55kg",
        study:function () {
            console.log("学习使我快乐，每天都要敲很多代码");
        },
        eat:function () {
            console.log("我不喜欢吃西瓜，但是多吃西瓜能够敲好代码，所以我每天吃一个十斤的大西瓜");
        }
    };

原型对象中添加方法：

引入：构造函数中的方法可以相互调用，原型中的方法也可以相互调用

//构造函数
    function Student(name,age) {
        this.name=name;
        this.age=age;
    }
    Student.prototype={
        //手动修改构造器的指向
        constructor:Student,
        height:"188cm",
        weight:"55kg",
        sleep:function () {
            console.log("很多学生喜欢睡觉");
            this.eat();
        },
        eat:function () {
            console.log("喜欢睡觉的学生不喜欢吃东西");
            this.play();
        },
        play:function () {
            console.log("最喜欢玩的事情就是睡觉");
        }
    };
    var student01=new Student("东方不败",18);
    student01.sleep();

属性和方法使用过程

实例对象使用的属性或者方法,先在实例中查找,找到了则直接使用,找不到则,去实例对象的__proto__指向的原型对象prototype中找,找到了则使用,找不到则报错

为内置对象添加原型方法

//为Array内置对象的原型对象中添加方法
    Array.prototype.mySort=function () {
      for(var i=0;i<this.length-1;i++){
          for(var j=0;j<this.length-1-i;j++){
              if(this[j]<this[j+1]){
                  var temp=this[j];
                this[j]=this[j+1];
                this[j+1]=temp;
              }//end if
          }// end for
      }//end for
    };

    var arr=[100,3,56,78,23,10];
    arr.mySort();//调用内置对象
    console.log(arr);

原型链

实例对象和原型对象之间的关系,主要是通过__proto__和prototype来联系