首页 / JAVA / JavaScript之链式结构序列化

JavaScript之链式结构序列化

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了JavaScript之链式结构序列化，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含5740字，纯文字阅读大概需要9分钟。

内容图文

一、概述

在JavaScript中，链式模式代码，太多太多，如下：

if_else:

            if
            (...){
    
            //
            TODO
}elseif(...){
    //TODO
}else{
    //TODO
}

switch:

疑问：诸如上述这些链式代码，倘若，我们想将其扁平化链式处理呢？如下：

            //
            fn1,f2,f3为处理函数
_if(fn1)._elseIf(fn2)._else(fn3);

下面我们就来一起尝试实现下呗。

二、链式代码扁平化

假如，现在我们有如下链式代码：

            if(name === ‘Monkey‘){
    console.log(‘yes, I am Monkey‘);
}elseif(name === ‘Dorie‘){
    console.log(‘yes, I am Dorie‘);
}else{
    console.log(‘sorry, over for ending!‘);
}

好了，现在我们一步一步将其"扁平化"。

其实看看上面的代码，不难发现，if…else这种格式，其实就是数据结构中的单链表，那么，初步利用JavaScript实现单链表，如下：

            var thens = [];
thens.resolve = function(name){
    for(var i = 0, len = this.length; i < len;i++){
        if(this[i](name) !== ‘next‘){
            break;
        }
    }
}
thens.push(f1, f2, f3);

其中f1，f2，f3为判断函数，并且我们假设，如果诸如f1、f2、f3返回’next’时，就继续往下查找，否则，停止往下查找。如下：

            function
             f1(name){
    
            if(name === ‘Monkey‘){
        console.log(‘yes, I am Monkey‘);
    }else{
        return ‘next‘;
    }
}
function f2(name){
    if(name === ‘Dorie‘){
        console.log(‘yes, I am Dorie‘);
    }else{
        return ‘next‘;
    }
}
function f3(){
    console.log(‘sorry, over for ending!‘);
}

好了，这就是链表的模式。

但是，我们的最终目的是想实现如下这样的呢？

            //
            fn1,f2,f3为处理函数
_if(fn1)._elseIf(fn2)._else(fn3);

你可能会说，将上述代码改成如下这样，不就好了吗？！！

thens.push(f1).push(f2).push(f3).resolve();

But，JavaScript的push方法返回的是数组的新长度，而不是数组对象哦。

So，那我们只能新写一个add方法，效果和push一样，但是返回数组对象。如下：

thens.add = function(f){
    if(typeof f === ‘function‘){
        this.push(f);
        returnthis;        
    }        
}

测试代码如下：

                var thens = [];
thens.add = function(f){
    if(typeof f === ‘function‘){
        this.push(f);
        returnthis;        
    }        
}
thens.resolve = function(name){
    for(var i = 0, len = this.length; i < len;i++){
        if(this[i](name) !== ‘next‘){
            break;
        }
    }    
}
thens.add(f1).add(f2).add(f3).resolve();

View Code

但是，这样有个缺点，我们是将add、resolve方法绑定在全局变量thens中的，总不能每次创建一个数组时，都复制粘贴一遍方法吧，所以重构代码如下：

            function
             Slink(){
    
            this.thens = [];
    this.thens.add = function(f){
        if(typeof f === ‘function‘){
            this.push(f);
            returnthis;        
        }        
    }
    this.thens.resolve = function(name){
        for(var i = 0, len = this.length; i < len;i++){
            if(this[i](name) !== ‘next‘){
                break;
            }
        }    
    }
}

显然，add，resolve这种公共方法，在每次实例化时，都创建一遍是不科学的，so，利用prototype在原有的基础上继续变形，如下：

            function
             Slink(){
    
            this.thens = [];
}
Slink.prototype = {
    add: function(f){
            if(typeof f === ‘function‘){
                this.thens.push(f);
                returnthis;        
            }        
    },
    resolve: function(name){
            for(var i = 0, len = this.thens.length; i < len; i++){
                if(this.thens[i](name) !== ‘next‘){
                    break;
                }
            }    
    }
}

测试代码如下：

            var thens = new Slink();
thens.add(f1).add(f2).add(f3);
thens.resolve();

不错，但是这样，我们每次都得手动new一个Slink，有点麻烦，所以，我们将new Slink这个过程，封装到函数中，如同jQuery一样，如下：

            function
             $go(f){
    
            return
            new
             Slink(f);
}

            function
             Slink(f){
    
            this.thens = [];
    this.thens.push(f);
}
Slink.prototype = {
    add: function(f){
            if(typeof f === ‘function‘){
                this.thens.push(f);
                returnthis;        
            }        
    },
    resolve: function(name){
            for(var i = 0, len = this.thens.length; i < len; i++){
                if(this.thens[i](name) !== ‘next‘){
                    break;
                }
            }    
    }
}

测试代码如下：

$go(f1).add(f2).add(f3).resolve();

好了，大功告成，接下来就是语法糖滴问题咯，整理代码如下：

            function
             _if(f){
    
            return
            new
             Slink(f);
}

            function
             Slink(f){
    
            this.thens = [];
    this.thens.push(f);
}
Slink.prototype = {
    _elseIf: function(f){
            if(typeof f === ‘function‘){
                this.thens.push(f);
                returnthis;        
            }        
    },
    _else: function(f){
            returnthis._elseIf(f);
    },
    resolve: function(name){
            for(var i = 0, len = this.thens.length; i < len; i++){
                if(this.thens[i](name) !== ‘next‘){
                    break;
                }
            }
            returnthis;            
    }
}

测试代码如下：

_if(f1)._elseIf(f2)._else(f3).resolve();

当然，除开利用数组这种方式，还可以利用闭包，实现链式扁平化效果，如下：

            var func = Function.prototype;
func._else = func._elseIf = function(fn){
    var _this = this;
    returnfunction(){
        var res = _this.apply(this,arguments);
        if(res==="next"){  //值为Booleanreturn fn.apply(this,arguments);
        }
        return res;
    }
}

测试代码如下：

                function
                 f1(name){
    
                if(name === ‘Monkey‘){
        console.log(‘yes, I am Monkey‘);
    }else{
        return ‘next‘;
    }
}
function f2(name){
    if(name === ‘Dorie‘){
        console.log(‘yes, I am Dorie‘);
    }else{
        return ‘next‘;
    }
}
function f3(){
    console.log(‘sorry, over for ending!‘);
}
f1._elseIf(f2)._else(f3)(‘Dorie‘);

View Code

三、异步代码链式扁平化

在上面我们讨论的都是同步过程，倘若，链式调用函数中有异步情况呢？

什么意思？如下：

            function
             f1(name){
    setTimeout(
            function
            (){
        
            if(name === ‘Monkey‘){
            console.log(‘yes, I am Monkey‘);
        }else{
            return ‘next‘;
        }
    }, 2000);
}
function f2(name){
    if(name === ‘Dorie‘){
        console.log(‘yes, I am Dorie‘);
    }else{
        return ‘next‘;
    }
}
function f3(){
    console.log(‘sorry, over for ending!‘);
}

我们将f1利用setTimeout变成了异步，按照上述代码的逻辑，应该是等f1完全执行完毕（包括setTimeout执行）后，判断是否执行f2，但真的如此吗？

测试代码如下：

_if(f1)._elseIf(f2)._else(f3).resolve();

执行代码的结果就是，什么也不输出。

Why？

因为JavaScript是单线程嘛。详情见（here）

那该怎么解决呢？

由于有异步代码，且必须在异步代码后处理后续的链，那么我们就等待异步代码执行完毕后，才执行后续的链嘛，如下：

            function
             f1(name){
    setTimeout(
            function
            (){
        
            if(name === ‘Monkey‘){
            console.log(‘yes, I am Monkey‘);
        }else{
            //处理后续链this.resolve(name, 1);//1代表下一个需处理函数在数组中的位置        }
    }.bind(this), 2000);
}

好了，由于在函数中，我们使用了this，其代表Slink对象，且改变了resolve方法，固，需细微调整Slink构造函数和原型链，如下：

            function
             Slink(f){
    
            this.thens = [];
    this.thens.push(f.bind(this));
}
Slink.prototype = {
    _elseIf: function(f){
            if(typeof f === ‘function‘){
                this.thens.push(f.bind(this));
                returnthis;        
            }        
    },
    _else: function(f){
            returnthis._elseIf(f.bind(this));
    },
    resolve: function(name, flag){
            for(var i = flag, len = this.thens.length; i < len; i++){
                if(this.thens[i](name) !== ‘next‘){
                    break;
                }
            }
            returnthis;            
    }
}

测试代码如下：

                function
                 f1(name){
    setTimeout(
                function
                (){
        
                if(name === ‘Monkey‘){
            console.log(‘yes, I am Monkey‘);
        }else{
            //处理后续链this.resolve(name, 1);//1代表下一个需处理函数在数组中的位置        }
    }.bind(this), 2000);
}
function f2(name){
    if(name === ‘Dorie‘){
        console.log(‘yes, I am Dorie‘);
    }else{
        return ‘next‘;
    }
}
function f3(){
    console.log(‘sorry, over for ending!‘);
}
_if(f1)._elseIf(f2)._else(f3).resolve(‘‘,0);

View Code

哈哈，如果你了解Promise，是不是感觉这么相似呢。

是的，宗旨都一样，达到异步代码扁平化目的，不过这里的代码比Promise要简约得多啦。关于Promise详情见(here)。

原文：http://www.cnblogs.com/giggle/p/5878285.html

内容总结

以上是互联网集市为您收集整理的JavaScript之链式结构序列化全部内容，希望文章能够帮你解决JavaScript之链式结构序列化所遇到的程序开发问题。如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/1215671.html

来源：【匿名】

【上一篇】《深入Java虚拟机》笔记【下一篇】JAVA/JSP学习系列之五

更多 ►

【JavaScript之链式结构序列化】教程文章相关的互联网学习教程文章

【java基础知识】【java序列化与反序列化及序列化ID】

今天上午学习了java序列化与反序列化及serialVersionUID的用处。一、序列化与反序列化的作用：对象的序列化主要有两种用途：1）把对象的字节序列永久地保存到硬盘上，通常存放在一个文件中；2）在网络上传送对象的字节序列。因为不对对象序列化的化容易出现很多问题，所以引入了序列化解决了这些问题。对象序列化包括如下步骤：1）创建一个对象输出流，它可以包装一个其他类型的目标输出流，如文件输出流；2）通过对象输出流...

JavaScript之链式结构序列化【代码】【图】

一、概述在JavaScript中，链式模式代码，太多太多，如下：if_else:if(...){//TODO }elseif(...){//TODO }else{//TODO }switch:switch(name){case ...:{//TODObreak;}case ...:{//TODObreak;}default:{//TODO } }疑问：诸如上述这些链式代码，倘若，我们想将其扁平化链式处理呢？如下：//fn1,f2,f3为处理函数 _if(fn1)._elseIf(fn2)._else(fn3);下面我们就来一起尝试实现下呗。二、链式代码扁平化假如，现在我们有如下链式代...

MessagePack Java Jackson 序列化和反序列化 POJO 为 MessagePack 的数组类型用来与 msgpack-java:0.6 保持兼容性

在 msgpack-java 0.6 或者早期的版本中，POJO 在 MessagePack 中被序列化和反序列化为数组变量。变量的顺序是基于 Java 类中变量的内部顺序了，这种本来是一种原生的序列化方法，但是会导致一些问题。导致这些问题的原因是在 Java 对象的内部变量的顺序与 Java 实现的顺序不能保证完全的一致。从另外一个角度来看，使用 jackson-databind 进行的序列化和反序列化方式是基于 POJO 的 Key-Value 对的。因此在 jackson-dataformat-msg...

java原生序列化和Kryo序列化性能比较【代码】

简介最近几年，各种新的高效序列化方式层出不穷，不断刷新序列化性能的上限，最典型的包括：专门针对Java语言的：Kryo，FST等等跨语言的：Protostuff，ProtoBuf，Thrift，Avro，MsgPack等等这些序列化方式的性能多数都显著优于hessian2（甚至包括尚未成熟的dubbo序列化）。有鉴于此，我们为dubbo引入Kryo和FST这两种高效Java序列化实现，来逐步取代hessian2。其中，Kryo是一种非常成熟的序列化实现，已经在Twitter、Groupon、 Yah...

java对象的序列化【代码】

序列化的理解：首先，序列化是一种处理对象的流机制，所谓对象流也就是将对象的内容进行流化。可以对流化后的对象进行读写操作，也可以将流化后的对象传输与网络之间。序列化的目的：序列化是为了解决在对对象流进行读写操作时所引发的的问题。序列化的实现：将需要被序列化的类实现serializable接口，该接口没有需要实现的方法。implements Serializable只是为了标注该对象是可被序列化的。序列化：是将对象转化为容易传输的格式的...

（中级篇 NettyNIO编解码开发）第七章-java序列化【代码】

相信大多数Java程序员接触到的第一种序列化或者编解码技术就是.Java的默认序列化，只需要序列化的POJO对象实现java.io.Serializable接口，根据实际情况生成序列ID,这个类就能够通过java.io.Objectlnput和java.io.ObjectOutput序列化和反序列化。不需要考虑跨语言调用，对序列化的性能也没有苛刻的要求时，Java默认的序列化机制是最明智的选择之一。正因为此，虽然Java序列化机制存在着一些弊病，依然得到了广泛的应用。本章主要内容...

java JSONObject序列化包含Date类型数据的Java对象

[size=large][color=blue][b]如果Date.class无法进行转换则使用Timestamp.class[/b][/color][/size][color=red][b]jackson进行转换Date时需要加如下代码[/b][/color]@JsonFormat(pattern="yyyy-MM-dd HH:mm:ss",timezone="GMT+8")private Date createTime;[size=medium][color=red][b]问题场景[/b][/color][/size]在Java里面，会遇到这样的问题：[b]数据库中存在TIMESTAMP类型的数据，这样Bean对象里面就会有Date（java.util.Date）...

JavaScript二进制数据序列化和反序列化【代码】

最近业余时间在搞h5小游戏，由于同步协议过于频繁，和服务器之间的同步直接用json就显得太浪费了，于是我们商讨之下决定改用二进制。学习过程中并没有遇到一篇就解决问题的文章，遂再总结一发。 1.二进制数据的存储ArrayBuffer对象、TypedArray对象、DataView对象是JavaScript操作二进制数据的一个接口。　（1）ArrayBuffer对象：代表内存之中的一段二进制数据，它不能直接读写，只能通过视图（TypedArray视图和DataView视图)来读写...

Java 之 I/O 系列 02 ——序列化【代码】

Java 之 I/O 系列目录Java 之 I/O 系列 01 ——基础Java 之 I/O 系列 02 ——序列化一序列化概述　　序列化，简单来讲，就是以“流”的方式来保存对象，至于保存的目标地址，可以是文件，可以是数据库，也可以是网络，即通过网络将对象从一个节点传递到另一个节点。　　在Java的I/O结构中，有ObjectOutputStream和ObjectInputStream，它们可以实现将对象输出为二进制流，并从二进制流中获取对象，那为什么还需要序列化呢？这需要...

基于Java IO 序列化方案的memcached-session-manager多memcached节点配置

通过nginx将请求负载均衡，而后台的几组tomcat的session通过memcached(non-sticky模式)进行统一管理，这几组tomcat部署的web app是同一应用，session的变化要统一，项目组最后采用memcached-session-manager来对tomcat的session进行管理。 session的序列化方案官方推荐的有4种java serializationmsm-kryo-serializermsm-javolution-serializermsm-xstream-serializer原文：http://www.cnblogs.com/wyh825/p/5667393.html

Asp.Net中JSON的序列化和反序列化-----JavaScriptSerializer ,加上自己工作心得

在工作中和手机通信用到web服务和javascriptSerializer，返回json数据，供手机端调用，一开始返回的数据是一大堆，比如[{"word_picture9":"http://boss.xbxw.net/Upload/word/guojia/p_yinggelan.jpg","word_picture8":"http://boss.xbxw.net/Upload/word/guojia/p_zhongguo.jpg","word_voice2":"http://boss.xbxw.net/Upload/voice/approve.mp3","word_picture13":"http://boss.xbxw.net/Upload/word/gaokao/p_qingxu.jpg","word_...

Hadoop序列化与Java序列化

序列化就是把内存中的对象的状态信息转换成字节序列，以便于存储（持久化）和网络传输反序列化就是就将收到的字节序列或者是硬盘的持久化数据，转换成内存中的对象。1.JDK的序列化　　只要实现了serializable接口就能实现序列化与反序列化，一定要加上序列化版本ID serialVersionUID，这个是用来识别序列化的之前的类到底是哪一个。比如希望类的不同版本对序列化兼容，需要确保类的不同版本具有相同的serialVersionUID；　　Java序...

Java 的序列化Serializable接口介绍及应用

常看到类中有一串很长的如 private static final long serialVersionUID = -4667619549931154146L;的数字声明。这些其实是对此类进行序列化的，那为何要进行序列化呢？下面参照网络及jdk说明，进行学习一下：理解：serialVersionUID 用来表明类的不同版本间的兼容性简单的说，Java的序列化是通过在运行时判断类的serialversionUID来验证版本的一致性的。在进行序列化时，jvm会把传来的字节流中的serialversionUID与本地的相应实体...

Java XMl序列化与反序列化【代码】

import javax.xml.bind.JAXBContext; import javax.xml.bind.JAXBException; import javax.xml.bind.Marshaller; import javax.xml.bind.Unmarshaller; import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputStream; import java.io.StringWriter; import java.io.UnsupportedEncodingException;public class XmlUtil {/*** 序列化XML* @param object* @return* @throws JAXBException* @throws UnsupportedEncodi...

java的json序列化【代码】

/** 序列化帮助类*/ public class SerializeHelper {private static ObjectMapper objectMapper = new ObjectMapper(); /** * 将对象序列化为JSON字符串 * * @param object * @return JSON字符串 * @throws IOException * @throws JsonMappingException * @throws JsonGenerationException */ public String serialize(Object object) throws JsonGenerationException, JsonMappingException, IOException { Writer write = ne...

首页 / JAVA / JavaScript之链式结构序列化

JavaScript之链式结构序列化

内容导读

内容图文

内容总结

内容备注

内容手机端

【JavaScript之链式结构序列化】教程文章相关的互联网学习教程文章

序列化 - 相关标签

JAVA - 技术教程分类

JAVA - 最新教程

JAVA - 最热教程