JS-OOP.ppt

1 JavaScript与OOP 李赞红欢迎交流 lifenote 2 目标 Function对象的apply方法自定义对象封装继承多态 3 apply Javascript的每个Function对象中有一个apply方法语法 function apply thisObj argArray 功能 可以用来代替另一个对象调用一个方法 将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象 用来模拟多态另外一个相似的方法function call thisObj arg1 arg2 argN 4 示例 functionObject1 name this name name this fun1 function alert 这是第一个方法 this fun2 function alert 这是第二个方法 functionObject2 name Object1 apply this name varo2 newObject2 中华人民共和国 o2 fun1 o2 fun2 alert o2 name 5 基本概念 自定义对象根据JS的对象扩展机制 用户可以自定义JS对象 这与Java语言有类似的地方 如 Math Date String等原型 prototype 通过prototype可以为对象在运行期间添加新的属性和方法 6 创建对象 1 对象初始化器方式语法objectName property1 value1 property2 value2 propertyN valueN method1 function arguments 其中 property是对象的属性 value则是对象的值 值可以是字符串 数字或对象三者之一 7 示例 varUsers name 中国 register function i alert 注册了 i 次 Users register 3 alert Users name 8 创建对象 2 构造函数方式编写一个构造函数 并通过new方式来创建对象 构造函数本可以带有构造参数 可以在对象中定义私有成员 实例成员和类成员 9 示例 订单构造函数functionOrder date total this date date this total total this calc function name alert name 正在统计 this date 下的订单 总数为 this total varo newOrder newDate 10 o calc 李赞红 10 对象属性的定义 私有属性私有属性只能在构造函数内部定义与使用 实例属性必须在对象实例化后才能使用prototype方式 语法格式 functionName prototype propertyName valuethis方式 语法格式 this propertyName value类属性直接通过类名去使用语法格式 functionName propertyName value 11 示例 functionCustomer this name 北大青鸟 对象属性varbrowser document all IE FireFox 私有属性Customer prototype theBrowser browser 对象属性 Cpany 北大青鸟教育集团 类属性 Testalert Cpany varc newCustomer alert c name r n c theBrowser 12 对象方法的定义 私有方法私有方法只能在对象内部使用实例方法实例方法必须在对象实例化后才能使用语法与对象属性相同类方法类方法可以直接通过类名去使用 13 示例 functionMiss varyou function alert Missyou 私有方法this me function alert missme 对象方法 对象方法Miss prototype he function alert misshim 类方法Miss she function alert missshe Miss she varm newMiss m me m he 14 小结 15 动态删除属性和方法 对于已经实例化的对象 我们可以动态增加和删除它的属性与方法语法 动态删除对象属性deleteobj propertyName动态删除对象方法deleteobj methodName 16 理解几个常用的方法 1 类的创建模型varClass create function returnfunction this initialize apply this arguments 说明 1 使用Class create 可以创建任何对象2 自定义对象中必须实现initialize方法 该方法相当于JAVA中的构造方法 此处体现了多态特征 17 理解几个常用的方法 2 方法var function id return string typeofid document getElementById id id 说明通过 id 访问在框架jquery prototype中都有类似的定义 18 理解几个常用的方法 3 继承模拟varExtend function desc src for varpropertyinsrc desc property src property Object prototype extend function obj Extend apply this this obj vars newStudent 1 李赞红 30 vars2 newStudent s2 extend s s2 getInfo s2 reading 19 典型的对象定义 Student varClass create function returnfunction this initialize apply this arguments varStudent Class create Student MAX AGE 100 Student MIN AGE 1 20 Student prototype initialize function id name age this id id this name name this kiss 这是描述性信息 if age Student MIN AGE 21 测试vars newStudent 1 杨过 30 s getInfo s reading 22 抽象类 抽象方法抽象方法就可以看作该类中没有定义的方法 但已经通过this指针使用了 抽象方法必须在子类中实现 这个和传统的语言 如JAVA 不同抽象类如果类中定义了抽象方法 该类就是抽象类 不能实例化 只能作为父类使用 23 继承 继承一个类派生出另一个类在javascript中 继承依赖于下面的两个方法 varExtend function desc src for varpropertyinsrc desc property src property returndesc Object prototype extend function obj returnExtend apply this this obj 24 定义抽象类 varBase Class create Base prototype initialize function 此方法必须myFun function this oninit 该方法未实现 myMethod function alert 这是mymethod方法 25 子类 varSub Class create Sub prototype newBase extend oninit function alert 中华人民共和国 Testvars newSub s myFun 该方法从Base中继承s myMethod 该方法从Base中继承 26 继承与多态示例 本示例定义一个抽象类 动物类 所有动物都能行走 但不同类型的动物行走的方式不同 所以 将具体行走的方法放到子类实现 鸟类和鱼类 27 基础代码 类创建模型varClass create function returnfunction this initialize apply this arguments 模拟继承varExtend function desc src for varmemberinsrc desc member src member returndesc 动态为Object添加extend方法 用来完成继承Object prototype extend function obj returnExtend apply this this obj 28 抽象类 动物类 动物类varAnimal Class create 为动物添加抽象方法Animal prototype 初始函数 相当于构造方法initialize function name this name name walking function this abstractWalking 相当于抽象方法 不需要任何实现 等子类去实现 29 子类 鸟类与鱼类 鸟类 子类 varBird Class create Bird prototype newAnimal extend abstractWalking function alert 鸟靠翅膀飞着走路 名称 this name 鱼类 子类 varFish Class create Fish prototype newAnimal