????????今天是2018/07/02, 今天繼續(xù)帶大家走進(jìn) js 底層的設(shè)計(jì)模式 , 作為一個(gè)web工程師,我想次面試,都會(huì)問(wèn)道?
?html 嘹悼、js 萨醒、css 艇纺、這些基本的知識(shí)點(diǎn),很少問(wèn)到他的設(shè)計(jì)模式,
? ??JavaScript 沒(méi)有提供傳統(tǒng)面向?qū)ο笳Z(yǔ)言中的類式繼承浮毯，而是通過(guò)原型委托的方式來(lái)實(shí)現(xiàn)對(duì)象與對(duì)象
之間的繼承级零。JavaScript 也沒(méi)有在語(yǔ)言層面提供對(duì)抽象類和接口的支持断医。正因?yàn)榇嬖谶@些跟傳統(tǒng)面向
對(duì)象語(yǔ)言不一致的地方，我們?cè)谟迷O(shè)計(jì)模式編寫代碼的時(shí)候奏纪，更要跟傳統(tǒng)面向?qū)ο笳Z(yǔ)言加以區(qū)別鉴嗤。
1.基礎(chǔ)知識(shí)
? ? ? ?編程語(yǔ)言按照數(shù)據(jù)類型大體可以分為兩類，一類是靜態(tài)類型語(yǔ)言序调，另一類是動(dòng)態(tài)類型語(yǔ)言醉锅。靜態(tài)類型語(yǔ)言在編譯時(shí)便已確定
變量的類型，而動(dòng)態(tài)類型語(yǔ)言的變量類型要到程序運(yùn)行的時(shí)候发绢，待變量被賦予某個(gè)值之后硬耍，才會(huì)具有某種類型垄琐。
? ? ? 在面向?qū)ο蟮拈_發(fā)模式用,我通常要了解 面向?qū)ο蟮娜筇攸c(diǎn) , 封裝、繼承经柴、多態(tài).
封裝:是將信息封裝在函數(shù)內(nèi)部 ,將信息隱藏起來(lái)(利用的閉包和函數(shù)的作用域);
繼承:是指通原型模式?prototype 來(lái)實(shí)現(xiàn) 類的繼承
多態(tài):同一操作作用于不同的對(duì)象上面狸窘，可以產(chǎn)生不同的解釋和不同的執(zhí)行結(jié)果
示例1
function Person( name ){
? ?this.name = name;
};
Person.prototype.getName = function(){
? ?return this.name;
};
console.log( a.name ); // 輸出:sven
console.log( a.getName() ); //輸出:sven
console.log( Object.getPrototypeOf( a ) === Person.prototype );// 輸出:true
2. ES6新增變量聲明方式和類定義
在es6 中提供了 private、public坯认、protected 等關(guān)鍵字來(lái)提供不同的訪問(wèn)權(quán)限.另外還有const來(lái)定義常量
public? 公開(public)方法 翻擒、private?私有(private)變量、protected 只有在派生類中才能訪問(wèn)
const? 定義常量 一但確定 就不能在改變.
?ECMAScript 6 中提供的 let 定義臨時(shí)變量鹃操，
?ECMAScript 6 帶來(lái)了新的 Class 語(yǔ)法韭寸。
示例如下:
class Animal {
????constructor(name) {
????this.name = name;
????}
????getName() {
????????return this.name;
????}
}
3. this 關(guān)鍵字
????在 JavaScript 編程中，this 關(guān)鍵字總是讓初學(xué)者感到迷惑荆隘，F(xiàn)unction.prototype.call 和Function.prototype.apply?
這兩個(gè)方法也有著廣泛的運(yùn)用恩伺。
1、 指向Windows?
2.椰拒、指向構(gòu)造函數(shù)或者是當(dāng)前實(shí)例
3晶渠、 指向函數(shù)體
4、 指向object
基本上包含來(lái)80%的this指向問(wèn)題 ,當(dāng)然也有this指針丟失的這種情況
示例如下
var obj = {
myName: 'sven',
getName: function(){
????????return this.myName;
????????}
};
console.log( obj.getName() );// 輸出: 'sven' , 此時(shí)的 this 指向 obj 對(duì)象
var getName2 = obj.getName;
console.log( getName2() );// 輸出:undefined,t his 是指向全局 window
4.call 和 apply
其實(shí)大家都知道call 和 apply 的作用是一樣的,只是傳入的參數(shù)不同.
示例如下:
var func = function( a, b, c ){
? ?alert ( [ a, b, c ] ); //輸出 [ 1, 2, 3 ]
};
func.apply( null, [ 1, 2, 3 ] );
????????apply 接受兩個(gè)參數(shù)燃观，第一個(gè)參數(shù)指定了函數(shù)體內(nèi) this 對(duì)象的指向褒脯，第二個(gè)參數(shù)為一個(gè)帶下
標(biāo)的集合，這個(gè)集合可以為數(shù)組缆毁，也可以為類數(shù)組番川，apply 方法把這個(gè)集合中的元素作為參數(shù)傳
遞給被調(diào)用的函數(shù):
var func = function( a, b, c ){
????????alert ( [ a, b, c ] ); //輸出 [ 1, 2, 3 ]
};
func.call( null, 1, 2, 3 );
????????call 傳入的參數(shù)數(shù)量不固定，跟 apply 相同的是脊框，第一個(gè)參數(shù)也是代表函數(shù)體內(nèi)的 this 指向颁督，
從第二個(gè)參數(shù)開始往后，每個(gè)參數(shù)被依次傳入函數(shù):
5.閉包
閉包也就是回掉函數(shù):請(qǐng)點(diǎn)擊查看這篇文章;
下一篇文章:單例模式
