js链式调用
Posted superAnny
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了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链式调用的主要内容,如果未能解决你的问题,请参考以下文章