• (177-240)


    extend方法

    jQuery.extend = jQuery.fn.extend = function() {
        var options, name, src, copy, copyIsArray, clone,
            target = arguments[0] || {},
            i = 1,
            length = arguments.length,
            deep = false;
    
        // Handle a deep copy situation
        if ( typeof target === "boolean" ) {
            deep = target;
    
            // skip the boolean and the target
            target = arguments[ i ] || {};
            i++;
        }
    
        // Handle case when target is a string or something (possible in deep copy)
        if ( typeof target !== "object" && !jQuery.isFunction(target) ) {
            target = {};
        }
    
        // extend jQuery itself if only one argument is passed
        if ( i === length ) {
            target = this;
            i--;
        }
    
        for ( ; i < length; i++ ) {
            // Only deal with non-null/undefined values
            if ( (options = arguments[ i ]) != null ) {
                // Extend the base object
                for ( name in options ) {
                    src = target[ name ];
                    copy = options[ name ];
    
                    // Prevent never-ending loop
                    if ( target === copy ) {
                        continue;
                    }
    
                    // Recurse if we're merging plain objects or arrays
                    if ( deep && copy && ( jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)) ) ) {
                        if ( copyIsArray ) {
                            copyIsArray = false;
                            clone = src && jQuery.isArray(src) ? src : [];
                            console.log(clone)
    
                        } else {
                            clone = src && jQuery.isPlainObject(src) ? src : {};
                        }
    
                        // Never move original objects, clone them
                        target[ name ] = jQuery.extend( deep, clone, copy );
    
                    // Don't bring in undefined values
                    } else if ( copy !== undefined ) {
                        target[ name ] = copy;
                    }
                }
            }
        }
    
        // Return the modified object
        return target;
    };
    
    //合并对象到第一个对象
    console.log(jQuery.extend({b:2},{d:3},{b:3,c:1}))
    //合并数组
    console.log(jQuery.extend([1,[1,3]],[1,[1,2]]))
    //递归合并
    console.log(jQuery.extend(true,{a:1,b:{c:1}},{b:[2]},{c:1}))
    //参数为1时
    jQuery.extend({a:1})
    console.log(jQuery.a)

    extend方法的功能要求:

    ~合并多个对象到第一个对象

    ~递归合并模式

    ~参数为1个时,对this指向的对象(调用者,jQuery或者jQuery.fn)进行扩展

    ~合并数组

    实际功能要求很简单,就是遍历参数合并对象到首对象。其它作者考虑的问题有,对象和数字同时出现,参数为字符串,等bug兼容处理。

    不只是针对jQuery,对任何源码,开发团队一般会尽可能解决多的情况。都知道,先有问题才有解决办法。如果有些问题我们不知道怎么回事,我们读起解决办法也就莫名其妙。

    这个并不需要太纠结,在今后,当你碰到相同的问题时,你会自然写出相同的代码。

    下面是只进行递归的扩展函数,原理是判断目标属性是不是对象,是则递归,不是则直接合并。

    function extend(){
        var target = arguments[0];
        var options = arguments[i];
        for( var i = 1;i<arguments.length;i++){
            for(var name in (options = arguments[i])){
                var src = target[name]
                var copy = options[name]
                //如果是对象,则继续递归
                if(jQuery.isPlainObject(copy)){
                    var clone = jQuery.isPlainObject(src) ? src : {};
                    extend(clone,copy)
                }else{
                    //不是则合并
                    target[name] = arguments[i][name];
                }
            }
        }
        return target;
    }
    console.log(extend({a:{b:1}},{a:{c:2}}))
  • 相关阅读:
    python 全栈开发大纲
    2018/6/22 晚
    python——小知识
    变量与常量
    1.2数据结构-抽象数据类型的表示和实现
    1.1数据结构-基本概念和术语
    人机交互实践04-定位作业
    人机交互实践04-图像浮动至右边
    人机交互实践03-课堂作业2
    人机交互实践03-链接到的网页
  • 原文地址:https://www.cnblogs.com/winderby/p/4152996.html
Copyright © 2020-2023  润新知