首页 > 代码库 > 面向对象、原型链、继承知识梳理

面向对象、原型链、继承知识梳理

2024-09-23 13:29:44   215人阅读

单例模式：就是一个对象咯

var person={
    name:‘xuwen‘,
    age:17
};
var person2={
    name:‘xiaoxu‘,
    age:25  
}

工厂模式：就是一个函数，解决批量生产问题

 1 function fn(name,age){
 2     var obj={};
 3     obj.name=name,
 4     obj.age=age,
 5     obj.write=function(){
 6         console.log(obj.name);
 7     }
 8     return obj;
 9 }
10 var person1=fn(‘xuwen‘,17);
11 var person2=fn(‘xiaoxu‘,23);
12 person1.write();
13 person2.write();

构造函数：也是一个函数，但这个函数new一下的时候，那么这个函数就会自动产生一个对象（实例），并且最后返回这个对象（实例）。里面的this指的就是当前对象（实例）。方法里面的this例外，谁调用这个方法，this就指向谁。

 1 var name=‘xuxu‘;
 2 function Fn(name,age){
 3     this.name=name;    //this指的就是当前实例
 4     this.age=age;
 5     this.write=function(){
 6         console.log(this.name);  //谁调用方法   this就指向谁
 7     }
 8 }
 9 var person1=new Fn(‘xuwen‘,17);
10 var person2=new Fn(‘xiaoxu‘,23);
11 person1.write();  //xuwen
12 person2.write();  //xiaoxu
13 var p3=person1.write;
14 p3();  //xuxu

上面构造函数有一个弊端，对于属性，每个实例不同，这个没有问题，但是方法对于每个实例都开辟一个空间来存储，那就浪费。毕竟每个方法都是一样，那么怎么解决这个问题呢？那就是下面将的原型了。

基于构造函数的原型及原型链

 1 function Fn(name,age){
 2     this.name=name;    //this指的就是当前实例
 3     this.age=age;
 4 }
 5 Fn.prototype.write=function(){    //这是一个公共的空间  每个实例调用方法直接到这里找就行   牵涉到原型链  那就讲讲吧
 6     console.log(this.name);
 7 }
 8 var person1=new Fn(‘xuwen‘,17);
 9 var person2=new Fn(‘xiaoxu‘,23);
10 person1.write();  //xuwen
11 person2.write();  //xiaoxu
12 
13 //原型链
14 //每个构造函数都有一个prototype属性  这个属性指向（值）存储着   构造函数.prototype 里面的东东
15 //每个对象（实例）都有一个__proto__属性 （顶级Object.prototype这个对象没有这个属性）  这个属性指向（值）  存储着 构造函数.prototype 里面的东东
16 //那么（当然构造函数.prototype也是一个对象，所以构造函数.prototype里面也有一个__proto__属性  那么这个属性最终都指向Object.prototype）
17 //根据这一样一级一级形成了原型链了

整完原型链那么下面就是继承了，这个子级构造函数可以获取到父级构造函数的属性和方法。这里就不细讲了继承诸多继承方法了。就直接用混合继承方法来结束这一章了。

利用  父级.call（this） 来继承父级的属性。

利用一个空函数作中介来继承原型方法

//该函数功能是实现child只继承person上prototype属性或者方法。
function extend(child, person) {
    var F = new Function();
    //当然也可以写成var F=function(){};    都是一样的   定义一个空函数而已
    F.prototype = person.prototype; //把这个空函数的prototype属性指向person原型对象  
    child.prototype = new F(); //child继承空函数的原型属性或者方法   就非常干净的继承了person上的方法或属性了
    child.prototype.constructor = child; //构造器的指向改一下，防止继承链乱序
    child.sub = person.prototype; //自定义一个属性把person的原型属性或方法保存下来。
}

function person() {

}

function child() {
    child.sub.constructor.call(this); //等同于person.call(this);
}

在另外补充一下   instanceof   用法就是   person1 instanceof Fn    判断实例是不是该构造函数下面的   除了父级构造函数   祖先构造函数也会判断true 

hasOwnProperty 用法    person1.hasOwnProperty(‘name‘)    判断  x 属性是否是person1的私有属性    不能判断原型链上    如果要判断原型链上  用  in 关键字

代码就不写了。

那就这样结束吧，明天数组和正则吧！

面向对象、原型链、继承知识梳理


联系
我们