Js面向对象

Posted 2020-09-05 拾慧开发

　　脑袋一团浆糊，但希望写点啥，所有就有了这篇博文了，抱歉哦。。。。开始吧！！！！

　  什么是构造函数？？

　  　　所谓"构造函数"，其实就是一个普通函数，但是内部使用了this变量。对构造函数使用 new 运算符，就能生成实例，并且this变量会绑定在实例对象上。

　　　  例如：写一个猫的原型对象

　　function Dog(x,y){
  　　this.name = x;
  　　this.color = y    
　　}

　　<!-- 生成实例对象 -->
　　var dog1 = new Dog("大毛","黄色");
　　var dog2 = new Dog("二毛","黑色");

　　alert(dog1.name); // 大毛
　　alert(dog1.color); // 黄色

　　　　这时 dog1 和 dog2 会自动含有一个constructor属性，指向它们的构造函数。

　　 alert(dog1.constructor == Dog); //true
　　alert(dog2.constructor == Dog); //true
　　/*可以看出不论是dog1 还是dog2构造函数都为 Dog*/

　　　　javascript还提供了一个instanceof运算符，验证原型对象与实例对象之间的关系。

　　 alert(dog1 instanceof Dog); //true
　　alert(dog2 instanceof Dog); //true

　　

 

　　

　　构造函数的问题

　　构造函数方法很好用，但是存在一个浪费内存的问题。

　　　请看，我们现在为Dog对象添加一个不变的属性type（种类），再添加一个方法eat（吃）。那么，原型对象Dog就变成了下面这样：

    function Dog(name,color){
　　　　this.name = name;
　　　　this.color = color;
　　　　this.type = "犬科动物";
　　　　this.eat = function(){alert("啃骨头");};
　　}

　　　　生成实例：

　　 var dog1 = new Dog("大毛","黄色");
　　var dog2 = new Dog("二毛","黑色");
　　alert(dog1.type); // 犬科动物
　　dog1.eat(); // 啃骨头

　　　　表面上好像没什么问题，但是实际上这样做，有一个很大的弊端。那就是对于每一个实例对象，type属性和eat()方法都是一模一样的内容，每一次生成一个实例，都必须为重复的内容，多占用一些内存。这样既不环保，也缺乏效率。

　　　　那么能不能让type属性和eat()方法在内存中只生成一次，然后所有实例都指向那个内存地址呢？回答是可以的。

 

 

 

　　Prototype模式

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

　　　 这意味着，我们可以把那些不变的属性和方法，直接定义在prototype对象上。

   function Dog(name,color){
　　　　this.name = name;
　　　　this.color = color;
　　}
　　Dog.prototype.type = "犬科动物";
　　Dog.prototype.eat = function(){alert("啃骨头")};

　　　　生成实例:

　　var dog1 = new Dog("大毛","黄色");
　　var dog2 = new Dog("二毛","黑色");
　　alert(dog1.type); // 犬科动物
　　dog2.eat(); // 啃骨头

　　　　这时所有实例的type属性和eat()方法，其实都是同一个内存地址，指向prototype对象，因此就提高了运行效率。