javascript OOP实例—探测器
<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 OOP特性搭建Web应用
最近,我面试了一个有五年 Web 应用程序开发经验的软件开发人员.四年半来她一直在从事 JavaScript 相关的工作,她自认为 JavaScript 技能非常好,但在不久之后我就发现实际上她对 J ...
- JavaScript教程——实例对象与 new 命令
典型的面向对象编程语言(比如 C++ 和 Java),都有“类”(class)这个概念.所谓“类”就是对象的模板,对象就是“类”的实例.但是,JavaScript 语言的对象体系,不是基于“类”的,而 ...
- JavaScript OOP 之 this指向
今天给大家分享一个JavaScript OOP中关于分辨this指向对象的小技巧,很实用呦! 我们先来看一段代码: 大家能判断出func();和obj.func();这两句的this指向吗? 首先,我 ...
- JavaScript小实例:拖拽应用(二)
经常在网站别人的网站的注册页中看到一个拖拽验证的效果,就是它的验证码刚开始不出来,而是有一个拖拽的条,你必须将这个拖拽条拖到底,验证码才出来,说了感觉跟没说一样,你还是不理解,好吧,我给个图你看看: ...
- javascript小实例,拖拽应用(一)
前面我们将了一下拖拽的基本思想,理论是有了,那实践呢,可以运用到什么地方呢?下面就给大家带来一个用拖拽思想写的一个小实例,供大家参考,大致效果看下图: 就是这样一个简单的一个拖拽条,你可以把它理解为滚 ...
- JavaScript 小实例 - 表单输入内容检测,对页面的增删改
JavaScript 小实例 - 表单输入内容检测,对页面的增删改 效果体验地址:https://xpwi.github.io/js/JavaScript01/jsForm.html 功能: 1.向页 ...
- 10种JavaScript特效实例让你的网站更吸引人
我们有三种主要的方法(从难到易):自己动手写脚本;使用类似于jQuery和mooTools的JavaScript框架(可以让编写代码变得更容易些);使用能工作于现有的JavaScript框架下的提前预 ...
- JavaScript图形实例:线段构图
在“JavaScript图形实例:四瓣花型图案”和“JavaScript图形实例:蝴蝶结图案”中,我们绘制图形时,主要采用的方法是先根据给定的曲线参数方程计算出两点坐标,然后将两点用线段连接起来,线段 ...
- JavaScript动画实例:李萨如曲线
在“JavaScript图形实例:阿基米德螺线”和“JavaScript图形实例:曲线方程”中,我们学习了利用曲线的方程绘制曲线的方法.如果想看看曲线是怎样绘制出来的,怎么办呢?编写简单的动画,就可以 ...
随机推荐
- CAD版本 注册表信息
AutoCAD2002 AutoCAD.Application.15 AutoCAD2003 AutoCAD.Application.15.1 AutoCAD2004 AutoCAD.Applic ...
- MFCWinInet学习
http://blog.csdn.net/segen_jaa/article/details/6278167 背景: 功能:服务端下载文件 服务端:用Java写Sevlet进行有效性验证 客户端:用C ...
- 一道并查集的(坑)题:关闭农场closing the farm
题目描述 in English: Farmer John and his cows are planning to leave town for a long vacation, and so FJ ...
- WebStorm 关联 TFS(转)
1.下载插件 TFS integration 2.链接TFS 服务器 3.创建工作区 4. 5.选择一个 工作环境 6.最重要的有点是在VCS里面要选择一个默认的提交方式!!!
- web@css普通布局 , 高级布局 , 布局坑
1.高级布局<文档流概念>:页面从上至下,块式标签一行一行排列,内联式一行中从左至右排列<BFC规则>:左右位置(左右margin)垂直位置(上下margin)容器内外(互不影 ...
- ansible笔记(2):清单配置详解
上一篇文章介绍了ansible的基本概念,以及相关的基础配置,我们已经知道,如果想要管理受管主机,则需要将受管主机添加到ansible的管理清单中,当安装ansible以后,会提供一个默认的管理清单, ...
- unit test
1) State vs Behaviour Verificationhttps://manas.tech/blog/2009/04/30/state-vs-behaviour-verification ...
- use Swig to create C/C++ extension for Python
SWIG is a software development tool that simplifies the task of interfacing different languages to C ...
- Light Oj 1005
题意: 从 n*n 的棋盘中放置 K 个 行和列不冲突的棋子 思路: 组合数学, 先选 k 个 行, k 个列, 就是 C(n,k) ^ 2; 然后 K 个棋子不相同, K ! 全排列 #includ ...
- 注册InstallShield
安装InstallShield 下载installshield limitededition版本,这个版本是免费的 注册 安装打开后会给一个网址要求进行注册 其中,国籍是必填项但是下拉菜单中没有内容, ...