JavaScript基础(十) -- 设计模式

1. 对象由两部分构成:属性 和 方法;

2. 面向对象和面向过程的区别

 面向对象,主要会使用已经封好的方法;
 面向过程,需要考虑整个封装的细节;

3. 面向对象的特点:封装、继承、多态

1)封装:对于一样的功能,我们只需要封装一次,以后再使用,直接调用即可:复用;
专业术语:低耦合,高内聚;
2)继承:子类继承父类中的属性和方法;
3)多态:包含重载和重写:
重载:JS中不存在严格意义上的重载;但有类似重载的功能,就是给同一个方法,传不同的参数,可以实现不同的功能;
重写:子类可以重写父类的属性和方法

4. 模块化开发

对于一个大型项目,公司会分配给不同的工程师去同步开发,等大家开发完成,把各自完成的模块合并到一起,这个项目就完成;
单例模式,就是最简单,最常用的模块化开发;

5. 单例模式

就是把描述同一事物的属性和方法,放在同一个命名空间下;这样就避免了变量名冲突的问题;
单例模式的本质:普通对象;

命名空间:浏览器会为对象开辟一个空间(堆内存),我们给这个空间起个名字,比如例1中的person1就是命名空间;

例1:

var name='aa';
var age=8;
var person1={
    name:'bb',
    age:18,
    do:function(){
        console.log('eat')
    }
};
var person2={
    name:'cc',
    age:16,
    do:function(){
        console.log('sing')
    }
};

6.单例模式的优缺点总结:

优点:
1.避免全局变量名冲突的问题
2.可以进行模块化开发:
    1)模块之间的相互调用:模块名.属性名
    2)本模块内个方法的相互调用:this.属性名/方法名;
缺点:当对象的属性名和属性值相同的时候,会造成大量冗余代码;
解决措施:为了避免相同的功能,返回的重写;我们可以进行相同功能代码的封装--工厂模式;

7. 工厂模式3步骤:

1)引进原材料  var obj={};
2)加工原材料  obj.xxx=xxx;
3)输出成品    return obj;
工厂模式的本质:封装;

例2

function person(name,age,fn){
var obj={};
obj.name=name; //给对象添加了属性
obj.age=age;
obj.showName=function(){//给对象添加了方法;
alert(‘我的名字是’+this.name);
}
return obj;
}
var p1=person(‘bb’,16);
var p2=person(‘cc’,8);

8. 构造函数模式

创建自定义的类,并且,该自定义的类能够new出实例;

prototype原型上都存的是公有的属性和方法;

例3:

function Person(name,age,fn){//构造函数中放的都是私有的属性和方法;
        //var obj={};系统自动帮我们创建对象;
        //构造函数中的this:指向当前new出来的这个实例;
        this.name=name; //给对象添加了属性
        this.age=age;
        /*this.showName=function(){//给对象添加了方法;
            alert('我的名字是'+this.name);
        };*/
    }
    //把构造函数中对象的方法,放在了prototype原型上:原型就是用来保存公有的属性和方法;
    Person.prototype.showName=function(){
        alert('我的名字是'+this.name);
    };
    var p1=new Person('bb',16);
    var p2=new Person('cc',8);
    p1.showName();
    p2.showName();

9. 工厂模式和构造函数模式的区别:

1. 在调用阶段:
    1.工厂模式调用时首字母小写;但是构造函数模式,首字母大写
    2.构造函数调用时有new;而工厂模式没有new;
    注意:
    1)构造函数new出来的都是实例;实例都是对象数据类型;
    2)构造函数都是类,类都是函数数据类型;
2. 在定义阶段:
    工厂模式定义阶段有3步骤:1)自己创建对象 2)加工对象 3)自己返回对象;
    构造函数模式定义阶段只有1个步骤:加工对象; 因为系统会自动帮我们创建对象和返回已经加工好的对象;

10. 关于构造函数的总结:

1)构造函数中存的都是私有的属性和方法
2)构造函数中的this指向当前new出来的实例;
3)构造函数中不需要手动返回对象,如果自己写了返回值:
    1:返回基本数据类型,我们的实例仍然具有给他绑定属性和方法,不会发生任何影响;
    2:返回引用数据类型,会覆盖掉系统返回的对象;那我们创建的实例,就不具有他的属性和方法了;
4)构造函数主要是类和实例打交道;
5)在创建实例的时候,如果没有参数,小括号可以省略;
6)构造函数中,实例只跟this.xxx有关,跟变量没有任何关系;

11. 原型模式

原型模式基础知识:
1)每个函数数据类型(构造函数,普通函数)上,都天生自带一个属性,叫做prototype,prototype是一个对象;
2)prototype这个对象上,天生自带一个属性,叫做constructor,他指向当前这个类;
3)每个对象数据类型(实例,prototype,普通对象),都自带一个属性叫做proto,他指向当前实例所属类的原型;
Object.prototype上的一些公有方法:
hasOwnProperty():判断属性是否为对象的私有属性 返回值:boolean;
obj1.isPrototypeOf(obj2):判断obj1是否在obj2的原型链上;
propertyIsEnumerable():判断是否为可枚举的属性
toString()
原型链:如何查找obj.属性名
1)先在自己的私有空间中进行查找,如果找到,说明这个属性是对象私有属性;
2)如果找不到,通过proto,去它所属类的原型上找,找到的话,属于公有属性;
3)如果找不到,继续通过proto一层层往上找,一直找到Object.prototype还没有的话是undefined;
注意:如果找的是方法的话,最终找不到,会报错;
易混淆概念区分
1)一提到构造函数:1:构造函数中都是私有的属性和方法 2:构造函数就是 实例和类打交道
2)一提到构造函数原型模式:1.原型上放的都是公有的属性和方法 2.原型模式是: 实例,类,原型三个打交道;
3)一提到 proto,就是指原型链;对象找他的属性和方法都是通过proto一级级查找的;
4)一旦我们更改了类.prototype的指向,直接给他赋值一个我们自己定义的对象,那么他的constructor就是指向了Object这个类;
所以,只要见到 Fn.prototype={};一定要注意他的constructor
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章