首页 技术 正文
技术 2022年11月14日
0 收藏 363 点赞 5,052 浏览 1407 个字

熟悉Jquery的同学都知道,它对dom的操作基本都链式调用的写法,这种给人感觉就是很简洁,易懂,而且最大的好处就是避免多次重复使用一个对象变量。

链式的实现方式:
链式操作是在对象的方法中通过最后返回自身对象(return this),返回的对象就可以继续调用它里面的方法。那么,简单实现一下:

var o ={f:function(r){console.log(+new Date , r); return this;}};o.f(1).f(2).f(3).f(4).f(5).f(6).f(7).f(8).f(9);

再例如:

var a = {
b: function(bb) {
console.log(bb);
return this;
},
c: function(cc) {
console.log(cc)
return this;
},
d: function(dd) {
console.log(dd)
return this;
}
}
a.b(1).c(2).d(3);

改造为工厂模式
通过一个函数,利用它来创建了一个对象,然后返回这个对象。代码如下:

function Obj() {}
Obj.prototype ={//扩展它的prototype
setNum:function (num) {
this.num = num;
return this;
},
fn_a:function(){
this.num++;
return this;
},
fn_b:function(pram){
this.num=this.num*pram;
return this;
},
getNum:function (){
return this.num;
},
};
function I() {//工厂函数
return new Obj();
}
var num=I().setNum(1).fn_a().fn_b(5).getNum();
console.log(num);

其实很简单就是通过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);// 控制台打印结果
//
//
//

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

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

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

我们给函数外加上括号

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

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

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

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

https://www.jianshu.com/p/a84093c9c144

https://www.cnblogs.com/JChen666/p/3614971.html

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:8,905
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,430
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,247
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,058
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,690
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,727