何泽弘

何泽弘的博客

这是一个中二半吊子码农分享学习经验和生活的网站...

分类:

编程笔记

共有 16 个话题
vue-strap

vue-strap


基于 Vue.js 的 Bootstrap 组件

该仓库包含一系列基于 Bootstrap 标记和 CSS 的本地 Vue.js 组件。所以不需要 jQuery 和 Bootstrap 的 JavaScript 文件,唯一需要依赖的是:

  1. Vue.js (要求版本为 ^0.12,基于 0.12.10 版本做的测试)
  2. Bootstrap CSS (需要版本为 3.x.x, 基于 3.3.5 版本做的测试)。 VueStrap 不依赖某个非常精确的 Bootstrap 版本。

使用Cookie兼容LocalStorage


Storage 对象最近才加入标准,因此可能并不被所有浏览器支持。

你可以通过在你的scripts代码前加入以下两段代码中某一段来规避在不能原生支持的执行环境使用localStorage对象的问题。

注意:该算法借助于cookies,数据量的最大值是通过cookies来严格限制的。

实现javascript中的队列结构


核心方法:

var Queue = (function () {
    function Queue (worker, concurrency) {
        this.tasks = [];
        this.worker = typeof worker === 'function' ? worker : null;
        this.concurrencyMax = typeof concurrency === 'number' && concurrency > 0 ? concurrency : 1;
        this.concurrencyCut = 0;
        this.drain = null;
    }
    Queue.prototype._start = function () {
        if (this.tasks.length === 0 || this.concurrencyCut >= this.concurrencyMax) {
            return ;
        }
        var taskData = this.tasks.shift();
        this.concurrencyCut += 1;
        this.worker && this.worker(taskData.task, this._next.bind({ taskData: taskData, self: this }));
    };
    Queue.prototype._next = function () {
        var self = this.self;
        var taskData = this.taskData;
        taskData.callback && taskData.callback.apply(this, arguments);
        self.concurrencyCut -= 1;
        if ( self.tasks.length > 0 ) { return self._start(); }
        if ( self.concurrencyCut === 0 ) { return self.drain && self.drain(); }
    };
    Queue.prototype.push = function (task, callback) {
        this.tasks.push({ task: task, callback: callback });
        if ( this.concurrencyCut < this.concurrencyMax ) { return this._start(); }
    };
    return Queue;
})();