关于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();

Answer 2

添加到jQuery对象对应的原型对象中去

Answer 3

N年前写的一个关于jQuery插件的话题。

http://asdfblog.com/ready-jqu...

Answer 4

用$.fn.extend