JavaScript面向对象.pdf

1 / 7 JavaScript 面向对象 一、澄清概念 1.JS 中“基于对象=面向对象“ 2.JS 中没有类(Class)，但是它取了一个新的名字叫“原型对象”，因此“类=原型对象“ 二、类(原型对象)和对象(实例)的区别与联系 1.类(原型对象)是抽象，是概念的，代表一类事物。 2.对象是具体的，实际的，代表一个具体的事物。 3.类(原型对象)是对象实例的模板，对象实例是类的一个个体。 三、抽象的定义 在定义一个类时，实际上就是把一类事物的共有属性和行为提取出来，形成一个物理模型(模板)，这种研究问题的方法 称为抽象。 四、JavaScript 面向对象三大特征 4.1.封装 封装就是把抽象出来的属性和对属性的操作封装在一起，属性被保护在内部，程序的其它部分只有通过被授权的操作(函 数)，才能对属性进行操作！ 封装的范例： 1 2 /*定义一个 Person 类*/ 3 function Person(_name,_age,_salary) 4 /Person 类的公开属性，类的公开属性的定义方式是：”this.属性名“ 5 this.Name=_name; 6 /Person 类的私有属性，类的私有属性的定义方式是：”var 属性名“ 7 var Age=_age; 8 var Salary=_salary; 9 10 /定义 Person 类的公开方法(特权方法)， 类的公开方法的定义方式是： ”this.functionName=function().“ 11 this.Show=function() 12 alert(“Age=“+Age+“t“+“Salary=“+Salary);/在公开方法里面访问类的私有属性是允许的 13 14 /* 15 定义 Person 类的私有方法(内部方法)， 16 类的私有方法的定义方式是：”function functionName().“， 17 或者 var functionName=function() 2 / 7 18 */ 19 function privateFn() 20 alert(“我是 Person 类的私有函数 privateFn“); 21 22 23 var privateFn2=function() 24 alert(“我是 Person 类的私有函数 privateFn2“); 25 26 27 /*通过 prototype 给可以类的所有对象添加公共(public)方法， 28 但是这种方式定义的方法不能去访问类的私有属性和私有方法*/ 29 Ptotype.Fn=function() 30 alert(“访问公共属性 this.Name=“+this.Name);/访问公共属性，OK 的 31 /alert(“访问私有属性 Aag=“+Age);/访问私有属性，这里会报错“Age 未定义” 32 /privateFn();/调用私有方法，这里会报错“缺少对象” 33 34 35 36 var p1 = new Person(“孤傲苍狼“,24,2300); 37 alert(“p1.Name=“+p1.Name);/访问公有属性，这是可以正常访问的 38 alert(“p1.Age=“+p1.Age+“t“+“p1.Salary=“+p1.Salary);/不能使用类的对象去直接访问类私有属性，这是访问 不了的，结果都是 undefined 39 p1.Show();/调用类的公共函数，这次允许的 40 p1.Fn();/调用类的公共函数，这次允许的 41 /alert(“p1.privateFn()：“+p1.privateFn()+“ p1.privateFn2()：“+p1.privateFn2();/不能使用类的对象去 调用类的私有方法，这里会报错”对象不支持此属性或者方法“ 42 4.2.继承 继承范例： 1 2 /*定义 Stu 类*/ 3 function Stu(name,age) 4 this.Name=name; 5 this.Age=age; 6 this.Show=function() 7 window.alert(“我的名字是：“+this.Name+“，今年：“+this.Age); 8 3 / 7 9 this.SayHello = function() 10 window.alert(“Hello，“+this.Name); 11 12 13 14 /*定义 MidStu 类*/ 15 function MidStu(name,age) 16 this.stu=Stu;/MidStu 类继承 Stu 类 17 this.stu(name,age);/JS 中实际上是通过对象冒充来实现继承的，这句话不能少，因为 JS 是动态语言，如果不 执行，则不能实现继承效果 18 /* 19 从父类继承下来的公共方法，可以根据实际情况选择重写 20 */ 21 /在子类 MidStu 中重写父类 Stu 的 Show 方法 22 /*this.Show=function() 23 alert(“MidStu.Show()“); 24 */ 25 /在子类 MidStu 中重写父类 Stu 的 SayHello 方法 26 this.SayHello=function() 27 alert(“你好，“+this.Name); 28 29 30 31 32 var midStu = new MidStu(“孤傲苍狼“,24);/创建一个 MidStu 类实例对象 33 alert(“访问继承下来的属性 Name 和 Age，midStu.Name=“+midStu.Name+“， midStu.Name=“+midStu.Age);/访问继承下来的属性 34 midStu.Show();/调用从父类 Stu 继承下来的 Show 方法 35 midStu.SayHello();/调用从父类 Stu 继承下来的 SayHello 方法，SayHello()在子类中进行了重写，这里调用的是 重写过后的 SayHello()方法 36 运行结果： 4 / 7 4.3.多态 所谓多态，就是指一个引用在不同情况下的多种状态，在 Java 中多态是指通过指向父类的引用，来调用不同子类中实现 的方法。 JS 实际上是无态的，是一种动态语言，一个变量的类型是在运行过程中由 JS 引擎决定的，所以说，JS 天然支持多态。 五、JavaScript 自定义类(原型对象)的方式 5.1.工厂方法使用 new Object 创建对象并添加相关属性 1 /通过 Object 直接创建对象 2 /var p1 = new Object();/创建一个 Object 对象 3 var p1 = ;/创建一个 Object 对象，简写 4 /动态增加属性、方法 5 p1.Name = “孤傲苍狼“; 6 p1.Age = 24; 7 p1.SayHello = function() alert(“hello，“+p1.Name); ; 8 p1.SayHello(); 9 for(var propertyName in p1) /对象的成员都是对象的 key 10 alert(propertyName); 11 5.2.使用构造函数来定义类(原型对象) 基本语法： 1 function 类名() 2 this.属性名;/公共属性 3 var 属性名;/私有属性 4 /*凡是定义类的公共属性和公共方法都要使用 this*/ 5 /定义类的公共函数 6 this.函数名=function() 7 8 9 /定义类的私有函数 10 function 函数名() 11 12 13 5 / 7 范例： 1 /*定义一个猫类，这种就是使用构造函数来定义类(原型对象)*/ 2 function Cat() 3 this.Name=“catName“;/public 属性 4 this.Age;/public 属性 5 this.Color;/public 属性 6 var weight=2;/private 属性，只能在 Cat 类内部使用，Cat 类的对象无法访问这个私有属性 7 /public 方法 8 this.publicFunction = function() 9 alert(weight); 10 alert(“猫叫.“); 11 12 /private 方法，只能在 Cat 类内部使用，Cat 类的对象无法访问这个私有方法 13 var privateFunction = function() 14 alert(“私有方法“); 15 16 17 18 19 /如果这样用，那么就当成函数来使用 20 Cat(); 21 /如果这样用，那么就当成类来使用 22 var cat1 = new Cat(); 23 /cat1 就是一个对象(实例) 24 alert(cat1.Name);/访问公共属性，弹出默认值 catName 25 cat1.Name=“TomCat“;/访问公共属性 26 cat1.Age=3;/访问公共属性 27 cat1.Color=“白色“;/访问公共属性 28 alert(cat1.weight);/访问私有属性，无法访问，弹出 undefined 29 alert(cat1.Name+“t“+cat1.Age+“t“+cat1.Color);/访问对象的属性方式 1：对象名.属性名 30 alert(cat1“Name“+“t“+cat1“Age“+“t“+cat1“Color“);/访问对象的属性方式 2：对象名“属性名“ 31 cat1.publicFunction();/调用 public 方法 32 cat1.privateFunction();/调用 private 方法，报错：对象不支持此属性或方法 33 for(var property in cat1) 34 document.writeln(property+“t“); 35 JS 中一切都是对象，类(原型对象)其实也是对象，它实际上是 Function 类的一个实例 6 / 7 1 document.write(“); 2 function Person() 3 4 5 /*Person.constructor 得到的 Person 类的构造函数如下： 6 function Function() 7 native code 8 9 */ 10 document.writeln(“Person.constructor：“+Person.constructor);/Person 类的构造函数 11 document.writeln(“Person：“+Person); 12 var p1 = new Person(); 13 document.writeln(“p1.constructor：“+p1.constructor);/”p1.constructor“是得到 p1 实例的构造函数 14 /如何判断某个对象是不是某个类型，采用如下两种方式 15 if(p1 instanceof Person) 16 document.writeln(“p1 is Person ok1“); 17 18 if(p1.constructor=Person) 19 document.writeln(“p1 is Person ok2“); 20 21 22 var num1=123; 23 document.writeln(“num1.constructor：“+num1.constructor); 24 25 var str1=“abc“; 26 document.writeln(“str1.constructor：“+str1.constructor); 27 document.write(“) 运行结