1. 程式人生 > >閱讀《js是設計模式》第一章心得

閱讀《js是設計模式》第一章心得

s函數 姓名 如果 FN height 代碼 IV 函數式 pre

1、明白自己

明白了自己寫的代碼為什麽難懂且臃腫,不方便閱讀且效率低。最主要的是為什麽整套流程下來只能我一個人寫,因為這樣的代碼根本沒有團隊力,協同能力差。對js理解的不過透徹。

2、真正的學會對象與類的區別

類 :對一群具有相同特征的對象的集合的描述;
對象:真實存在的對象個體;

比如人類,指的是一個範圍; 對象:比如某個人,指的是這個範圍中具體的對象。

Javascript中的function作為構造函數時,就是一個類,搭配上new操作符,可以返回一個對象。
當然,要生成一個對象,也可以用字面量的形式,例如var obj = {x: 1, y: function(){} };
類可以理解為一個模板,而對象就是根據這個模板造出來的具體實例。

3、在函數的原型中添加統一添加方法的功能方法

一般不把功能函數封裝在原型裏面,因為這樣會汙染全局,造成不必要的開銷。所以我會抽象出一個統一的添加方法的功能方法。

例如:

Function.prototype.addMethod=function(name,fn){

  this[name]=fn;

}

如果想添加郵箱驗證和姓名驗證方法可以這樣做

var methods=function(){};

或者

var methods = new Function();

methods.addMethod(‘checkName‘,function(){

  //驗證姓名

});

methods.addMethod(‘checkEmail‘,function(){

  //驗證郵箱

});

methods.checkName();

methods.checkEmail();

4、函數鏈式添加方法

在原型中添加功能的方法中添加返回this語句,這樣每次添加完一個方法後都會返回methods函數。

Function.prototype.addMethod= function(name,fn){

  this[name]=fn;

  return this;

}

也可以為每個添加的方法返回this。

var methods = function(){};

methods.addMethod(‘checkName‘,function(){

  //驗證姓名

  return this;

}).addMethod(‘checkEmail‘,function(){

  //驗證郵箱

  return this;

});

methods.checkName().checkEmail();

這是用函數式的調用方式

5、類式的調用方式(鏈式添加)

Function.prototype.addMethod = function(name,fn){

  this.prototype[name]=fn;

  return this;

}

var Methods = function(){};

Methods.addMethod(‘checkName‘,function(){

  //驗證姓名

  return this

}).addMethod(‘checkEmail‘,function(){

  //驗證郵箱

  return this

});

但是這時候我們就不能直接使用了,要通過new關鍵字來創建新的對象了。

var m = new Methods();

m.checkEmail().checkEmail()

兩個疑惑:1、函數添加方法的功能方法語句為什麽是this[name],為什麽是這樣寫的?

     2、類式添加方法的功能方法語句為什麽是this.prototype[name]?這樣的話方法不都添加到了原型中去了嗎?這樣不會汙染全局嗎?

閱讀《js是設計模式》第一章心得