每天一个小知识点3（原型与构造函数总结一）



原型与构造函数总结 一

---

对象

面向对象的编程语言中有一个非常重要的参数那就是类的概念，通过类我们可以创建出来各种各样的对象，而ECMAscript中没有类的概念，所以他与别的编程语言中处理对象的方式有所不同ECMA-262中规定了对象：无数属性的集合，其属性可以包含基本值，对象或其他函数在 JavaScript 中，对象是拥有属性和方法的数据。 属性是与对象相关的值。 方法是能够在对象上执行的动作。

---

创建对象案例1：

 var people=new Object();people.name="zhangsan";people.sex=18;people.say=function(){alert(people.name+" "+people.sex)}people.say();

还可以这么写

var people={  name:"zhangsan",  age:18,  say:function(){  alert(this.name)  }  }people.say();

这是常见的写法

function people(name,age){   this.name=name;   this.age=age;   this.changeName=function(newName){   this.name=newName;   }  }var zhangsan=new people("zhangsan",18);zhangsan.changeName("lisi");alert(zhangsan.name+" "+zhangsan.age)

delete people.name----注意点1：我们可以使用delete删除对象的某个属性

---

创建对象模式有两种，一种是工程模式，一种是构造函数模式。

工厂模式

function createPeople(name,age,sex){var o=new Object();o.name=name;o.sex=sex;o.age=age;o.say=function(){    alert(this.name)}return o;}var zhangsan=createPeople("zhangsan",18,'male');alert(zhangsan.name)

工厂模式抽象了创建具体对象的过程，考虑到ECMA无法创建类开发人员发明了一种函数，用函数封装了创建对象的细节

---

构造函数模式

什么是构造函数？---用于构造一个对象出来的函数例如Object 和数组等等

function People(name,age,sex){     this.name=name;   this,age=age;   this.sex=sex;   this.say=function(){   alert(this.name)   }   }var zhangsan=new People("zhangsan",18,'male')zhangsan.say();

1. 在这个例子中和工厂模式的区别？直接将属性和方法赋值给了this对象，没有了return语句
2. 语法注意，构造函数开头字母必须大写---想一想我们还学过哪些构造函数的案例

3. 注意点：每个通过构造函数创建出来的对象都有一个constructor属性

   1. 例如

       alert(zhangsan.constructor)  alert(zhangsan.constructor==People)

注意构造函数毕竟也是函数，也可以当作参数传递

1. var zhangsan=new People("zhangsan",18,'male')---当作构造函数使用
2. People("zhangsan",18,'male')---当作普通函数调用，这里对象会被添加给window对象window.say();

---

call方法

调用一个对象的call方法，以另一个对象替换当前对象

语法：xxx.call([thisObj[,arg1[, arg2[, [,.argN]]]]])

*call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。 如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。 *

---

简单案列一：

function add(a,b){alert(a+b);}function sub(a,b){alert(a-b);}add.call(sub,3,1);

简单案列二：

function People(name,age){this.name=name;this.age=age;this.say=function(){alert(this.name+" "+this.age);}}function Student(sName,sAge){//调用一个对象的call方法，以另一个对象替换当前对象。People.call(this,sName,sAge);//发生了继承----伪装继承}var zhangsan=new Student("zhangsan",18);zhangsan.say();   function Teacher(name,age){People.call(this,name,age);}var laowang=new Teacher("laowang",43);laowang.say();

实现继承

function Animal(name){  this.name = name;  this.showName = function(){  alert(this.name);  }  }function Cat(name){Animal.call(this, name);}   var cat = new Cat("Black Cat"); cat.showName(); 

---

apply方法

应用某一对象的一个方法，用另一个对象替换当前对象。

语法：apply([thisObj[,argArray]])

*如果 argArray 不是一个有效的数组或者不是 arguments 对象，那么将导致一个 TypeError。 如果没有提供 argArray 和 thisObj 任何一个参数，那么 Global 对象将被用作 thisObj， 并且无法被传递任何参数。 *

简单案列：

function Animal(){this.name = "Animal";this.showName = function(){alert(this.name);}}function Cat(){this.name = "Cat";}var animal = new Animal();var cat = new Cat();//通过call或apply方法，将原本属于Animal对象的showName()方法交给对象cat来使用了。//输入结果为"Cat"//animal.showName.call(cat,",");animal.showName.apply(cat,[]);

---

构造函数的问题：

关键在方法上：

 function People(name,age,sex){  this.name=name;  this.age=age;  this.sex=sex;  this.say=new Function("alert(this.name)")----想一想方法是不是也是这样调用了别人的函数呢？谁的？  }var  zhangsan=new People("zhangsan",18,"male");zhangsan.say();

但是----

 var  zhangsan=new People("zhangsan",18,"male"); var  lisi=new People("lisi",18,"male"); alert(zhangsan.say===lisi.say)---false

这是为什么呢？ 因为每次都new新的方法导致了这个问题 解决方案：

 function People(name,age,sex){  this.name=name;  this.age=age;  this.sex=sex;this.say=say;  }  function say(){  alert(this.name)  }var  zhangsan=new People("zhangsan",18,"male"); var  lisi=new People("lisi",18,"male");alert(zhangsan.say===lisi.say)