一、js面向对象基本概念
对象:内部封装、对外预留接口,一种通用的思想,面向对象分析;
1、特点
(1)抽象
(2)封装
(3)继承:多态继承、多重继承
2、对象组成
(1)属性:
任何对象都可以添加属性,(如右侧示例可弹出arr.a为12 var arr=[1,2,3];arr.a=12;alert(arr.a)
全局变量是window的属性,
1 <script> 2 window.a=12; 3 window.onload=function() 4 { 5 alert(a); 6 } 7 </script>
(2)方法:
任何对象都可以添加方法;
全局函数为window的自定义方法;
事件函数为系统自动调用的方法;
(以下代码为为数组对象arr添加属性a和方法show,调用方法show弹出a属性)
<script> var arr=[1,2,3]; arr.a=12; arr.show=function() { alert(this.a);} arr.show; </script>
3、this的使用
this表示拥有当前方法或者属性的对象;
4.new的使用
(1)作用:示例化当前类为对象;
(2)动作流程:指向一个新创建的对象,并返回该对象;
(3)任何方法前都可以加new;
5、类和对象
(1)对象:类的实例化
(2)类:对象的模板
二、创建类
1、基本方法
(1)创建空对象 var obj=new Object();
(2)添加属性 obj.name="pangyongsheng"
(3)添加方法 obj.shuwname=function(){ alert(this.name)}
(4)调用属性 obj.name;
(5)调用方法 obj.showname();
2、构造函数:
以上基本方法可以封装成为一个函数--构造函数
1 function createObjiect(name,qq) 2 { 3 var obj=new Object(); 4 5 obj.name=name; 6 obj.qq=qq; 7 obj.showname=function() 8 { 9 alert(obj.name); 10 } 11 retun obj; 12 }
采用构造函数创建对象:
var aa=creatObject("panyongsheng",820568018);
上述方法存在的问题和缺点:
(1)未采用new进行实例化-
(2)不同对象方法重复,浪费资源
3、改进
(1)采用new创建构造函数,实现添加对象的属性
1 function CreateClass(a,b,c...) 2 { 3 this.a=a; 4 this.b=b; 5 ... 6 }
(2)采用原型添加方法
CreatClass.prototype.fn1=function(){}
CreatClass.prototype.fn2=function(){}
...
----------------------------------------------------------------------------
关于原型:同时为多个对象添加相同的方法->提高资源重用
以为数组添加求和方法为例:
(1)对特点的数组添加sum方法,只能在当前数组使用
var arr1=[1,3,5,7]; var arr2=[2,4,6,8]; arr1.sum=function() { var result; for(var i=1;i<this.length;i++) { result+=this[i]; } } arr1.sum1.sum(); arr1.suml.sum(); //报错
(2)通过原型添加sum方法,任何数组均可以使用该方法
1 Array.prototype.sum=function() 2 { 3 var result; 4 for(var i=1;i<this.length;i++) 5 6 { 7 result+=this[i]; 8 } 9 } 10 var arr1=[1,3,5,7]; 11 var arr2=[2,4,6,8]; 12 arr1.sum1.sum(); 13 arr1.sum2.sum();
----------------------------------------------------------------------------