分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 技术分享

js链式调用

发布时间:2023-09-06 01:14责任编辑:顾先生关键词:js

我们都很熟悉jQuery了,只能jQuery中一种非常牛逼的写法叫链式操作

* $(‘#div‘).css(‘background‘,‘#ccc‘).removeClass(‘box‘).stop().animate({width:300})

那这是如何实现的呢,我自己写了个例子:并非jQuery源码

Ferrinte.prototype.show=function () { ???for(var i=0;i<this.elements.length;i++) ???{ ???????this.elements[i].style.display=‘block‘; ???} ???return this;};Ferrinte.prototype.hide=function () { ???for(var i=0;i<this.elements.length;i++) ???{ ???????this.elements[i].style.display=‘none‘; ???} ???return this;};

其实很简单就是通过return this实现的,当某个函数执行完毕,在把执行的结果返回,这样其他的函数就能继续调用了


原生js也是支持链式调用的,比如说:

 ???var arr = [1,2,3,4,5]; ???arr.reverse().join("").split(); ???console.log(arr);

在原生js中,链式调用还可以这样用

 ???function show(str) { ???????console.log(str); ???????return show; ???} ???show(123)(456)(789);// 控制台打印结果// 123// 456// 789

我们发现,不写函数名称只写()也可以实现函数执行,那我们这样写可以不可以呢

 ???function show(str) { ???????console.log(str); ???????return show; ???}(123)

原则上是可以的,但是这样不符合js语法,会报错

我们给函数外加上括号

 ???(function show(str) { ???????console.log(str); ???????return show; ???})(123)

这样就OK了,一个自执行的函数
但是这样写在严格模式下回报错,我们把函数赋值给一个变量就好了

 ???var a = (function show(str) { ???????console.log(str); ???????return show; ???})(123)

*注意:自执行函数不会被内存机制回收



作者:ferrint
链接:http://www.jianshu.com/p/a84093c9c144
來源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

js链式调用

原文地址:http://www.cnblogs.com/superAnny/p/7614253.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved