一、問答
1.OOP 指什么？有哪些特性 (難度: ***)
OOP指的是面向?qū)ο缶幊蹋∣bject Oriented Programmming）是一種計算編程架構(gòu)。OOP的一條基本原則是計算機程序是由單個能夠起到子程序作用的單元或者對象組合而成。
特性：
封裝 ：就是將一個類的使用和實現(xiàn)分開，只保留部分接口和方法與外部聯(lián)系 。
繼承：子類自動繼承其父級類中的屬性和方法，并可以添加新的屬性和方法或者對部分屬性和方法進行重寫。繼承增加了代碼的可重用性。
多態(tài)：多個子類中雖然都具有同一個方法，但是這些子類實例化的對象調(diào)用這些相同的方法后卻可以獲得完全不同的結(jié)果，多態(tài)性增強了軟件的靈活性。
2.如何通過構(gòu)造函數(shù)的方式創(chuàng)建一個擁有屬性和方法的對象? (難度: ***)
構(gòu)造函數(shù)：任何函數(shù)使用new表達(dá)式就是構(gòu)造函數(shù)，下面是一個構(gòu)造函數(shù)的簡單例子和使用方法
function People(name){
this.name=name;
this.sayHi=function(){
console.log(this.name+'say:Hi!');
}
}
var p1=new People("xiaohan");
var p2=new People("xiaosusu")
p1.sayHi();
p2.sayHi();
3.prototype 是什么？有什么特性 (難度: ***)
每個構(gòu)造函數(shù)上，構(gòu)造函數(shù)都有prototype屬性（其實是所有函數(shù)都有prototype屬性，默認(rèn)是object），
構(gòu)造函數(shù)中的prototype屬性就是原生對象，在使用構(gòu)造函數(shù)生成對象實例時，實例對象通過構(gòu)造函數(shù)的prototype屬性找到原生對象，并繼承原生對象的屬性和方法。
作用：原型對象上的所有屬性和方法，都能被派生對象共享。這就是JavaScript繼承機制的基本設(shè)計機制
4.畫出如下代碼的原型圖 (難度: ****)
function People (name){
this.name = name;
this.sayName = function(){
console.log('my name is:' + this.name);
}
}
People.prototype.walk = function(){
console.log(this.name + ' is walking');
}
var p1 = new People('饑人谷');
var p2 = new People('前端');
5.以下代碼中的變量name有什么區(qū)別
function People (){
var name = "饑人谷" //函數(shù)內(nèi)部局部變量
this.name = "我"; //實例對象屬性 每個實例對象初始化的name屬性就是“我”
}
People.name = "jscode"; //靜態(tài)屬性 函數(shù)People的屬性
People.prototype.name = "學(xué)前端"; //實例對象所對應(yīng)原生對象屬性，會被實例對象繼承，
//如果實例對象有name屬性，則會被覆蓋
二、代碼
1.創(chuàng)建一個 Car 對象，擁有屬性name、color、status；擁有方法run，stop，getStatus (難度: ****)
function Car(name,color){
this.name=name;
this.color=color;
this.status="stop";
}
Car.prototype={
run:function(){
this.status="run";
},
stop:function(){
this.status="stop";
},
getStatus:function(){
return this.status;
}
};
2.創(chuàng)建一個 GoTop 對象，當(dāng) new 一個 GotTop 對象則會在頁面上創(chuàng)建一個回到頂部的元素，點擊頁面滾動到頂部。擁有以下屬性和方法
ct屬性，GoTop 對應(yīng)的 DOM 元素的容器
target屬性， GoTop 對應(yīng)的 DOM 元素
bindEvent 方法， 用于綁定事件
createNode 方法， 用于在容器內(nèi)創(chuàng)建節(jié)點
function GoTop($ct,$target){
this.$ct=$ct;
this.$target=$target;
this.init();
}
GoTop.prototype={
bindEvent:function(){
this.$target.on("click",function(){
$(window).scrollTop(0);
})
},
createNode: function(){
this.$ct.append(this.$target);
},
init:function(){
this.createNode();
this.bindEvent();
}
};
var $target=$('<div id="goTop">goTop</div>');
var goTop=new GoTop($(".ct"),$target);
參考文檔：
本教程版權(quán)歸小韓同學(xué)和饑人谷所有，轉(zhuǎn)載須說明來源
