javascript面向对象编程.ppt

成都传智播客,成都传智播客-助你成为高薪程序员,1、2010年7月，传智播客在成都设立分中心（传智播客成都分中心），EasyJF开源创始人蔡世友老师任首席讲师，7月8日，成都传智播客JavaEE+3G就业班第一期正式开课。2、2010年9月，成都传智播客推出先就业后付款，毕业后没有从事软件开发、月薪未达指定数额，则退还全部学费的优惠政策，广受学员好评。3、2010年11月，第一期学员毕业，在仅一个月的时间里，全部学员顺利就业(工作地为成都)，如愿走上软件开发工程师的岗位，月薪平均3000以上，有个别学员甚至拿到4K、K。4、2011年2月，成都传智携手CSDN推出“黑马训练营”课程，并作如下承诺：“不用花一分钱即可入学、不就业不还学费、就业不做软件开发不还学费”，让学员“就业后靠自己的能力逐步偿还学费”。,成都传智播客,Javascript面向对象编程,讲师：蔡世友Email:caishiyou,成都传智播客,Javascript的重要性,使用率、在web应用中,涉及到前端界面编程基本上都要用到javascript语言；2、Web2.0及Ajax推动了javascript语言。3、随着大量的c/s应用转向b/s,富客户端技术的不断推广,javascript语言的应用范围还将不断加大；javascript的特点简单动态基于对象(面向对象),成都传智播客,Javascript面向对象概述,Javascript是一种面向(基于)对象的动态脚本语言，是一种基于对象(Object)和事件驱动(EventDriven)并具有安全性能的脚本语言。他具有面向对象语言所特有的各种特性，比如封装、继承及多态等。但对于大多数人说，我们只把javascript做为一个函数式语言，只把他用于一些简单的前端数据输入验证以及实现一些简单的页面动态效果等，我们没能完全把握动态语言的各种特性。在很多优秀的Ajax框架中，比如ExtJS、JQuery等，大量使用了javascript的面向对象特性，要使用好ext技术，javascript的高级特性，面向对象语言特性是我们必须完全把握的。,成都传智播客,Javascript的相关知识,Javascript的发展历程Javascript的三大组成部分ECMAScript语法数据类型语句关键字保留字操作符对象DOM(DocumentObjectModel)BOM(BrowserObjectModel)JavaScript灵活特性探讨,成都传智播客,Javascript中的数据类型,基本数据类型数字(Numbers)字符串(Strings)布尔Boolean特殊值(null、undefined、NaN)。对象类型Object对象属于复杂的数据类型，对象下面可以包含基本类型、对象、函数等，数组是一种对象类型。对于javascript来说，可以说一切都是对象，包括类！。varc=newObject();,成都传智播客,程序流程控制,顺序结构if条件选择语句switch选择语句while循环语句dowhile语句for循环语句break与continue语句,成都传智播客,for.in循环语句,for(变量in集合或对象)执行语句块,varas=1,4,5,6,output=;for(varxinas)output+=x=+asx;alert(output);,varas=id:5,name:test;for(varxinas)output+=x+=+asx;alert(output);,成都传智播客,逻辑运算符,varmsg=全局变量;functionsquare(x,y)varsum;sum=x*x+y*y;returnsum;functionshow()varmsg=局部变量;alert(msg);/varsum;alert(sum=+sum);sum=square(2,3);alert(sum=+sum);show();,undefined,alert(sum=+square(2,3);,对函数进行调用的几种方式：函数名（传递给函数的参数1，传递给函数的参数2，.）变量=函数名（传递给函数的参数1，传递给函数的参数2，.）对于有返回值的函数调用，也可以在程序中直接使用返回的结果，例如：alert(sum=“+square(2,3);不指定任何函数值的函数，返回undefined。,成都传智播客,函数的参数可变性(arguments）,functionsum()vars=0;for(vari=0;i最多255个。通过函数对象的length可以返回函数希望提供的参数个数。,成都传智播客,使用Function类创建函数,创建动态函数的基本语法格式：varvarName=newFunction(argument1,.,lastArgument);说明：所有的参数都必须是字符串型的，最后的参数必须是这个动态函数的功能程序代码。例子：varsquare=newFunction(x,y,varsum;sum=x*x+y*y;returnsum;);alert(square(3,2);varalsoDoSquare=doAdd;alert(alsoDoSquare(3,2);,成都传智播客,闭包(closure),Javascript闭包就是在另一个作用域中保存了一份它从上一级函数或作用域取得的变量(键值对)，而这些键值对是不会随上一级函数的执行完成而销毁。这样在执行完varc=a()后，变量c实际上是指向了函数b，b中用到了变量i，再执行c()后就会弹出一个窗口显示i的值(第一次为1)。这段代码其实就创建了一个闭包，为什么？因为函数a外的变量c引用了函数a内的函数b，就是说：当函数a的内部函数b被函数a外的一个变量引用的时候，就创建了一个我们通常所谓的“闭包”。,functiona()vari=0;functionb()alert(+i);returnb;varc=a();c();闭包的作用就是在a执行完并返回后，闭包使得Javascript的垃圾回收机制GC不会收回a所占用的资源，因为a的内部函数b的执行需要依赖a中的变量。,成都传智播客,函数的作用域及this,1、在函数或方法中可以使用this来引用函数所在的当前对象2、当没有明确指定函数的当前对象时，作用域为window3、可以使用call及apply来动态改变函数执行的作用域,varb1=v:thisisb1;varb2=v:thisisb2;functionb(d)alert(this.v);b();/输出：window.b();/输出:b.call(b1);/输出：b.apply(b2);/输出：,成都传智播客,JavaScript中的系统函数(Global类),encodeURI及encodeURIComponent方法返回对一个URI字符串编码后的结果。decodeURI及decodeURIComponent()方法将一个已编码的URI字符串解码成最初始的字符串并返回。parseInt方法将一个字符串按指定的进制转换成一个整数，语法格式为：parseInt(numString,radix)。如果没有指定第二个参数，则前缀为0 x的字符串被视为十六进制，前缀为0的字符串被视为八进制，所有其他字符串都被视为是十进制。parseFloat方法将一个字符串转换成对应的小数。isNaN方法用于检测parseInt和parseFloat方法的返回值是否为NaN。escape方法返回对一个字符串进行编码后的结果字符串。所有空格、标点、重音符号以及任何其他非ASCII字符都用%xx编码替换，其中xx等于表示该字符的Unicode编码的十六进制数，字符值大于255的字符以%uxxxx格式存储。unescape方法将一个用escape方法编码的结果字符串解码成原始字符串并返回。eval方法将其中的参数字符串作为一个JavaScript表达式执行。,成都传智播客,JavaScript的内部类,动态对象使用“对象实例名.成员”的格式来访问其属性和方法。静态对象直接使用“对象名.成员”的格式来访问其属性和方法。Object类(对象)Number类(对象)String类(对象)Math类(对象)Date类(对象)toString方法,成都传智播客,Object类,Object类是所有javascript类的基类，提供了一种创建自定义对象的简单方式，不需要程序员再定义构造函数。,主要属性：constructor-对象的构造函数prototype-获得类的prototype对象,static性质主要方法：hasOwnProperty(property)是否属于本类定义的属性isPrototypeOf(object)是否是指定类的prototypepropertyIsEnumerable(property)是否可例举的属性toString()返回对象对应的字符串valueOf()返回对象对应的原始类型值,functiongetAttributeValue(attr)alert(personattr);varperson=newObject();person.name=zs;person.age=18;getAttributeValue(name);getAttributeValue(age);,成都传智播客,Number类,Number类代表数据类，包含一些静态的成员及数值处理的方法。,静态属性：MAX_VALUE、MIN_VALUE、NEGATIVE_INFINITY、POSITIVE_INFINITY、NaN主要方法：toFixed(n)取小数位数，自动四舍五入toPrecision(n)是否是指定类的prototypepropertyIsEnumerable(property)是否可例举的属性toString()返回对象对应的字符串valueOf()返回对象对应的原始类型值,varoNumberObject=newNumber(99);alert(oNumberObject.toFixed(2);/outputs“99.00”,成都传智播客,String类,length属性anchor、big、bold、fontcolor、link等方法charAt方法注意：一个字符串中的第一个字符的索引位置为0，依次类推。charCodeAt方法注意：返回的结果是字符的unicode编码。concat方法，连接字符串indexOf方法及lastIndexOf方法match、search方法replace、split方法slice方法说明：str1.slice(0)和str1.slice(0,-1)都是返回整个字符串。substr、substring方法substring方法返回的内容不包含结束位置的字符。toLowerCase、toUpperCase方法,成都传智播客,Math类,属性：E，代表数学常数e，约等于2.718。LN10，代表10的自然对数，约等于2.302。LN2，代表2的自然对数，约等于0.693。PI，代表数学常数的值，约等于3.14159。SQRT1-2，代表2的平方根分之一，约等于0.707。SQRT2，代表2的平方根，约等于1.414。,方法：abs方法，返回数字的绝对值。sin、cos方法，分别返回数字的正弦、余弦值。asin、acos方法，分别返回数字的反正弦、反余弦值。random方法，返回介于0和1之间的伪随机数,Math对象是一个静态类，不能使用new关键字创建对象实例，应直接使用“对象名.成员”的格式来访问其属性或方法，例如，varnum=Math.random();,成都传智播客,Date类,toGMTString方法，返回Date对象实例所表示的日期的字符串形式，该字符串使用格林尼治标准时间(GMT)格式，例如，“05Jan199600:00:00GMT”。getYear、getMonth、getDate、getDay方法getHours、getMinutes、getSeconds、getMilliseconds方法getTime方法，返回自1970年1月1日0点0分0秒算起，至Date对象实例代表的时间为止的毫秒数。,varcurrent_time=newDate();varstrDate=current_time.getYear()+年;strDate+=current_time.getMonth()+月;strDate+=current_time.getDate()+日;strDate+=current_time.getHours()+:;strDate+=current_time.getMinutes()+:;strDate+=current_time.getSeconds();alert(strDate);,构造方法：Date()、Date(dateVal)、Date(year,month,date,hours,minutes,seconds,ms)parse方法，分析一个表示日期时间的字符串，返回它所表示的时间值，该值以自1970年1月1日0点0分0秒算起的毫秒值表示。parse方法属于一个静态方法。,成都传智播客,toString方法,toString方法是JavaScript中的所有内部对象的一个成员方法，它的主要作用就是将对象中的数据转换成某种格式的字符串来表示，具体的转换方式取决于对象的类型。举例：varx=328;alert(hex=“+x.toString(16)+bin=“+x.toString(2);,成都传智播客,Array类,三种构造方法：Array()Array(4)Array(3.5,abc,3),数组排序例子：vararr=newArray();arr0=3.5;arr1=abcarr2=3;arr.sort();varx,str=;for(xinarr)str+=x+:“+arrx+n;alert(str);,成都传智播客,Array类的属性及方法,length获得数组的长度；concat连接数组；join把数组转换成字符串；pop弹出一个元素；push放入一个元素；reverse颠倒数据中的元素顺序；shift移出第一个元素；slice截取数组;sort排序数组;unshift在前面追加元素；,成都传智播客,用对象的方式实现数组,functionMyArray()this.length=arguments.length;for(vari=0;i,functionMyArray(size)this.length=size;for(vari=0;i,成都传智播客,用户自定义类及对象,、工厂方法使用newObject创建对象并添加相关属性；、使用构造函数来定义类。、使用prototype、构造函数及原型混合方式、动态原型方式,实例Car类(对象)属性：color-颜色doors门的个数price价格drivers-司机方法：showColor显示出车的颜色,成都传智播客,typeof及instanceof运算符,delete操作符用来删除一个对象的指定成员。typeofxxstring返回xx对象的类型或undefined。vard=7.5;alert(typeofd);alert(typeofd2);alert(typeofnewObject();alert(typeofObject);,xxinstanceof类名，返回boolean类型：varo=newString(ab);alert(oinstanceofString);alert(oinstanceofNumber);alert(oinstanceofObject);,成都传智播客,delete及void操作符,delete操作符用来删除一个对象的指定成员。vard=newObject();d.p1=thisisp1;alert(d.p1);deleted.p1;alert(d.p1);delete只能删除用户自义的成员。deleted.toString;alert(d.toString();,void用来把任意数字转换为undefined。vard=newObject();alert(void(d);运用场景：ClickMe,成都传智播客,类的修改,1、prototype详解2、给已有类添加新方法3、重新定义类的方法4、超级后置绑定,prototype是Function对象的一个属性，当我们访问对象的一个成员时，先在对象内部找，如果找不到，则到对象所在类的prototype对象中找。,成都传智播客,封装,封装：封装，也就是把客观事物封装成抽象的类，并且类可以把自己的数据和方法只让可信的类或者对象操作，对不可信的进行信息隐藏。javascript中，通过闭包可以实现封装，看代码例子。涵盖了javascript公有成员定义、私有成员定义、特权方法定义的简单示例！1.2./定义一个javascript类3.functionJsClass(privateParam/*/,publicParam)/构造函数4.varpriMember=privateParam;/私有变量5.this.pubMember=publicParam;/公共变量6./定义私有方法7.functionpriMethod()8.returnpriMethod();9.10./定义特权方法11./特权方法可以访问所有成员12.this.privilegedMethod=function()13.varstr=这是特权方法，我调用了n;14.str+=私有变量：+priMember+n;15.str+=私有方法：+priMethod()+n;16.str+=公共变量：+this.pubMember+n;17.str+=公共方法：+this.pubMethod();18.19.returnstr;20.21.22./添加公共方法23./不能调用私有变量和方法24.JsClass.prototype.pubMethod=function()25.returnpubMethod();26.27.28./使用JsClass的实例29.JsObject=newJsClass(priMember,pubMember);30.31./alert(JsObject.pubMember);/弹出pubMember信息32./alert(JsObject.priMember);/弹出undefined信息33./alert(JsObject.pubMethod();/弹出pubMethod信息34./alert(JsObject.priMethod();/弹出对象不支持此属性或方法的错误35.alert(JsObject.privilegedMethod();36.,成都传智播客,继承,面向对象编程(OOP)语言的一个主要功能就是“继承”。继承是指这样一种能力：它可以使用现有类的所有功能，并在无需重新编写原来的类的情况下对这些功能进行扩展。1、对象冒充2、call及apply3、原型链4、混合方式,成都传智播客,继承-对象冒充,functionclassA(name)this.name=name;this.showName=function()alert(this.name);functionclassB(name)this.newMethod=classA;this.newMethod(name);obj=newclassA(hero);objB=newclassB(dby);obj.showName();/printheroobjB.showName();/printdby说明classB继承了classA的方法.对象冒充可以实现多重继承例如functionclassz()this.newMethod=classX;this.newMethod();deletethis.newMethod;但是如果classX和classY有相同的属性或者方法,classY具有高优先级.,成都传智播客,继承-call方法,call方法使与经典的对象冒充法就相近的方法,它的第一个参数用作this的对象,其他参数都直接传递给函数自身.functionsayName(perfix)alert(perfix+this.name);obj=newObject();obj.name=hero;sayName.call(obj,hello,);functionclassA(name)this.name=name;this.showName=function()alert(this.name);functionclassB(name)classA.call(this,name);objB=newclassB(bing);objB.showName();/说明classB继承classA的showName方法,成都传智播客,继承-apply方法,aplly()方法有2个参数,一个用作this对象,一个使传递给函数的参数数组.functionsayName(perfix)alert(perfix+this.name);obj=newObject();obj.name=hero;sayName.aplly(obj,newArray(hello,);,成都传智播客,继承-原型链,prototype对象的任何属性和方法都会被传递给对应类的所有实例,原型链就是用这种方式来显现继承.functionclassA()classA.prototype.name=hero;classA.prototype.showName=function()alert(this.name)functionclassB()classB.prototype=newclassA();objb=newclassB()objb.showName();/printhero说明b继承了a的方法这里需要注意调用classA的构造函数时,没有给它传递参数,这是原型链的标准做法,确保函数的构造函数没有任何参数.并且子类的所有属性和方法,必须出现在prototype属性被赋值后,应为在它之前赋的值会被删除.因为对象的prototype属性被替换成了新对象,添加了新方法的原始对象将被销毁.,成都传智播客,继承-混和方式,就是用冒充方式定义构造函数属性,用原型法定义对象方法.functionclassA(name)this.name=name;classA.prototype.showName=function()alert(this.name)functionclassB(name)classA.call(this,name);classB.prototype=newclassA();classB.prototype.showName1=function()alert(this.name+*);obj=newclassB(hero);obj.showName();obj.showName1();在classB的构造函数中通过调用call方法继承classA中的name属性,用原型链来继承classA的showName方法.,成都传智播客,javascript中的方法重载探讨,方法重载(overloading)及覆盖(overriding)Javascript中的方法本身就是一个带可变参数的，不支持重载操作。但我们可以在方法体内自由检测方法的参数情况，来实现重载的效果。(使用可变参数或arguments来模拟重载的示例)。覆盖，也称为改写，就是指子类中定义的方法替换掉父类的方法,成都传智播客,javascript中多态性(polymorphisn)探讨,多态性(polymorphisn)：是允许你将父对象设置成为和一个或更多的他的子对象相等的技术，赋值之后，父对象就可以根据当前赋值给它的子对象的特性以不同的方式运作。简单的说，就是一句话：允许将子类类型的指针赋值给父类类型的指针。多态是为了实现另一个目的接口重用!多态的作用，就是为了类在继承和派生的时候，保证使用“家谱”中任一类的实例的某一属性时的正确调用。vara=a1,a2,a3;,成都传智播客,结束语,热烈欢迎大家到成都传智播客免费领取Java学习视频光盘；热烈欢迎大家到成都传智播客教学现场免费试听Java及3G课程！热烈欢迎各软件公司到成都传智播客预定和招聘软件开发人才！,成都传智播客,成都传智播客-助你成为高薪程序员,1、2010年7月，传智播客在成都设立分中心（传智播客成都分中心），EasyJF开源创始人蔡世友老师任首席讲师，7月8日，成都传智播客JavaEE+3G就业班第一期正式开课。2、2010年9月，成都传智播客推出先就业后付款，毕业后没有从事软件开发、月薪未达指定数额，则退还全部学费的优惠政策，广受学员好评。3、2010年11月，第一期学员毕业，在仅一个月的时间里，全部学员顺利就业(工作地为成都)，如愿走上软件开发工程师的岗位，月薪平均3000以上，有个别学员甚至拿到4K、K。4、2011年2月，成都传智携手CSDN推出“黑马训练营”课程，并作如下承诺：“不用花一分钱即可入学、不就业不还学费、就业不做软件开发不还学费”，让学员“就业后靠自己的能力逐步偿还学费”。,成都传智播客,2010年7月8日，传智播客成都隆重开班!,成都传智播客开班现场,成都传智播客,2010年7月8日，传智播客成都隆重开班!,张孝祥老师在成都传智上课,成都传智播客,成都传智播客教学现场!,张孝祥老师在成都传智播客上课,成都传智播客,成都传智播客教学现场!,传智播客学员正在听课,成都传智播客,成都传智播客教学现场!,成都传智主讲教师蔡世友老师在上课,成都传智播客,成都传智播客教学现场!,蔡世友老师在andorid课堂上指导学生实战,成都传智播客,成都传智播客师资团队!,成都传智播客,成都传智播客师资团队!,成都传智播客,成都传智播客观摩及出师项目展示!,成都传智播客观摩及出师项目展示!,成都传智播客,