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为iframe的body添加click事件的实现代码
Apr 07 Javascript
jQuery 源码分析笔记(4) Ready函数
Jun 02 Javascript
js数组转json并在后台对其解析具体实现
Nov 20 Javascript
Extjs grid添加一个图片状态或者按钮的方法
Apr 03 Javascript
javascript动态创建链接的方法
May 13 Javascript
QQ登录背景闪动效果附效果演示源码下载
Sep 22 Javascript
js replace()去除代码中空格的实例
Feb 14 Javascript
angular2+node.js express打包部署的实战
Jul 27 Javascript
JS中实现一个下载进度条及播放进度条的代码
Jun 10 Javascript
Vue.use()在new Vue() 之前使用的原因浅析
Aug 26 Javascript
微信小程序 简易计算器实现代码实例
Sep 02 Javascript
javascript实现电商放大镜效果
Nov 23 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
php面向对象全攻略 (十四) php5接口技术
2009/09/30 PHP
PHP chmod 函数与批量修改文件目录权限
2010/05/10 PHP
《PHP编程最快明白》第八讲:php启发和小结
2010/11/01 PHP
php数组函数序列之array_values() 获取数组元素值的函数与方法
2011/10/30 PHP
PHP提示Cannot modify header information - headers already sent by解决方法
2014/09/22 PHP
PHP多线程类及用法实例
2014/12/03 PHP
js模拟类继承小例子
2010/07/17 Javascript
jQuery .attr()和.removeAttr()方法操作元素属性示例
2013/07/16 Javascript
JS for循环中i++ 和 ++i的区别介绍
2016/07/20 Javascript
Angular 2应用的8个主要构造块有哪些
2016/10/17 Javascript
微信小程序 wx:key详细介绍
2016/10/28 Javascript
JS异步加载的三种实现方式
2017/03/16 Javascript
Vue.js进行查询操作的实例详解
2017/08/25 Javascript
解决vue热替换失效的根本原因
2018/09/19 Javascript
vue excel上传预览和table内容下载到excel文件中
2019/12/10 Javascript
详解javascript脚本何时会被执行
2021/02/05 Javascript
Python自动化构建工具scons使用入门笔记
2015/03/10 Python
Python中使用gzip模块压缩文件的简单教程
2015/04/08 Python
使用Mixin设计模式进行Python编程的方法讲解
2016/06/21 Python
使用python绘制常用的图表
2016/08/27 Python
如何利用Fabric自动化你的任务
2016/10/20 Python
python3.4用循环往mysql5.7中写数据并输出的实现方法
2017/06/20 Python
python 创建一个空dataframe 然后添加行数据的实例
2018/06/07 Python
Python爬虫之网页图片抓取的方法
2018/07/16 Python
python 地图经纬度转换、纠偏的实例代码
2018/08/06 Python
使用sklearn的cross_val_score进行交叉验证实例
2020/02/28 Python
python网络编程socket实现服务端、客户端操作详解
2020/03/24 Python
丝芙兰中国官方商城:SEPHORA中国
2018/01/10 全球购物
阿根廷在线宠物商店:Puppis
2018/03/23 全球购物
Ivory Isle Designs美国/加拿大:婚礼和活动文具公司
2018/08/21 全球购物
洛佩桑酒店官方网站:Lopesan Hotels
2019/04/15 全球购物
Interhome丹麦:在线预订度假屋和公寓
2019/07/18 全球购物
移动通信专业自荐信范文
2013/11/12 职场文书
找工作最新求职信
2013/12/22 职场文书
2014公安机关纪律作风整顿思想汇报
2014/09/13 职场文书
2019入党申请书范文3篇
2019/08/21 职场文书