javascript简单链式调用案例分析


Posted in Javascript onMay 10, 2017

本文实例讲述了javascript简单链式调用方法。分享给大家供大家参考,具体如下:

jQuery用的就是链式调用。像一条连接一样调用方法。
链式调用的核心就是return this;,每个方法都返回对象本身。

下面是简单的模拟jQuery的代码:

<script>
  window.$ = function (id) {
    return new _$(id);
  }
  function _$(id) {
    this.elements = document.getElementById(id);
  }
  _$.prototype = {
    constructor: _$,
    hide: function () {
      console.log('hide');
      return this;
    },
    show: function () {
      console.log('show');
      return this;
    },
    getName: function (callback) {
      if (callback) {
        callback.call(this, this.name);
      }
      return this;
    },
    setName: function (name) {
      this.name = name;
      return this;
    }
  }
  $('test').setName('helloworld').getName(function (name) {
    console.log(name);
  }).show().hide().show().hide().show();
</script>

运行效果图如下:

javascript简单链式调用案例分析

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
ASP.NET jQuery 实例7 通过jQuery来获取DropDownList的Text/Value属性值
Feb 03 Javascript
JS原型对象通俗&quot;唱法&quot;
Dec 27 Javascript
使用JavaScript 实现对象 匀速/变速运动的方法
May 08 Javascript
seajs加载jquery时提示$ is not a function该怎么解决
Oct 23 Javascript
JavaScript中匿名函数的递归调用
Jan 22 Javascript
jquery实现下拉菜单的手风琴效果
Jul 23 jQuery
JavaScript中七种流行的开源机器学习框架
Oct 11 Javascript
JavaScript对象拷贝与赋值操作实例分析
Dec 10 Javascript
微信小程序传值以及获取值方法的详解
Apr 29 Javascript
解决axios post 后端无法接收数据的问题
Oct 29 Javascript
JS实现canvas简单小画板功能
Jun 23 Javascript
nestjs返回给前端数据格式的封装实现
Feb 22 Javascript
Angular.JS通过指令操作DOM的方法
May 10 #Javascript
JS实现队列的先进先出功能示例
May 10 #Javascript
BootStrap的两种模态框方式
May 10 #Javascript
微信小程序之购物车功能
Sep 23 #Javascript
js canvas实现QQ拨打电话特效
May 10 #Javascript
bootstrap弹出层的多种触发方式
May 10 #Javascript
详解使用vue脚手架工具搭建vue-webpack项目
May 10 #Javascript
You might like
怎么使 Mysql 数据同步
2006/10/09 PHP
PHP初学者常见问题集合 修正版(21问答)
2010/03/23 PHP
ThinkPHP里用U方法调用js文件实例
2015/06/18 PHP
PHP模拟http请求的方法详解
2016/11/09 PHP
PHP将身份证正反面两张照片合成一张图片的代码
2017/04/08 PHP
PHP7创建COOKIE和销毁COOKIE的实例方法
2020/02/03 PHP
页面回到顶部的三种实现(锚标记,js)
2012/10/01 Javascript
Extjs改变树节点的勾选状态点击按钮将复选框去掉
2013/11/14 Javascript
JS执行删除前的判断代码
2014/02/18 Javascript
JS 使用for循环遍历子节点查找元素
2014/09/06 Javascript
FullCalendar日历插件应用之数据展现(一)
2015/12/23 Javascript
深入浅析JavaScript函数前面的加号和叹号
2016/07/09 Javascript
JS限制条件补全问题实例分析
2016/12/16 Javascript
JS实现二叉查找树的建立以及一些遍历方法实现
2017/04/17 Javascript
hammer.js实现图片手势放大效果
2017/08/29 Javascript
浅谈ng-zorro使用心得
2018/12/03 Javascript
vue项目设置scrollTop不起作用(总结)
2018/12/21 Javascript
详解vue组件中使用路由方法
2019/02/12 Javascript
jQuery+ajax实现批量删除功能完整示例
2019/06/06 jQuery
vue 路由缓存 路由嵌套 路由守卫 监听物理返回操作
2020/08/06 Javascript
jQuery实现日历效果
2020/09/11 jQuery
基于python的汉字转GBK码实现代码
2012/02/19 Python
python判断单向链表是否包括环,若包含则计算环入口的节点实例分析
2019/10/23 Python
Python文件操作基础流程解析
2020/03/19 Python
python3实现将json对象存入Redis以及数据的导入导出
2020/07/16 Python
Python Pandas数据分析工具用法实例
2020/11/05 Python
详解HTML5中div和section以及article的区别
2015/07/14 HTML / CSS
美国优质宠物用品购买网站:Muttropolis
2020/02/17 全球购物
个人现实表现材料
2014/02/04 职场文书
主要领导对照检查材料
2014/08/26 职场文书
党的群众路线教育实践活动领导班子整改方案
2014/10/25 职场文书
地震慰问信
2015/02/14 职场文书
2015年社会实践个人总结
2015/03/06 职场文书
2019让人心动的商业计划书
2019/06/27 职场文书
2019年员工晋升管理制度范本!
2019/07/08 职场文书
蔬果开业典礼发言稿应该怎么写?
2019/09/03 职场文书