面向对象:是一种思想;
对象:生活中的像汽车,电视,收音机等都是对象,我们只关注使用功能,不关注他们的内部怎么实现的;
对象特征:抽象,封装,继承;
抽象:把问题的关键提取出来;
封装:只关注使用功能,不关注内部实现;
继承:从一个已有的对象继承它的属性和方法;
继承:多重继承(一个子类可以有两个父类),多态
对象:包括属性,方法,
属性在不属于一个对象前称为变量;
方法在不属于一个对象前称为函数;
类:模子,
对象:带有使用功能的;
工厂方式:原料:创建对象;加工:添加属性,方法;出厂:return返回对象;
原型用到对象中:构造函数.prototype.fn;,让每个创建的对象共用一个函数;
fn CreatPerson(name,age){//构造函数;构造函数名首字母大写;
this.nam=name;//this代表属性所属的那个对象;
this.age=age;
}
CreatPerson.prototype.showName=function(){//在原型上绑定函数;
alert('my name is '+this.name);
}
CreatPerson.prototype.showAge=function(){
alert("i'm "+this.age+' years old.');
}
var obj1=new CreatPerson('duoduo','23');
obj1.showName();
obj1.showAge();
实例:选项卡切换;
将面向过程选项卡改写成面向对象;
函数不能有嵌套 可以有全局对象;
然后改写:
1.全局对象 -->属性;
2、函数-->方法;
3.添加this;this代表新创建的对象。但像oBtn[i].onclick=this.tabClick;时,this就被赋给了oBtn.要讲tabClick包含在function(){}里面,并加上_this(代表新创建对象的this);this.className='';this代表oBtn被点击的按钮,在方法里面可以通过穿参的方式:tabClick(oBtn),oBtn.className来解决;
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
<script> window.onload=function () { new TabSwitch('div1'); }; function TabSwitch(id) { var _this=this; var oDiv=document.getElementById(id); this.aBtn=oDiv.getElementsByTagName('input'); this.aDiv=oDiv.getElementsByTagName('div'); for(var i=0;i<this.aBtn.length;i++) { this.aBtn[i].index=i; this.aBtn[i].onclick=function () { _this.fnClick(this); }; } }; TabSwitch.prototype.fnClick=function (oBtn) { //alert(this); for(var i=0;i<this.aBtn.length;i++) { this.aBtn[i].className='' this.aDiv[i].style.display='none'; } oBtn.className='active'; this.aDiv[oBtn.index].style.display='block'; } </script>