【JavaScript】JavaScript模拟Class

beauty("$Class",["$underscore"],function(_){

   var Class = function () {
        var length = arguments.length;
        var option = arguments[length - 1];

        option.init = option.init || function () {
        };

        // 如果参数中有要继承的父类
        if (length === 2) {
            /**
             * @ignore
             */
            var superClass = arguments[0].extend;

            /**
             * @ignore
             */
            var tempClass = function () {
            };
            tempClass.prototype = superClass.prototype;

            /**
             * @ignore
             */
            var subClass = function () {
                this.init.apply(this, arguments);
            };

            // 加一个对父类原型引用的静态属性
            subClass.superClass = superClass.prototype;
            //subClass.superClass = superClass;
            /**
             * @ignore
             */
            subClass.callSuper = function (context, func) {
                var slice = Array.prototype.slice;
                var a = slice.call(arguments, 2);
                var func = subClass.superClass[func];
                //var func = subClass.superClass.prototype[func];
                if (func) {
                    func.apply(context, a.concat(slice.call(arguments)));
                }
            };

            // 指定原型
            subClass.prototype = new tempClass();

            // 重新指定构造函数
            subClass.prototype.constructor = subClass;

            _.extend(subClass.prototype, option);

            /**
             * @ignore
             */
            subClass.prototype.init = function () {
                // 调用父类的构造函数
                // subClass.superClass.init.apply(this, arguments);
                // 调用此类自身的构造函数
                option.init.apply(this, arguments);
            };

            return subClass;

            // 如果参数中没有父类,则单纯构建一个类
        } else {
            if (length === 1) {
                /**
                 * @ignore
                 */
                var newClass = function () {
                    // 加了return,否则init返回的对象不生效
                    return this.init.apply(this, arguments);
                };
                newClass.prototype = option;
                return newClass;
            }
        }

    };

    beauty.$superPackage("$Class",Class);

});

  

时间: 2024-10-24 16:23:10

【JavaScript】JavaScript模拟Class的相关文章

javascript 实现模拟滚动条,但不支持鼠标滚轮

模拟滚动条做项目的时候,很多时候会用到,所以就写了一个这么模拟滚动条,但是不支持滚轮事件 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <style> *{padding:0;margin:0;} .scroll{width:320px;marg

JavaScript之模拟评星打分

CSS中的cursor属性是规定要显示的光标的类型(形状). default 默认光标(通常是一个箭头) auto 默认.浏览器设置的光标. crosshair 光标呈现为十字线. pointer 光标呈现为指示链接的指针(一只手) move 此光标指示某对象可被移动. e-resize 此光标指示矩形框的边缘可被向右(东)移动. ne-resize 此光标指示矩形框的边缘可被向上及向右移动(北/东). nw-resize 此光标指示矩形框的边缘可被向上及向左移动(北/西). n-resize

javascript中模拟实现java语言中的map

//javascript中模拟实现java语言中的map 实现代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript"> //private var obj={};//空的对象容器,用于承装键值对 function Map() { //put方法 th

JavaScript中模拟实现Java的集合类Map的常用方法

JavaScript中模拟实现Java的集合类Map的常用方法 (function Map(){ var size = 0, map = {}, strundefined; function MapCache() { } MapCache.prototype.put = function (key, value){ if ( key === null || key === undefined){ throw new Error(" null or undefined is not a illeg

[Javascript] Javascript &#39;in&#39; opreator

If you want to check whether a key is inside an Object or Array, you can use 'in': Object: const obj = { name: 'GraphQL', watched: false }; console.log('name' in obj); // true console.log('title' in obj); // false Array: const characters = [ 'Harry P

[JavaScript] JavaScript 面向对象设计 (3) : 多态与界面篇

在前一篇中我们介绍了基础的 JavaScript 继承实践法,透过 Object.prototype 我们可以自由决定对象要继承自哪个对象,也可以扩充对象目前现有的属性和方法 (和 C# 的 Extension Method 有异曲同工之妙),在本篇中,我们要来介绍面向对象的另一个特性:多态 (Polymorphism). 在前一篇中我们介绍了基础的 JavaScript 继承实践法,透过 Object.prototype 我们可以自由决定对象要继承自哪个对象,也可以扩充对象目前现有的属性和方法

JavaScript动画-模拟拖拽

模拟拖拽的原理: x1等于div.offsetLeft y1等于div.offsetTop x2等于ev.clientX(ev表示event事件) y2等于ev.clientY 当我们在方块上按下鼠标的时候,x2-x1即可确定.移动鼠标之后,我们用鼠标当前的位置即x4.y4减去x2-x1.y2-y1就可以得到方块现在的位置. 效果图:点击查看 代码: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 &l

通过挟持 this 指针在 JavaScript 中模拟 private

转帖:http://ucren.com/demos/private/private.html JavaScript 是一种解释型的.基于对象的脚本语言,没有严格意义上的类,在这一点上不同于 C++.Smalltalk 或者 Java,不过作为替代,它支持构造函数(constructors),可通过执行代码创建对象:给对象分配存储,然后通过赋初始值来初始化对象属性的全部或部分.构造函数有个指向其原型对象的属性叫做 prototype,利用 prototype 可模拟出一个基本可用的“类”来. 类有

浅谈Javascript事件模拟

事件是用来描述网页中某一特定有趣时刻的,众所周知事件通常是在由用户和浏览器进行交互时触发,其实不然,通过Javascript可以在任何时间触发特定的事件,并且这些事件与浏览器创建的事件是相同的.这就意味着会有适当的事件冒泡,并且浏览器会执行分配的事件处理程序.这种能力在测试web应用程序的时候,是非常有用的,在DOM 3级规范中提供了方法来模拟特定的事件,IE9 chrome FF Opera 和 Safari都支持这样的方式,在IE8及以前的办法的IE浏览器有他自己的方式来模拟事件a)Dom

学习Javascript之模拟实现new

前言 本文1021字,阅读大约需要5分钟. 总括: 本文对new进行了一个简单介绍,然后使用一个函数模拟实现了new操作符做的事情. 参考文档:new 运算符 公众号:「前端进阶学习」,回复「666」,获取一揽子前端技术书籍 人生是没有毕业的学校. 正文 new是JS中的一个关键字,用来将构造函数实例化的一个运算符.例子: function Animal(name) { this.name = name; } Animal.prototype.sayName = function() { con