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>
复制代码

 





本文转自 sshpp 51CTO博客,原文链接:http://blog.51cto.com/12902932/1926155,如需转载请自行联系原作者
相关文章
|
5月前
|
前端开发 JavaScript Java
【Java进阶】JavaScript电灯开关实例:从理论到实践
这个例子展示了JavaScript的基本功能,包括操作HTML元素,监听事件,以及改变元素的样式。通过学习和理解这个例子,你可以了解到JavaScript在网页中的应用,以及如何使用JavaScript来创建交互式的网页。
96 13
|
数据可视化 JavaScript 架构师
D3.js实战:数据可视化高级技巧实例应用
本文介绍了D3.js入门,包括创建HTML文件引入库、绘制简单线图、柱状图和饼图。示例展示了数据绑定、交互性和动画效果,如柱状图的悬停效果和线图的数据平滑过渡。此外,还提及力导向图和地图可视化的实现,以及使用Enter, Update, Exit模式进行动态更新。最后提到了复杂图表和高级技巧,如使用组件库、动画、交互性和性能优化。
446 0
|
11月前
|
JavaScript 前端开发 Java
JavaScript中的面向对象编程(OOP) - 终极指南
本文介绍了 JavaScript 的面向对象编程 (OOP) 概念,包括继承、多态、封装和抽象等关键要素,并通过代码示例帮助开发者理解和应用 OOP 思维。
182 5
|
11月前
|
前端开发 JavaScript
基础 JavaScript 实例
基础 JavaScript 实例
54 1
|
JavaScript
js之选项卡制作实例
js之选项卡制作实例
69 0
js中如何使用工厂方式和构造函数创建对象,web开发项目实例
js中如何使用工厂方式和构造函数创建对象,web开发项目实例
|
Web App开发 JavaScript 前端开发
解决Vue.js Devtools未检测到Vue实例的问题
解决Vue.js Devtools未检测到Vue实例的问题
1187 1
|
设计模式 缓存 JavaScript
js设计模式实例
【7月更文挑战第2天】JavaScript设计模式包含工厂、单例、建造者、抽象工厂和代理模式等,它们是最佳实践和可重用模板,解决创建、职责分配和通信等问题。例如,工厂模式封装对象创建,单例确保全局唯一实例,建造者模式用于复杂对象构建,抽象工厂创建相关对象集合,而代理模式则控制对象访问。这些模式提升代码质量、可读性和灵活性,是高效开发的关键。
89 0
|
前端开发 JavaScript 容器
程序技术好文:纯原生javascript下拉框表单美化实例教程
程序技术好文:纯原生javascript下拉框表单美化实例教程
236 0