JavaScript中的原型应用

JavaScript中的原型应用

JQuery中的原型应用

// 使用
var $div = $("div")

// JQuery源码中的实现
(function(window){
    var jquery = function(seletor) {
    	// 构造函数
        return new jquery.fn.init(seletor);
    };
	
	// 定义原型方法
    jquery.fn = jquery.prototype = {
        css: function() {
            console.log('css');
        }
    }

    var init = jquery.fn.init = function(seletor) {
        var slice = Array.prototype.slice;
        var dom = slice.call(document.querySelectorAll(seletor));
        var i, len = dom ? dom.length : 0;
        for(i = 0;i < len; i ++) {
            this[i] = dom[i];
        }
        this.length = len;
        this.seletor = seletor || '';
    }

    init.prototype = jquery.fn

    window.$ = jquery;
})(window)

JQuery中实现插件

在$.fn(原型中)添加方法即可实现插件

$.fn.getNodeName = function() {
	return this[0].nodeName;
}

你可能感兴趣的:(深入JavaScript原理)