函数的链式调用实现Man().sleep().eat()

let index = 0;
let stack = [];
function next() {
    let fn = stack[index];
    index++;
    if(typeof fn === ‘function‘){
        fn();
    }
}
function fn1() {
    console.log(1)
    next()
}
function fn2() {
    setTimeout(function() {
        console.log(2)
        next()
    },0)

}
function fn3() {
    console.log(3)
    next()
}

// stack.push(fn1)
// stack.push(fn2)
// stack.push(fn3)
function Man(name) {
    stack.push(function(){
        console.log(name);
        next();
    })
}
var p
function LazyMan(name) {
    p = new Man(‘Hank‘)
    return p;
}
Man.prototype.sleep = function(time){
    var that = this;

    stack.push(function(){
        setTimeout(function() {
            console.log(time + ‘秒‘)
            next()

        },time *1000)
    })
    return that;
}
Man.prototype.eat = function(food){

        stack.push(function(){
            console.log(‘eat ‘+food)
            next();
        })
        return this;
}
Man.prototype.sleepFirst = function(time){
    var that = this;
    stack.unshift(function(){
        setTimeout(function() {
            console.log(‘wake up after ‘+ time + ‘秒‘)
            next()

        },time *1000)
    })
    return that;
}

// LazyMan(‘Hank‘)

/* 输出:

Hi! This is Hank!

*/

// LazyMan(‘Hank‘).sleep(1).eat(‘dinner‘)

/* 输出:

Hi! This is Hank!

// 等待10秒..

Wake up after 10

Eat dinner~

*/

// LazyMan(‘Hank‘).eat(‘dinner‘).eat(‘“supper”‘)

/* 输出:

Hi This is Hank!

Eat dinner~

Eat supper~

*/

LazyMan(‘“Hank”‘).sleepFirst(2).eat(‘“supper”‘)

/* 等待5秒,输出

Wake up after 5

Hi This is Hank!

Eat supper

*/
// console.log(stack[0]())
next()

原文地址:https://www.cnblogs.com/hellobeen/p/been101.html

时间: 2025-01-18 05:58:24

函数的链式调用实现Man().sleep().eat()的相关文章

Javscript的函数链式调用基础篇

我们都很熟悉jQuery了,只能jQuery中一种非常牛逼的写法叫链式操作: $('#div').css('background','#ccc').removeClass('box').stop().animate({width:300}) 在原生js中,链式调用还可以这样用 function show(str) { console.log(str); return show; } show(123)(456)(789); // 控制台打印结果 // 123 // 456 // 789 (fun

如何写 JS 的链式调用 ---》JS 设计模式《----方法的链式调用

1.以$ 函数为例.通常返回一个HTML元素或一个元素集合. 代码如下: function $(){ var elements = []; for(var i=0;i<arguments.length;i++){ var element = argument[i]; if(typeOf element == "String") { element = document.getElementById(element); } if ( arguments.length === 1)

模拟jQuery底层源码的链式调用和常用的$()方法的实现

最近在看jQuery框架的源码,感觉还是学到不少东西的,所以就想总结一下自己的知识,和广大的前端爱好者一起 交流一下,我下面所说的并不是直接对jQuery的源码来解读,我是模拟一下jQuery底层源码的链式调用大概是怎么 实现的和常用的$功能是怎么实现的.好了废话不多说了.你要看这个,你就要对jQuery有一定的了解,最起码你要用过jQuery.首先看下jQuery的源码开始是怎么写的 (function( window, undefined){    })(window);它的代码就是被这个块

jQuery的链式调用原理,Promise的链式调用,this的问题

最近被问到这个问题,jq的链式调用原理,当时比较懵=.=,毕竟现在jq接触的机会变很少了. jq的链式调用 jq的链式调用其实就是比如我们在选择dom的时候, $('input[type="button"]') .eq(0).click(function() { alert('点击我!'); }).end().eq(1) .click(function() { $('input[type="button"]:eq(0)').trigger('click'); }).

jquery中链式调用原理

(1).链式调用 $("#mybtn").css("width","100px") .css("height","100px") .css("background","red"); (2).在对属性进行操作时建议使用JSON形式控制样式 $("#mybtn").css({    width:200,    height:"200"

开源项目OkHttpPlus——支持GET、POST、UI线程回调、JSON格式解析、链式调用、文件上传下载

OkHttpPlus介绍 项目地址:https://github.com/ZhaoKaiQiang/OkHttpPlus 主要功能:OkHttp封装,支持GET.POST.UI线程回调.JSON格式解析.链式调用.小文件上传下载及进度监听等功能 为什么要写这么一个库呢? 首先,是因为OkHttp在4.4之后已经作为底层的Http实现了,所以OkHttp这个库很强大,值得我们学习. 其次,在我看来,OkHttp使用起来不如Volley方便,OkHttp的回调都是在工作线程,所以如果在回调里面操作V

方法的链式调用【参考javascript设计模式第6章】

对应经常使用jquery的朋友,方法的链式调用应该是已经很属性了,书上有模拟出一个很简单的类库代码, 见代码如下: Function.prototype.method = function(name,fn){ this.prototype[name] = fn; return this; }; (function(){ function _$(els){ ........ } /*Events  addEvent getEvent*/ _$.method("addEvent",func

第51讲:Scala中链式调用风格的实现代码实战及其在Spark编程中的广泛运用

今天学习了下scala中的链式调用风格的实现,在spark编程中,我们经常会看到如下一段代码: sc.textFile("hdfs://......").flatMap(_.split(" ")).map(_,1).reduceByKey(_ + _)........ 这种风格的编程方法叫做链式调用,它的实现方法见下面的代码: class Animal {def breathe : this.type = this}class Cat extends Animal

Scala 深入浅出实战经典 第51讲:Scala中链式调用风格的实现代码实战及其在Spark中应用

王家林亲授<DT大数据梦工厂>大数据实战视频 Scala 深入浅出实战经典(1-64讲)完整视频.PPT.代码下载:百度云盘:http://pan.baidu.com/s/1c0noOt6 腾讯微云:http://url.cn/TnGbdC 360云盘:http://yunpan.cn/cQ4c2UALDjSKy 访问密码 45e2土豆:http://www.tudou.com/programs/view/5uuKOP38d6s/优酷:http://v.youku.com/v_show/id_