面向对象

在谈面向对象之前我们先了解一下原型概念，我们在实际应用中，原型是类的基础

原型

我们还是不谈那些文邹邹的东西——每一个对象都从原型继承属性，通过对象直接量创建的对象都有同一个原型对象Object.prototype，知道这些就可以了，如果想详细了解可以点击这里

类

我们用函数来封装类

牛刀小试-定义基类

function Button(){
      var color = '#00FF00';
      this.background = '#FF0000';
      var.setColor = function(c){
           color = c;
      } 
      this.run = function(){
          console.log('run');
      }
}
Botton.prototype.click = function(){
     console.log('click');
}
var btn = new Button();
console.log(btn.color) //undefined 私有变量
console.log(btn.background) //#FF0000 公共变量
btn.setColor('#0000FF'); //not a function  私有函数
btn.run() //run 公有方法 *与下面的protorype方法不同定义的不同，下面会看到
btn.click() //click 公有方法
//
console.log(btn.constructor == Button) //验证实例的构造函数原型
//
console.log(btn instanceof Button) //验证原型与实例关系
//
console.log(Button.prototype.isPrototypeOf(btn)) //验证原型和实例关系
//
console.log(btn.hasOwnProperty('background')) //判断属性是否是本地的或是继承来的

构造函数内变量和方法不共享，原型链上的函数共享

继承
我们使用call或apply来模拟继承，同时继承又分为全继承和部分继承

全继承

function iButton() {
      Button.call(this); //这里可以使用apply,作用一样,只是参数的格式不同
}
//全部继承Button的构造函数
iButton.prototype = Button.prototype; //继承Button的原型链。
var ibtn = new iButton();
console.log(ibtn.background);
console.log(ibtn.click);

部分继承

function iButton() {
}
iButton.prototype = Button.prototype; //只继承Button的原型链。
iButton.prototype.constructor = iButton; //iButton的构造函数是自己本身
var ibtn = new iButton();
console.log(ibtn.background); //undefined
console.log(ibtn.click); //click
//
function iButton() {
    Button.call(this); //call只能继承Button的构造函数
}
var ibtn = new iButton();
console.log(ibtn.background); //#FF0000
console.log(ibtn.click); //not a function

多态
这个概念其实就比较简单了，封装函数预留参数，通过对参数类型和内容的判断来执行不同的操作来实现。这里就不做案例了。

原型

类

推荐阅读更多精彩内容