模拟jquery底层链式编程
2016-07-28 11:25
507 查看
//特点1:快级作用域,程序启动自动执行
//内部的成员变量,外部无法访问(除了var)
//简单的函数链式调用
function Dog(){
this.run=function(){
alert("跑");
return this;
};
this.eat=function(){
alert("吃");
return this;
};
this.sleep=function(){
alert("睡");
return this;
}
};
var p1=new Dog();
p1.run().eat().sleep();
//内部的成员变量,外部无法访问(除了var)
//简单的函数链式调用
function Dog(){
this.run=function(){
alert("跑");
return this;
};
this.eat=function(){
alert("吃");
return this;
};
this.sleep=function(){
alert("睡");
return this;
}
};
var p1=new Dog();
p1.run().eat().sleep();
(function(window,undefined){ //$最常用的对象返回给外界,大型程序开发,一般使用'__'作为私有对象(规范) function _$(arguments){ //实现代码 }; //在function上扩展一个可以实现链式编程的方法 Function.prototype.method=function(metName,fn){ this.prototype[metName]=fn; return this; //链式编程关键 } //在_$原型对象上加一些公共方法 _$.prototype={ const:_$, addEvent:function(){ alert(11); return this; //链式编程关键 }, setStyle:function(){ alert(22); return this; //链式编程关键 } } //window上先注册一个全局变量,与外界产生关系 window.$=_$; //写一个准备方法 _$.onReady=function(fn){ //1.实例化出来_$对象,真正注册到window上 window.$=function(){ return new _$(arguments); } //2.执行传进入的代码 fn(); //3.实现链式编程 _$.method('addEvent',function(){}).method('setStyle',function(){}); } })(window); //程序的入口 /* $(function(){ //jquery代码 })*/ $.onReady(function(){ $("dd").addEvent().setStyle(); })
相关文章推荐
- jquery实现textarea输入内容换行和空格提交后有效果
- $.ready()事件的实现机制
- Jquery选择器总结
- Jquery blokckUI 快速入门
- 使用jQuery.form插件,实现完美的表单异步提交
- jQuery选择器总结
- jquery中使用serialize() 序列化表单时 中文乱码问题
- 通过JQUERY获取SELECT OPTION中选中的值
- jQuery源码研究学习笔记(二)
- jquery实用技巧之输入框提示语句
- jQuery stop()用法实例详解
- jquery按回车键实现表单提交代码
- 详细解读Jquery各Ajax函数:$.get(),$.post(),$.ajax(),$.getJSON()
- 使用jquery的change事件操作<select>的事件处理
- jQuery插件Validation快速完成表单验证的方式
- jQuery stop()用法
- jQuery制作网页版选项卡
- zepto与jquery的区别及zepto的不同使用8条小结
- jQuery函数attr()和prop()的区别
- jquery轮播的实现方式 附完整实例