從創(chuàng)建一個函數(shù)開始
函數(shù)的創(chuàng)建有很多形式骡男，通常我們會采用以下做法
function getName(){
//get name here
}
function getAge(){
//get age here
}
var getName = function(){
//get name here
}
var getAge= function(){
//get age here
}
但是這種做法有個弊端，這類函數(shù)因為都是全局變量买喧，所以在團隊合作姨俩，或者項目函數(shù)很多時就會出現(xiàn)函數(shù)命名重復(fù)的問題，那就糟糕了北戏，會出現(xiàn)函數(shù)被覆蓋负芋，導(dǎo)致不必要的工作量。所以可以采用下面的方式（用對象來收編方法嗜愈，變量）
var GetUserInfo= {
getName:function(){
//get name here
},
getAge :function(){
//get age here
}
}
//或者像下面這樣
var GetUserInfo= function(){};
GetUserInfo.getName = function(){
//get name here
},
GetUserInfo.getAge = function(){
//get age here
}
但是上面方法旧蛾，還有個問題惩猫，就是這個對象不能復(fù)制，比如我只想使用里面的getUserInfo.getAge()這個方法蚜点，但是沒有辦法復(fù)制一個這樣的對象來給自己使用，除非代碼全部拷貝一遍拌阴，這無疑徒增了代碼量绍绘，所以我們可以采用return來返回一個新的函數(shù)對象，如下
var GetUserInfo= function(){
return {
getName :function(){
//get name here
},
getAge : function(){
//get age here
}
}
}
這樣我們就可以安心復(fù)制getUserInfo其中的某個方法來為自己所用了,使用方法如下
var getUserInfo_myself = GetUserInfo()
getUserInfo_myself.getName()
上面的方法雖然可以完美達到我們的要求迟赃，但是編程最重要的是什么陪拘？當然時面向?qū)ο螅∥覀儊砘仡櫼幌旅嫦驅(qū)ο蟮娜齻€基本特征：封裝纤壁、繼承左刽、多態(tài)。
封裝：類其實就是保存了一個函數(shù)的變量酌媒，這個函數(shù)有自己的屬性和方法欠痴。將屬性和方法組成一個類的過程就是封裝。
所以要實現(xiàn)封裝秒咨，我們就得用JS實現(xiàn)一個類
//ES5
var GetUserInfo= function(){
this.getName = function(){
//get name here
},
this.getAge = function(){
//get age here
},
}
//this的指向簡單理解就是函數(shù)被調(diào)用時的執(zhí)行環(huán)境喇辽，也可以說時誰調(diào)用該函數(shù)，this就指向誰
//這里this就指向getUserInfo_myself
上面的代碼（構(gòu)造函數(shù)）就實現(xiàn)了一個類（函數(shù)雨席，有自己的屬性菩咨，有自己的方法）
調(diào)用時，我們就不能var getUserInfo_myself = GetUserInfo()這樣來用了陡厘。要像下面這樣
var getUserInfo_myself = new GetUserInfo()
getUserInfo_myself()
以為這樣就結(jié)束抽米？這還不算是最好的方案，因為通過new來創(chuàng)建新對象的時候糙置，新創(chuàng)建的對象都會復(fù)制一次this的屬性云茸，用多了就會造成很多消耗，我們可以避免嗎谤饭？可以查辩！通過原型的方式來實現(xiàn)，看下面
//ES5方法一
var GetUserInfo=function(){};
GetUserInfo.prototype.getName={
//get name here
}
GetUserInfo.prototype.getAge={
//get age here
}
//ES5方法二
var GetUserInfo=function(){};
GetUserInfo.prototype={
getName(){
//get name here
}
getAge(){
//get agehere
}
}
//用ES6的語法
class GetUserInfo{
constructor(){}
getName(){
//get name here
}
getAge(){
//get age here
}
}
使用方法如下
var getUserInfo_myself = new GetUserInfo()
// class方法必須使用new网持，否則會報錯
getUserInfo_myself.getName()
getUserInfo_myself.getAge()
之前的例子中我們想要執(zhí)行g(shù)etName和getAge方法都要將對象getUserInfo_myself寫兩次宜岛，那我們就可以用鏈式調(diào)用來優(yōu)化一下，那我們應(yīng)該怎么做功舀？看下面
//創(chuàng)建對象的方式實現(xiàn)
var GetUserInfo= {
getName: function(){
console.log('getName')
console.log(this)
return this
},
getAge: function(){
console.log('getAge')
console.log(this)
return this
}
}
GetUserInfo.getName().getAge()
//這里的this指向GetUserInfo萍倡，所以GetUserInfo.getName().getAge()其實就是這樣執(zhí)行的
//1. GetUserInfo.getName() 返回this,this指向GetUserInfo，GetUserInfo有兩個方法getName()和getAge()
//2. this.getAge() 也就是 GetUserInfo.getAge()
//原型的方式實現(xiàn)
var GetUserInfo = function(){}
GetUserInfo.prototype={
getName(){
//get name here
return this
}
getAge(){
//get agehere
return this
}
}
