关于js的函数调用的问题

Question

我想问怎么让一个元素对象可以调用我自己写的方法？像这样：$(".box").addEventListener() ，是怎么实现的？

Answer 1

这些是jQuery的扩展，又分为两种模式

模式一：$.extend静态扩展方法，或者叫jQuery类方法（无需使用对象调用，自己执行）

示例：

    $.extend({        add: function(a, b) {            console.log(a + b);
        }
    });    // 调用
    $.add(3, 5);

下面这个用法与上面的等价

 $.add = function(a, b) {        console.log(a + b);
    };    // 调用
    $.add(3, 5);

同时它也可以用于深拷贝合并对象属性

    var mine = $.extend(true, {}, {
        name: "小明",
        location: { //二级嵌套对象
            city: "上海",
            county: "中国"
        }
    }, {
        age: "18",
        location: {//二级嵌套对象
            code: "12345",
            county: "美国"
        }
    });       console.log(mine);

---

模式二：$.fn.extend给jQuery对象添加方法，提供给其他对象（比如某个元素）调用。
fn是prototype的简写

示例：

   $.fn.extend({        check: function() {            return this.each(function() {                this.checked = true;
            });
        }
    });    //调用
    $('input[name="xxx"]').check();

下面的写法也与上面的等价

   $.fn.check = function() {        return this.each(function() {            this.checked = true;
        });
    };     //调用
    $('input[name="xxx"]').check();