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 相关文章推荐
让innerHTML的脚本也可以运行起来
Jul 01 Javascript
JQuery 选择和过滤方法代码总结
Nov 19 Javascript
原生javascript实现无间缝滚动示例
Jan 28 Javascript
NODE.JS加密模块CRYPTO常用方法介绍
Jun 05 Javascript
基于jQuery Circlr插件实现产品图片360度旋转
Sep 20 Javascript
三种Node.js写文件的方式
Mar 08 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
Jun 30 Javascript
总结几道关于Node.js的面试问题
Jan 11 Javascript
angular中实现li或者某个元素点击变色的两种方法
Jul 27 Javascript
vuejs使用$emit和$on进行组件之间的传值的示例
Oct 04 Javascript
Vue源码之关于vm.$delete()/Vue.use()内部原理详解
May 01 Javascript
angular异步验证器防抖实例详解
Mar 31 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 组件化编程技巧
2009/06/06 PHP
淘宝ip地址查询类分享(利用淘宝ip库)
2014/01/07 PHP
php获取网页上所有链接的方法
2015/04/03 PHP
yii2 RBAC使用DbManager实现后台权限判断的方法
2016/07/23 PHP
php+ajax实现带进度条的上传图片功能【附demo源码下载】
2016/09/14 PHP
PHP sdk实现在线打包代码示例
2020/12/09 PHP
JavaScript bold方法入门实例(把指定文字显示为粗体)
2014/10/17 Javascript
JavaScript程序设计之JS调试
2015/12/09 Javascript
实例讲解JavaScript中instanceof运算符的用法
2016/06/08 Javascript
JavaScript中的this引用(推荐)
2016/08/05 Javascript
jQuery获取Table某列的值(推荐)
2017/03/03 Javascript
IScroll那些事_当内容不足时下拉刷新的解决方法
2017/07/18 Javascript
JS 实现banner图片轮播效果(鼠标事件)
2017/08/04 Javascript
JS实现评价的星星功能
2017/08/20 Javascript
bootstrap switch开关组件使用方法详解
2017/08/22 Javascript
解决Vue 通过下表修改数组,页面不渲染的问题
2018/03/08 Javascript
vue初始化动画加载的实例
2018/09/01 Javascript
vue-for循环嵌套操作示例
2019/01/28 Javascript
vue-router 前端路由之路由传值的方式详解
2019/04/30 Javascript
Python随机生成带特殊字符的密码
2016/03/02 Python
python实现决策树C4.5算法详解(在ID3基础上改进)
2017/05/31 Python
Python爬虫实现(伪)球迷速成
2018/06/10 Python
对Python+opencv将图片生成视频的实例详解
2019/01/08 Python
python实现狄克斯特拉算法
2019/01/17 Python
PyQt5固定窗口大小的方法
2019/06/18 Python
Python 根据日志级别打印不同颜色的日志的方法示例
2019/08/08 Python
Python安装OpenCV的示例代码
2020/03/05 Python
利用django创建一个简易的博客网站的示例
2020/09/29 Python
Python Serial串口基本操作(收发数据)
2020/11/06 Python
秘书行业自我鉴定范文
2013/12/30 职场文书
麦当劳辞职信范文
2014/01/18 职场文书
《水上飞机》教学反思
2014/04/10 职场文书
史上最牛的辞职信
2015/02/28 职场文书
党支部综合考察意见
2015/06/01 职场文书
Go语言 go程释放操作(退出/销毁)
2021/04/30 Golang
在Docker容器中部署SQL Server
2022/04/11 Servers