Javascript基于OOP实实现探测器功能代码实例


Posted in Javascript onAugust 26, 2020

代码如下

<script>
/*所有探测器都有探测的方法和分析的方法,分析当前的浏览器环境,不管是浏览器还是nodejs*/
/*container容器探测器*/
/*link链接探测器*/

/*外层用一个立即执行的匿名函数包裹住,防止一些函数声明或者变量泄露到外面*/

!function(global){
  function DetectorBase(configs){//不让外部通过直接调用方式调用,必须使用new,不使用new就会报错
    /*使用new的话,this就是最后要返回的对象,this instanceof DetectorBase应该返回true,不是的话说明没有直接通过new调用*/
    if(!this instanceof DetectorBase){/**/
      throw new Error('Do not invoke without new.');
    }
    this.configs=configs;/*所有的探测器都会有config属性*/
    this.analyze();/*所有的探测器初始化的时候都需要解析一下数据*/

  }

  DetectorBase.prototype.detect=function(){/*代表一个抽象的探测方法,基类不是具体的一个探测器所以实现没有意义,用来说明需要实现这样一个方法*/
    throw new Error('Not implemented');
  }

  DetectorBase.prototype.analyze=function(){
    console.log('analyzing...');
    this.data="###data###";
  }

  /***具体实例***/
  function LinkDetector(links){/*链接探测器,同理必须通过new来构造*/
    DetectorBase.apply(this,arguments);
    if(!this instanceof LinkDetector){
      throw new Error('Do not invoke without new.');
    }
    this.links=links;

  }

  function ContainerDetector(containers){
    DetectorBase.apply(this,arguments);
    if(!this instanceof ContainerDetector){
      throw new Error('Do not invoke without new.');
    }
    this.containers=containers;
  }
  //inherit first
  /*LinkDetector和ContainerDetector都可能挂载一些自己的方法
  需要注意,一定要先实现原型链的继承,再去扩展。
  因为继承的时候要改写LinkDetector的prototype属性*/
  inherit(LinkDetector,DetectorBase);
  inherit(ContainerDetector,DetectorBase);

  //expand later
  LinkDetector.prototype.detect=function(){
    console.log('Loading data:'+this.data);
    console.log('Link detection started.');
    console.log('Scaning links:'+this.links);
  }

  ContainerDetector.prototype.detect=function(){
    console.log('Loading data:'+this.data);
    console.log('Container detection started.');
    console.log('Scaning containers:'+this.containers);
  }

  //prevent from being altered
  /*不希望监控程序被改写,不可删,不可扩展,不可写*/
  Object.freeze(DetectorBase);
  Object.freeze(DetectorBase.prototype);
  Object.freeze(LinkDetector);
  Object.freeze(LinkDetector.prototype);
  Object.freeze(ContainerDetector);
  Object.freeze(ContainerDetector.prototype);



  //export to global object
  /*通过defineProperties一次性把3个类暴露在外面,同时保护它们不可被枚举,不可被删除和改写*/
  Object.defineProperties(global,{
    LinkDetector:{value:LinkDetector},
    ContainerDetector:{value:ContainerDetector},
    DetectorBase:{value:DetectorBase}
  });


  function inherit(subClass,superClass){//
    subClass.prototype=Object.create(superClass.prototype);
    subClass.prototype.constructor=subClass;
  }

}(this);

var cd=new ContainerDetector('#abc #def #ghi');
var ld=new LinkDetector('http://www.taobao.com http://www.tmall.com http://www.baidu.com');
cd.detect();
ld.detect();

</script>

运行结果

Javascript基于OOP实实现探测器功能代码实例

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript数组组合成字符串的脚本
Jan 06 Javascript
prototype Element学习笔记(Element篇三)
Oct 26 Javascript
用 Javascript 验证表单(form)中的单选(radio)值
Sep 08 Javascript
jquery 列表双向选择器之改进版
Aug 09 Javascript
jquery序列化表单以及回调函数的使用示例
Jul 02 Javascript
jQuery根据表单name获取值的方法
May 24 Javascript
详解webpack-dev-server的简单使用
Apr 02 Javascript
详解Angular6 热加载配置方案
Aug 18 Javascript
微信开发之企业付款到银行卡接口开发的示例代码
Sep 18 Javascript
vue-router实现嵌套路由的讲解
Jan 19 Javascript
150行Node.js实现的dns代理工具
Aug 02 Javascript
vue实现数字动态翻牌的效果(开箱即用)
Dec 08 Javascript
Javascript如何实现扩充基本类型
Aug 26 #Javascript
Javascript var变量删除原理及实现
Aug 26 #Javascript
js实现车辆管理系统
Aug 26 #Javascript
js实现飞机大战小游戏
Aug 26 #Javascript
JS面向对象实现飞机大战
Aug 26 #Javascript
JavaScript Image对象实现原理实例解析
Aug 26 #Javascript
js实现飞机大战游戏
Aug 26 #Javascript
You might like
深入PHP购物车模块功能分析(函数讲解,附源码)
2013/06/25 PHP
php查看当前Session的ID实例
2015/03/16 PHP
php中使用GD库做验证码
2016/03/31 PHP
PHP实现求连续子数组最大和问题2种解决方法
2017/12/26 PHP
PHP mongodb操作类定义与用法示例【适合mongodb2.x和mongodb3.x】
2018/06/16 PHP
基于Jquery插件开发之图片放大镜效果(仿淘宝)
2011/11/19 Javascript
使用jQuery实现验证上传图片的格式与大小
2014/12/03 Javascript
jQuery事件绑定on()、bind()与delegate() 方法详解
2015/06/03 Javascript
配置Grunt的Task时通配符支持和动态生成文件名问题
2015/09/06 Javascript
自定义require函数让浏览器按需加载Js文件
2016/11/24 Javascript
微信小程序 闭包写法详细介绍
2016/12/14 Javascript
微信小程序 共用变量值的实现
2017/07/12 Javascript
微信小程序中实现手指缩放图片的示例代码
2018/03/13 Javascript
Angular网络请求的封装方法
2018/05/22 Javascript
mpvue中使用flyjs全局拦截的实现代码
2018/09/13 Javascript
Vue CLI3创建项目部署到Tomcat 使用ngrok映射到外网
2019/05/16 Javascript
JS 获取文件后缀,判断文件类型(比如是否为图片格式)
2020/05/09 Javascript
Nuxt默认模板、默认布局和自定义错误页面的实现
2020/05/11 Javascript
跟老齐学Python之从if开始语句的征程
2014/09/14 Python
Python实现获取域名所用服务器的真实IP
2015/10/25 Python
Windows下为Python安装Matplotlib模块
2015/11/06 Python
使用python实现rsa算法代码
2016/02/17 Python
Python 中字符串拼接的多种方法
2018/07/30 Python
对python判断是否回文数的实例详解
2019/02/08 Python
HTML5自定义视频播放器源码
2020/01/06 HTML / CSS
英国女士家居服网站:hush
2017/08/09 全球购物
BIBLOO波兰:捷克的一家在线服装店
2018/03/09 全球购物
你所知道的集合类都有哪些?主要方法?
2012/12/31 面试题
俄语翻译实习生的自我评价分享
2013/11/06 职场文书
硕士研究生自我鉴定
2013/11/08 职场文书
优秀的自荐信要注意哪些
2014/01/03 职场文书
毕业典礼主持词大全
2014/03/26 职场文书
班级光棍节联谊会策划书
2014/10/10 职场文书
入党积极分子党支部意见
2015/06/02 职场文书
基于tensorflow权重文件的解读
2021/05/26 Python
DE1107机评
2022/04/05 无线电