underscore系列

  • 前言

    《JavaScript 专题系列》 中,我们写了很多的功能函数,比如防抖、节流、去重、类型判断、扁平数组、深浅拷贝、查找数组元素、通用遍历、柯里化、函数组合、函数记忆、乱序等,可以我们该如何组织这些函数,形成自己的一个工具函数库呢?这个时候,我们就要借鉴 underscore 是怎么做的了。

    自己实现

    如果是我们自己去组织这些函数,我们该怎么做呢?我想我会这样做:

    (function(){
        var root = this;
    
        var _ = {};
    
        root._ = _;
    
        // 在这里添加自己的方法
        _.reverse = function
  • 前言

    本文接着上篇《underscore 系列之如何写自己的 underscore》,阅读本篇前,希望你已经阅读了上一篇。

    jQuery

    我们都知道 jQuery 可以链式调用,比如:

    $("div").eq(0).css("width", "200px").show();

    我们写个简单的 demo 模拟链式调用:

    function JQuery(selector) {
        this.elements = [];
        var nodeLists = document.getElementsByTagName(selector);
        for (var i = 0; i < n
  • 前言

    仅看 cb 和 optimizeCb 两个函数的名字,你可能想不到这是用来做什么的,尽管你可能想到 cb 是 callback 的缩写。

    如果直接讲解源码,你可能想不明白为什么要这么写,所以我们从 _.map 函数开始讲起。

    _.map

    _.map 类似于 Array.prototype.map,但更加健壮和完善。我们看下 _.map 的源码:

    // 简化过,这里仅假设 obj 是数组
    _.map = function (obj, iteratee, context) {
        iteratee = cb(iteratee, context);
    
        var length = ob
  • partial

    《 JavaScript 专题之偏函数》中,我们写了一个 partial 函数,用来固定函数的部分参数,实现代码如下:

    // 这是文章中的第一版
    function partial(fn) {
        var args = [].slice.call(arguments, 1);
        return function() {
            var newArgs = args.concat([].slice.call(arguments));
            return fn.apply(this, newArgs);
        };
    };

    rest parameter

    E

  • 防冲突

    underscore 使用 _ 作为函数的挂载对象,如果页面中已经存在了 _ 对象,underscore 就会覆盖该对象,举个例子:

    var _ = {value: 1 }
    
    // 引入 underscore 后
    console.log(_.value); // undefined

    所以 underscore 提供了 noConflict 功能,可以放弃 underscore 的控制变量 _,返回 underscore 对象的引用。

    var _ = {value: 1 }
    
    // 引入 underscore 后
    
    // 放弃 "_",使用 "$"
    var $ = _.noConflic