阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

      教程列表

      抓包专区
      测试专区

      jQuery 的属性拷贝 (extend) 的实现原理是什么,如何实现深拷贝?

       jQuery.extend = jQuery.fn.extend = function() {
           // 定义默认参数和变量
           // 对象分为扩展对象和被扩展的对象
           //options 代表扩展的对象中的方法
           //name 代表扩展对象的方法名
           //i 为扩展对象参数起始值
           //deep 默认为浅复制
           var options, name, src, copy, copyIsArray, clone, target = arguments[0] || {},
           i = 1,
           length = arguments.length,
           deep = false;
      
           // 当第一个参数为布尔类型是,次参数定义是否为深拷贝
           // 对接下来的参数进行处理
           if (typeof target === "boolean") {
               deep = target;
               target = arguments[1] || {};
               // 当定义是否深拷贝时,参数往后移动一位
               i = 2;
           }
      
           // 如果要扩展的不是对象或者函数,则定义要扩展的对象为空
           if (typeof target !== "object" && !jQuery.isFunction(target)) {
               target = {};
           }
      
           // 当只含有一个参数时,被扩展的对象是 jQuery 或 jQuery.fn
           if (length === i) {
               target = this; --i;
           }
      
           // 对从 i 开始的多个参数进行遍历
           for (; i < length; i++) {
               // 只处理有定义的值
               if ((options = arguments[i]) != null) {
                   // 展开扩展对象
                   for (name in options) {
                       src = target[name];
                       copy = options[name];
                       // 防止循环引用
                       if (target === copy) {
                           continue;
                       }
                       // 递归处理深拷贝
                       if (deep && copy && ; (jQuery.isPlainObject(copy) || (copyIsArray = jQuery.isArray(copy)))) {
                           if (copyIsArray) {
                               copyIsArray = false;
                               clone = src && jQuery.isArray(src) ? src: [];
                           } else {
                               clone = src && jQuery.isPlainObject(src) ? src: {};
                           }
                           target[name] = jQuery.extend(deep, clone, copy);
                           // 不处理未定义值
                       } else if (copy !== undefined) {
                           // 给 target 增加属性或方法
                           target[name] = copy;
                       }
                   }
               }
           }
      
           // 返回
           return target;
       };
      

      更多面试题

      如果你想了解更多的前端面试题,请点击下面进行选择,这里基本包涵了市场上的所有前端方面的面试题,让你面试更加顺利。

      这些题库还在更新中,如果你有不错的面试题库欢迎分享给我,我整理后放上来;人人为我,我为人人,互帮互助,共同提高,祝大家都拿到心仪的Offer!

      目录
      本文目录
      目录