资讯专栏INFORMATION COLUMN

体验javascript之美-第十一课-jquery源码分析

王晗 / 443人阅读

摘要:可以直接在这里查看至于的开源就不多说了。官网一个库的官网永远是了解它最新进展和学习资料的首选网站。比如下面我们就拿举例分析下它的源码。不解释,你可以直接拿过去改吧改吧用在你自己的库里。

上节课我们说了写一个库的准备,但是这节课并不是写库为什么,有句话叫你没吃过猪肉还没看过猪走。所以我们先看看别人的库是怎么写的。在我们拥有了足够扎实的基础之后我们要做的不是闭门造车,而是去阅读一些知名的库,为什么?一个库从成百上千个库里面脱颖而出,被广大的开发者所接受使用,一定是在一些方面有很优秀的方面,比如架构,比如易用等,同时一些成熟的方法和代码可以借鉴学习,比如架构安全的代码,比如如何判断类型等等。不要闭门造成,首先是使用别人的东西,然后是阅读别人的代码体会优秀的部分,然后是优秀部分如何为我所用,到最后完全自主的创新。

1.可以借鉴的资源

1)github

Github不仅仅是你储存代码的地方,更是你学习别人开源代码的好地方,还是那你了解语言发展趋势和方向的好地方。比如你想了解如今js发展热度。
可以直接在这里查看:https://github.com/showcases/front-end-javascript-frameworks
至于var的开源就不多说了。

2)官网

一个库的官网永远是了解它最新进展和学习资料的首选网站。比如jquery.

下面我们就拿jquery举例分析下它的源码。

2.深入阅读jquery源码

​ jquery至少解决了两个问题,1兼容性2易用性,我们使用jquery 1.11.2,为什么用这个版本,因为这个版本没有太多的新技术,比如引入大量的模块,

学习一个新东西不应该增加开发者的负担,举个例子。我只想学习jquery的优秀架构,可是你用了ES6语法,那我还得学ES6,你用了太多的模块化,那我还得学模块化,你用了打包工具,我还得学grunt等。到最后想想都头大了,去你大爷的,我不学了。

你有必要为了喝杯纯牛奶而去种草么?

所以我们尽量使用稳定而在我们已经学过的技术范围之内的版本。

获得地址:

https://raw.githubusercontent.com/jquery/jquery/1.11.2/dist/jquery.js

直接上代码不BB.




    
    大彬哥版权所有翻录必究
    
    
    
    
    


尼古拉斯·屌·大彬哥的优点

index.js

var aLi = $("ul.good li");
console.log(aLi);

打开jquery.js第一个可以学的东西就来了,我擦嘞,装逼的利器啊,注释。

/*!
 * jQuery JavaScript Library v1.11.2
 * http://jquery.com/
 *
 * Includes Sizzle.js
 * http://sizzlejs.com/
 *
 * Copyright 2005, 2014 jQuery Foundation, Inc. and other contributors
 * Released under the MIT license
 * http://jquery.org/license
 *
 * Date: 2014-12-17T15:27Z
 */

不解释,你可以直接拿过去改吧改吧用在你自己的库里。

(function(global,factory){
    factory(global);
})(window,function(window,noGlobal){
    //大家记住这里才是放jquery核心代码的地方
    var version = "1.11.2";
    var jQuery = function( selector, context ) {
        return new jQuery.fn.init(selector, context );
    }
    //这个fn身上放各种功能函数
    jQuery.fn = jQuery.prototype = {
        jquery: version,
        constructor: jQuery,
        //各种功能
        first: function(selector) {
            
          
        }
    };
    
    //这个new 对象的时候传参进去
    var init = jQuery.fn.init = function (selector, context) {
        //拿到选择器干事儿
        
    };
    init.prototype = jQuery.fn;
    window.jQuery = window.$ = jQuery;
});

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/82788.html

相关文章

  • 体验javascript之美第四课--函数、函数表达式、闭包

    摘要:大彬哥版权所有翻录必究尼古拉斯屌大彬哥群尼古拉斯屌大彬哥函数声明函数表达式是不是简单的让人发指区别就一句话,函数声明,可以在函数调用之后,因为有函数预解析。而函数表达式必须在调用之前。 通过前三课讲解,大家应该能做到 1.手里有一份随时能够换工作自信的简历 2.知道了学习js的正确姿势 3.理解了全局对象、全局上下文、知道有预解析同时做了至少50道面试题 4.能熟练的使用json构建...

    Doyle 评论0 收藏0
  • TRY REGEX:正则表达式交互式入门教程 翻译&解答

    摘要:写一个正则表达式来测试变量中是否包含字符串。用函数给出不使用字符,但和等价的正则表达式。第十四课标志全局匹配标志第二个常用的标志是全局匹配标志,用字母表示。写出一个正则表达式来检验合法性。非捕获组的主要用途是给一个组赋予量词。 TRY REGEX 是一个交互式的正则表达式学习项目项目地址:https://github.com/callumacra...在线地址:http://tryre...

    李义 评论0 收藏0
  • 第十一课 CSS介绍与font字体 css学习1

    摘要:一样式规则基本结构二字体字号与字体字号大小字体宋体使用技巧网页中普遍使用字号尽量使用偶数的字号使用多个字体,字体间用逗号隔开,中文字体需加引号,英文字体可以不加,英文字体放在中文字体之前字体有空格要加引号尽量使用默认字体字体对于不支持一、CSS样式规则 1、基本结构               h1{         color: orange;        }             ...

    jerryloveemily 评论0 收藏0
  • 感受javascript之美系列教程第一课 基础知识

    摘要:屌丝和女神约好一起喝咖啡,聊天很愉快,分开不久手机收到女神发来的一个信息西女一个西女,你的嘴巴和手好白,你的嘴巴和手好白,你的嘴巴和手好白。屌丝看到了这句话顿时懵逼了。其实如果没有编辑器,你就相当于女神,电脑就相当于屌丝,他看不懂你写的。 javascript,当今最流行的开发语言之一,既有它简单易学的一面,又有它不同于其它语言奇怪的一面。我们一起通过感受javascript之美这套课...

    callmewhy 评论0 收藏0

发表评论

0条评论

王晗

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<