js链式调用

作者: ferrint | 来源:发表于2017-02-28 15:57 被阅读1536次

关键词:链式调用

我们都很熟悉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)

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

相关文章

  • 自制jquery-第一篇

    1, jquery.js脚本文件 2,实现链式调用的原理 非链式调用:$xxx.addClass("active"...

  • js链式调用

  • js链式调用

    关键词:链式调用 我们都很熟悉jQuery了,只能jQuery中一种非常牛逼的写法叫链式操作 那这是如何实现的呢,...

  • js链式调用

  • js链式调用 动画

    jquery链式调用: jquery对象的方法会在执行完后返回这个jquery对象,所有jquery对象的方法可以...

  • js链式调用 动画

    jquery链式调用: jquery对象的方法会在执行完后返回这个jquery对象,所有jquery对象的方法可以...

  • swift重温笔记(可选链式调用)

    使用可选链式调用代替强制展开 为可选链式调用定义模型类 通过可选链式调用访问属性 通过可选链式调用调用方法 通过可...

  • js的链式调用分析

    前言 在做一个组件化开发的案例时在主逻辑中用到了链式调用的方法,目的是为了让代码更简洁易读,减少代码量,但是对各个...

  • JS如何实现链式调用

    方法链,当方法的返回值是一个对象,这个对象就可以继续调用它的方法。一般当函数不需要返回值时,直接 return t...

  • 你一定不知道的链式调用新姿势

    如何链式调用Java静态方法? 链式调用 首先需要提一下最近几年在开发界大的链式调用,链式调用非常利于编写,更利于...

网友评论

  • de96d6727049:有一点不懂:“*注意:自执行函数不会被内存机制回收”?没有找到相关说法,只是闭包不会被内存回收因为引用,自执行函数(立即执行函数)为什么不回收?

本文标题:js链式调用

本文链接:https://www.haomeiwen.com/subject/luixgttx.html