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 相关文章推荐
jquery-easyui关闭tab自动切换到前一个tab
Jul 29 Javascript
JS 实现完美include载入实现代码
Aug 05 Javascript
JavaScript Accessor实现说明
Dec 06 Javascript
动态加载外部javascript文件的函数代码分享
Jul 28 Javascript
jQuery cdn使用介绍
May 08 Javascript
jQuery简单实现日历的方法
May 04 Javascript
浅谈JavaScript中的apply/call/bind和this的使用
Feb 26 Javascript
浅谈Vue项目骨架屏注入实践
Aug 05 Javascript
微信小程序云开发如何实现数据库自动备份实现
Aug 16 Javascript
jQuery实现可编辑的表格
Dec 11 jQuery
微信小程序点击滚动到指定位置的实现
May 22 Javascript
vue 解决data中定义图片相对路径页面不显示的问题
Aug 13 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
在smarty模板中使用PHP函数的方法
2011/04/23 PHP
PHP ignore_user_abort函数详细介绍和使用实例
2014/07/15 PHP
PHP判断浏览器、判断语言代码分享
2015/03/05 PHP
PHP十六进制颜色随机生成器功能示例
2017/07/24 PHP
PHP设计模式之原型设计模式原理与用法分析
2018/04/25 PHP
PHP中关于php.ini参数优化详解
2020/02/28 PHP
JavaScript中的this关键字使用方法总结
2015/03/13 Javascript
关于网页中的无缝滚动的js代码
2016/06/09 Javascript
JavaScript DOM节点操作实例小结(新建,删除HTML元素)
2017/01/19 Javascript
用move.js库实现百叶窗特效
2017/02/08 Javascript
Vue实现数字输入框中分割手机号码的示例
2017/10/10 Javascript
VUE-Table上绑定Input通过render实现双向绑定数据的示例
2018/08/27 Javascript
详解vue项目中使用token的身份验证的简单实践
2019/03/08 Javascript
vue实现可视化可拖放的自定义表单的示例代码
2019/03/20 Javascript
JavaScript遍历数组的方法代码实例
2020/01/14 Javascript
微信小程序实现搜索功能
2020/03/10 Javascript
在Python中使用第三方模块的教程
2015/04/27 Python
Python编程中time模块的一些关键用法解析
2016/01/19 Python
利用Python脚本实现ping百度和google的方法
2017/01/24 Python
Python实现动态加载模块、类、函数的方法分析
2017/07/18 Python
python的exec、eval使用分析
2017/12/11 Python
selenium+python环境配置教程详解
2019/05/28 Python
python爬取盘搜的有效链接实现代码
2019/07/20 Python
django框架ModelForm组件用法详解
2019/12/11 Python
pytorch下大型数据集(大型图片)的导入方式
2020/01/08 Python
关于Pytorch的MNIST数据集的预处理详解
2020/01/10 Python
python实时监控logstash日志代码
2020/04/27 Python
纯css3无js实现的Android Logo(有简单动画)
2013/01/21 HTML / CSS
Farfetch澳大利亚官网:Farfetch Australia
2020/04/26 全球购物
什么是Linux虚拟文件系统VFS
2015/08/25 面试题
人力管理专业毕业生求职信
2014/02/27 职场文书
文秘班元旦晚会活动策划方案
2014/08/28 职场文书
2014最新实习证明模板
2014/10/02 职场文书
卫生保健工作总结2015
2015/05/18 职场文书
利用Pycharm连接服务器的全过程记录
2021/07/01 Python
Python捕获、播放和保存摄像头视频并提高视频清晰度和对比度
2022/04/14 Python