zoukankan      html  css  js  c++  java
  • JavaScript设计模式学习之路——面向对象的思想

    今天,我拿到了张容铭写的这本《JavaScript设计模式》这本书,开始了关于JavaScript更深一点的学习。

    看到这本书开始的时候,虽然之前通过看书、一些比较好的视频的讲解,对JavaScript有了基础的认识,但是,在看到书的内容的时候,我内心还是有一种自己差的十万八千里的感觉,之前的代码写法不行,使用全局变量、全局函数,只是面向过程的编程的方法,扩展性、可重用性太低。以后我将每天更新博客,将自己所学每一种设计模式都po出来,我要自己看到自己的进步!!加油!

    今天的内容是————面向对象的思想

    主要感想:应该摈弃之前面向过程的思想和代码写法,尽量减少全局变量、全局函数的使用。结合我今天看的另外一本《高性能JavaScript》,针对js性能方面来说,全局变量以及DOM中的变量所在的作用域链的位置均在局部变量的所在位置的下方,也就是搜索顺序,先找的是局部变量,后来找的才是全局变量。因此,为了性能的需求、团队的合作和代码的重用性,都应该采用面向对象的思想。

    案例:检查姓名、邮箱、密码是否符合规范,详细的检查函数省略。

    方法一:

     1     //将所要添加的方法包装与object中
     2     //方法1.使用json式的方法封装函数,缺点:没有使用new,扩展性不强
     3     var CheckObject = {
     4         checkName : function(){
     5             //检查姓名
     6             alert("checkName");
     7             return this;//为链式调用
     8         },
     9         checkEmail : function(){
    10             //检查Email是否合法
    11             alert("checkEmail");
    12             return this;//为链式调用
    13         },
    14         checkPassword : function(){
    15             //检查密码
    16             alert("checkPassword");
    17             return this;//为链式调用
    18         }
    19     };
    20 
    21     方法一调用
    22     CheckObject.checkName().checkEmail().checkPassword();

    方法二:

    我觉得较为好的一种方法,结合我自己类式调用的习惯,在Function的prototype中添加方法,避免对原生对象Function的污染,创建一个统一的方法为其添加方法,在其添加方法时,为使用类式调用,使其添加的方法在其原型中。

     1 Function.prototype.addMethods = function(name,fn){
     2         this.prototype[name] = fn;
     3         return this;
     4     }
     5     var Methods = function(){};
     6     // var Methods = new Function();
     7     Methods.addMethods('checkName',function(){
     8         //检查姓名
     9         alert("checkName");
    10 
    11     }).addMethods('checkEmail',function(){
    12         //检查Email是否合法
    13         alert("checkEmail");
    14 
    15     }).addMethods('checkPassword',function(){
    16         //检查密码
    17         alert("checkPassword");
    18 
    19     });
    20 
    21     //方法二调用时
    22     var m = new Methods();
    23     m.checkName();

    希望大家有更好的见解随时reply,如果有误,请不吝赐教!

  • 相关阅读:
    盘点三个网络赚零花钱的小项目,傻瓜式操作
    如何运营一个女性社区?
    女性社区TOP10
    微商怎么做月入过万?新手必看
    电脑设置 账号改名,远程无法复制
    sql server 安装
    C# HTTP
    电脑命令 重启电脑
    使用老毛桃备份 ,还原系统
    c# 截取字符串
  • 原文地址:https://www.cnblogs.com/tiffanybear/p/5689394.html
Copyright © 2011-2022 走看看