• 封裝tab選項(xiàng)卡

function Tab(id){
    //this=>實(shí)例對(duì)象 這個(gè)實(shí)例對(duì)象下面有三個(gè)屬性
    this.oParent = document.getElementById(id);
    this.aInput = this.oParent.getElementsByTagName("input");
    this.aDiv = this.oParent.getElementsByTagName("div");
}
Tab.prototype.init=function(){
    var This = this;//存儲(chǔ)tab實(shí)例對(duì)象
    for(var i = 0; i<this.aInput.length; i++){
        this.aInput[i].index = i;//添加自定義屬性
        this.aInput[i].onclick = function(){
            //this==>btn,期望實(shí)例對(duì)象去掉用change
            This.change(this);
        }
    }
}
Tab.prototype.change = function(obj){
    for(var j = 0; j<this.aInput.length; j++){
        //aInput[j] aDiv[j]
        this.aInput[j].className="";
        this.aDiv[j].style.display = "none";
    }
    obj.className = "active";//這里的this期望指的是btn
    //當(dāng)this發(fā)生沖突的時(shí)候，保大對(duì)象
    this.aDiv[obj.index].style.display = "block";
}

window.onload = function(){
    var t1 = new Tab("div1");
    t1.init();
    var t2 = new Tab("div2");
    t2.init();
    var t3 = new Tab("div3");
    t3.init();
}

• 拷貝繼承

//掌握拷貝繼承，了解原型繼承和類式繼承
function CreatePerson(name,sex){
    this.name = name;
    this.sex = sex;
}
CreatePerson.prototype.showName = function(){
    alert(this.name);
}
var p1 = new CreatePerson("zhangsan","男");
//p1.showName();
//現(xiàn)在來一個(gè)學(xué)生類 屬性：name,sex,address
//分析：一個(gè)學(xué)生類：屬性和方法 分開繼
function Student(name,sex,address){
    //繼承父類，人類 name,sex  this==>學(xué)生
    CreatePerson.call(this,name,sex);
    //name,sex繼承成功，把CreatePerson的th指向指向到當(dāng)前student類
    this.address = address;
}
extend(CreatePerson.prototype,Student.prototype);
function extend(obj1,obj2){
    for(var attr in obj1){
        obj2[attr] = obj1[attr];
    }
}
var s1 = new Student("lisi","女","武漢");
s1.showName();

• 原型繼承

var a = {
    name:"張三"
}
var b  = cloneObj(a);//沒有用有用到new
function cloneObj(obj){
    //創(chuàng)建一個(gè)代理函數(shù)
    var F = function(){};
    F.prototype = obj//用代理函數(shù)接收要被繼承的對(duì)象
    return new F();//返回的是代理函數(shù)的實(shí)例
}
alert(b.name);
b.name = "李四"
alert(a.name);