最近在读JavaScript设计模式这本书,准备搞一个系列来记录所学所想,其实主要原因是方便以后查阅。
第一章主要介绍了JS函数的不同定义与使用方法,用自己的方法去模拟类也是它的独有魅力所在。
首先,由check函数展开,如果用不同的函数去对应功能,会造成过多的全局变量定义,例如
var checkName = function () {//验证姓名} function checkName () {//验证姓名}
这两种方式都会创建全局变量checkName,一来会造成不必要的浪费,其次如果别人定义了相同的方法会覆盖原来的功能,这种相互覆盖的问题是很不容易察觉的,所以最好的解决方法就是用对象收编变量。
对象收编变量
var CheckObject = function () { return { checkName: function () { //验证姓名 }, checkEmail: function () { //验证邮箱 }, checkPassword: function () { //验证密码 }, } } var a = CheckObject(); a.checkEmail();
这样使用的时候只用使用CheckObject这个对象就可以通过返回的新对象的属性去实现不同的功能了。
但是他不是真正意义上的类的创建形式,因为创建的对象a与对象CheckObject没有任何关系。
JS的类
var CheckObject = function () { this.checkName: function () { //验证姓名 }, this.checkEmail: function () { //验证邮箱 }, this.checkPassword: function () { //验证密码 } } var a = new CheckObject(); a.checkEmail();
因为通过this定义的方法,所以每次通过new关键字创建新对象的时候,新的对象会对类的this上的属性进行复制,每个新创建的对象都会有自己的一套方法,但是这样是很耗费资源的,可以修改为:
var CheckObject = function () {}; CheckObject.prototype = { checkName: function () { //验证姓名 }, checkEmail: function () { //验证邮箱 }, checkPassword: function () { //验证密码 } } var a = new CheckObject(); a.checkEmail();
这样创建对象实例的时候,创建出来的对象所拥有的方法就都是一个了,因为它们都要依赖prototype原型依次寻找,而找到的方法都是同一个,它们都绑定在CheckObject对象类的原型上。
链式调用
var CheckObject = function () {}; CheckObject.prototype = { checkName: function () { //验证姓名 return this; }, checkEmail: function () { //验证邮箱 return this; }, checkPassword: function () { //验证密码 return this; } } var a = new CheckObject(); a.checkEmail().checkName().checkPassword();
这样就不必每次调用方法都去书写a了。
调用你老母
虽然可以增加原生类型的方法实现需求,但是,绝对不赞成直接在原生对象上直接添加方法,会造成污染,别人创建的函数也会有这个自定义方法,造成不必要开销,例如
Function.prototype.checkEmail = function () { //验证邮箱 }; var f = function () {}; f.checkEmail();
但是如果有必要可以增加抽象的方法来实现功能需求:
Function.prototype.addMethod = function (name, fn) { this.prototype[name] = fn; return this; } var Methods = function(){}; Methods.addMethod ('checkName', funciton () { //验证姓名 }).addMethod ('checkEmail', funciton () { //验证邮箱 }); var m = new Methods (); m.checkEmail();
这样通过对原生对象的扩展一个统一添加方法的功能方法,增加了自定义函数,减少了危害。