面向对象的思想（自我总结篇）

面向对象：

　　　　对象：把对象看成是一个黑盒子，不需要知道里面到底包装了什么内容、什么结构和什么原理，只需要会用它提供给我们的一些功能和方法即可。对象是一个整体，对外提供一些操作。面向对象就是使用对象时，只关注对象提供给我们的功能，不必去关心它内部的细节，例如：电视机（包装好的，看不见内部结构）提供给我们一些按钮和遥控器，我们可以使用遥控器或者电视机上的物理按键的功能即可使用电视机为我们做一些事情。又例如：jQuery（JavaScript库）提供给我们一些API接口，我们可以通过它的API使用它内部的一些功能和方法，面向对象是一种通用的思想，并非只有编程中能用，任何事情都可以用，可以简单的理解为一切皆对象，抽象出来一个个整体。

JS中的面向对象：

　　　　面向对象的编程（OOP）它有三大特点：（1）抽象——把跟问题相关的特征、把主要的特征抽出来具体出来。（2）封装——不考虑内部结构、实现，只考虑功能的使用。（3）继承——从已有的对象上，继承出新的对象（1.多重继承、2.多态）。

　　　　对象的组成：（1）属性——变量：状态、静态的。（2）方法——函数：过程、动态的。

变量和属性

var a = 12; // 声明一个变量 —— 这个叫变量：自由的，不属于任何东西
alert(a);　　 //12
var arr = [1,2,3,4,5]; //声明一个数组
arr.a = 12 ; //给数组添加一个属性——这个叫属性：属于一个对象的，除了这个其他没区别
alert(arr.a) //12
函数和方法

　　function aaa(){ //函数：自由的函数
　　 alert(“abc”);
};
aaa(); //”abc” //调用函数aaa

　　var arr = [1,2,3,4,5];
arr.aaa=function (){ //方法：属于一个对象的方法
alert(“abc”);
};
arr.aaa(); //”abc”　　 //调用arr的aaa方法
this：

var Obj = new Object(); //如果是数组[1,2,3,4,5]
　　Obj.a=12;
　　Obj.arr=function(){　　 //当前这个arr方法属于Obj这个对象（给一个对象添加方法）
　　alert(this.a) //初步定义this:当前发生事件的对象
　　alert(this) //[1,2,3,4,5]新定义this：当前的方法属于哪个对象，this就是那个对象（当前的arr方法属于数组，所以this就是数组）
}
Obj.arr();

　　　oDiv.οnclick=function(){ //给一个对象添加事件相当于给一个对象添加方法（事件也是函数的一种）
　　alert(this) //新定义this：当前的方法属于哪个对象，this就是那个对象（当前的onclick方法属于oDiv，所以this就是oDiv）
}
window：

　　function show(){　　　　 //全局的函数是属于window的 等同于 window.show= function(){}
　　　　alert(this);　　　　　　//[object Window]
　　}
　　show();
创建一个对象：

　　首先我们不能再系统对象中随意附加方法、属性，否则会覆盖已有的方法、属性。所以object对象很适合用来新建一个自定义的对象，下面就开始创建我们第一个面向对象的程序

　　var obj = new Object();
　　obj.name=”Arvin”;
　　obj.age=12;
　　obj.showName=function(){
　　　　alert(“我的名字是：”+this.name);
　　};
　　obj.showAge=function(){
　　　　alert(“我的年龄是：”+this.age);
　　};
　　obj.showName();
　　obj.showAge();
对于我们面向对象的思想来解释下，我们只需要：

　　var obj = new Object(); //new 一个对象
　　obj.showName(); //调用它提供的方法
　　obj.showAge();
但是——如果单纯是这样的话也就没什么难度了，我们需要用一个通用的方法把这个功能给包起来，当我们需要的时候直接传参就可以使用里面的属性和方法了（我们把这种方法叫构造函数——它能够创建一个对象但它跟普通函数一样）：

function People(name,age){ //这种构造函数的方式叫工厂方式
//原料
　　　　var obj=new Object();
//加工
　　　　obj.name=name;
　　　　obj.age=age;
　　　　obj.showInfo=function(){
　　　　　　alert(“我的名字是：”+this.name+”，我的年龄是：”+this.age);
　　　　};
//出厂
　　　　return obj;
　　}
　　　　var obj=People(“Arvin”,”18”);
　　　　obj.showInfo();
　　　　var abj=People(“Aaron”,”10”);
　　　　abj.showInfo();
但是这种模式有些缺憾——

　　第一个是因为没有new运算符，像我们平时创建一个对象需要var oDate = new Date(); var aArr = new Array();而这个仅仅是var obj=People(“Arvin”,”18”);

　　第二个就是函数重复浪费资源，我们alert（obj.showInfo()==abj.showInfo()） //false，发现他们并不相等，所以本来一样的函数但它们却并不相等；

为了解决第一个没有new运算符的问题，我们来看看关于new的一些小特点——

　　new：

function show(){
　　alert(this);
}
show(); //window
new show(); 　　//new出来的对象
如果我们在函数调用的时候在函数前面加个new（任何函数都能在前面加个new），此时函数里面的this将不会指向window，而是指向我们新建出来的对象；

当我们加了new之后浏览器会帮我们声明一个变量this(如下)：

function People(name,age){
//浏览器内部运行
　　　　//var this=new Object();
//加工
　　　　this.name=name;
　　　　this.age=age;
　　　　this.showInfo=function(){
　　　　　　alert(“我的名字是：”+this.name+”，我的年龄是：”+this.age);
　　　　};
//还会返回this
　　　　//return this;
　　}
　　　　var obj=new People(“Arvin”,”18”);
　　　　obj.showInfo();
　　　　var abj1=new People(“Aaron”,”10”);
　　　　abj1.showInfo();
这样就解决我们在函数前面没有new的问题，接下来再说第二个问题之前，先引进一个概念——原型(prototype):

prototype类似于css中的class（关于类）一次给一组元素加样式

给对象加函数类似于css中的加行内样式 一次给一个元素加样式

　　var arr1 = new Array(1,2,3,4);
　　var arr2 = new Array(1,2,3);
　　Array.prototype.sun=function(){ //给数组的原型上添加一个sun方法相当于给父级加了一个方法，继承给了子级
　　//arr1.sun=function(){ //行内样式
　　　　var a = 0;
　　　　for(i=0;i