上次参加阿里的实习面试的时候 面试官和我提到假如给你一定的时间来证明你的JavaScript水平 你会做什么
我毫不犹豫的就回答 开发一套JavaScript框架 在这个过程中不仅可以熟练使用JavaScript而且还学会解决一些浏览器兼容问题等
这更有利于我们对JavaScript的理解
下面就开始第一步吧 我要先把jQuery重写一遍 重在理解框架实现原理
//自调函数把window这个全局变量传入 (function(){ //把jQuery和$另存一份 var _jQuery = window.jQuery,_$ = window.$; //定义jQuery对象 var jQuery = window.jQuery = window.$ = function(){ //返回的其实是function init()的实例 return new jQuery.fn.init(); } jQuery.fn = jQuery.prototype = { //这个方法用来构造jQuery对象 init:function(){ return this; }, //定义一些其他的属性 length: 0, jquery:"1.0.0", author:"BaiQiang", size:function(){ return this.length; } }; //使用jQuery的原型覆盖init的原型 这样就自动把jQuery.prototype的方法可以在init里面使用 jQuery.fn.init.prototype=jQuery.fn; })(window);
测试一下 像jQuery一样调用属性
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script type="text/javascript" src="jquery.js"></script> </head> <body> <script type="text/javascript"> console.log($().jquery); console.log($().author); </script> </body> </html>
输出信息：