构造函数和实例对象之间的关系 构造函数创建对象带来的问题 原型

构造函数和实例对象之间的关系

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script>
      // 面向对象的思想是----抽象的过程---->实例化的过程

      // 小苏这个人,姓名,年龄,性别,吃饭,打招呼,睡觉

      // 自定义构造函数---->实例化对象
      function Person(name,age,sex) {
          this.name = name;
          this.age = age;
          this.sex = sex;
          this.eat = function(){
              console.log("吃大蒜拌臭豆腐");
          };
      }
      // 构造函数---->创建对象
      var per = new Person("小苏",29,"女");
      // 吃
      // per.eat();
      // 实例对象是通过构造函数来创建
      // 把这个对象的结构显示出来 
      // 实例对象会指向自己的构造函数(暂时理解,是错误的)
      // 把这个对象的结构显示出来
      console.dir(per);
      console.dir(Person);

      // 实例对象的构造器(构造函数)
      // 实例对象的构造器是指向Person的,结构是true,所以,这个实例对象per
      // 就是通过Person来创建的
      // console.log(per.constructor==Person);

      console.log(per.__proto__.constructor==Person);
      console.log(per.__proto__.constructor==Person.prototype.constructor);

      // 构造函数
      function Animal(name){
          this.name = name;
      }
      // 实例对象
      var dog = new Animal("大黄");
      // 实例对象
      console.dir(dog);
      // 构造函数的名字
      console.dir(Animal);

      console.log(dog.__proto__.constructor==Person);
      console.log(dog.__proto__.constructor==Animal);

      // 判断这个对象是不是这种数据类型
      console.log(dog.constructor==Animal);
      // console.log(dog instanceof Person);

      // 总结:
      /**
       * 实例对象和构造函数之间的关系:
       * 1.实例对象是通过构造函数来创建的--创建的过程叫实例化
       * 2.如何判断对象是不是这个数据类型?
       *   1) 通过构造器的方式 实例对象.构造器==构造函数的名字
       *   2) 对象 instanceof 构造函数名字
       *   尽可能的使用第二种方式来识别,为什么原型讲完再说
       */

  </script>
</head>
<body>
  
</body>
</html>

构造函数创建对象带来的问题

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script>
      // function Person(name,age){
      //     this.name = name;
      //     this.age = age;
      //     this.eat = function(){
      //         console.log("今天吃红烧土豆");
      //     };
      // }
      // var per1 = new Person("小白",20);
      // var per2 = new Person("小黑",29);

      // per1.eat();
      // per2.eat();
      // // 不是同一个方法
      // console.log(per1.eat==per2.eat);

      // for(var i=0;i<100;i++){
      //     var per = new Person("嘎嘎",20);
      //     per.eat();
      // }

      // console.dir(per1);
      // console.dir(per2);

      function myEat(){
        console.log("吃大榴莲");
      }
      // var myEat = 10;
      function Person(name,age){
          this.name = name;
          this.age = age;
          this.eat = myEat;
      }
      var per1 = new Person("小白",20);
      var per2 = new Person("小黑",29);

      console.dir(per1);
      console.dir(per2);

      console.log(per1.eat==per2.eat);
      // 通过原型来解决----数据共享,节省内存空间,作用之一
      



  </script>
</head>
<body>
  
</body>
</html>

原型

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <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("小红",19);
      console.log(p1.eat==p2.eat);

      console.dir(p1);
      console.dir(p2);
  </script>
</head>
<body>
  
</body>
</html>

猜你喜欢

转载自blog.csdn.net/Leon_Jinhai_Sun/article/details/86612488
今日推荐