zoukankan      html  css  js  c++  java
  • jQ链式写法详解

    jQ的链式写法详解:

      jq的链式写法很好用,直接打【.】就可以了,说起来JQ 是如何实现链式写法的呢?

      很多人都说jq的链式写法就是 return this   那么return this代表了什么呢?

      简单说return this就是要返回下一个函数的执行父级(原谅我语文不好,找不到一个更好的词代替父级这俩个字。)

      那么下面写个例子,来实现一个简单的链式写法:

     1 function a(){
     2     // 执行一些操作。
     3     console.log(111);
     4     return window;
     5 }
     6 function b(){
     7     console.log(22);
     8     //执行一些操作。
     9     return window;
    10 }
    11 a().b();

      这算实现了链式写法吧? 我返回下一个函数的父级,当a函数执行完后,返回window,这样下个b函数也可以进行操作,当然这个在项目中不这么写。

      在写个项目中可以使用的链式写法:

     1 function a(){
     2     console.log(1);
     3     return this;
     4 }
     5 function b(){
     6     console.log(2);
     7     return this;
     8 }
     9 var obj={
    10     a:a,
    11     b:b
    12 }
    13 obj.a().b();

     那么jq是如何实现链式写法的呢?肯定不是这么简单对吧?

     介绍下jq是如何实现链式写法的。

      在jq中有这么一行代码定义了

    1 jQuery = function (selector, context) {
    2     return new jQuery.fn.init(selector, context, rootjQuery);
    3 },
    jQuery.fn = jQuery.prototype = {}
    jQuery.fn.init.prototype = jQuery.fn;

     简单说这几行代码实现了JQ的链式写法定义一个函数,return 一个实例,init函数里进行了处理初始化操作,比如选择器,拼接字符串等等,这里不一一介绍。

     最后再将jq的prototype 赋值给init方法的prototype。

     这样就实现了链式写法。在工作中也经常会使用到JQ的链式写法,比如说:

      在做移动端项目的时候,通常大家会引入zepto。但是zepto大约27k左右,在移动端已经很大了,那么我们就有必要不去引入zepto。而是我们单独写一个常用方法库。

      并且使用链式写法,操作简单,而且还是专门应对于我们的项目。所以推荐大家不引入zepto。而是自己去写个常用方法库。

  • 相关阅读:
    Kubernetes 1.5部署sonarqube
    Kubernetes 1.5集成heapster
    Kubernetes 1.5 配置dashboard
    SQL SERVER中的逻辑读取,物理读取,以及预读的理解
    JS控制显示/隐藏二级菜单
    Css下拉菜单设置
    div包裹页面后多余部分没有显示,也没滚动条 overflow 属性设置
    Sql Ado.net 学习笔记之连接字符串
    Winform异步解决窗体耗时操作(Action专门用于无返回值,Func专门用于有返回值)
    SQL中的字母的大小写转换
  • 原文地址:https://www.cnblogs.com/hanfei-cn/p/5516581.html
Copyright © 2011-2022 走看看