yu.to 管理后台分页数据,快速处理日期、枚举、单位、数字格式等

前言:yu.to是一个快速处理对象数据,数组数据的简单库,直接支持es5,同时也支持es6,支持功能拓展,扁平化,无嵌套的配置,容易上手和使用。

一、快速上手

安装
npm install --save yu.to
使用

主要应对分页数据的快速处理

var to = require('yu.to')

var response = {
    'currentPage': 1,
    'pageSize': 10,
    'totalNum': 3,
    'data': [
        {
            'id': 21,
            'userRemark': null,
            'receiverPhone': '16657100261',
            'receiver': '杜乐平',
            'status': 1,
            'type': '0',
            'dispatchTime': null,
            'createTime': 1560506022000,
            'updateTime': 1560506022000,
            'productOrders': [
                {
                    'id': 63,
                    'productName': '华为华为',
                    'unitPrice': 10,
                    'quantity': 1,
                    'type': 'ORDER',
                    'status': 'SUCCESS',
                }
            ]
        }
    ]
}

to(response.data, {
    userRemark: 'default',
    receiver: 'prepend:姓名:',
    status: 'copy:statusLabel',
    statusLabel: 'enum:失败,成功',
    dispatchTime: 'date',
    createTime: 'date:yyyy-MM-dd',
    updateTime: 'date',
    'productOrders.unitPrice': 'append:元',
    'productOrders.type': 'compare:ORDER',
    'productOrders.status': 'compare:SUCCESS?成功:失败',
})

console.log(response.data)

// ************* 处理后输出结果 *************

/*
  [
    { id: 21,
       userRemark: '/',
       receiverPhone: '16657100261',
       receiver: '姓名:杜乐平',
       status: 1,
       type: '0',
       dispatchTime: '/',
       createTime: '2019-06-14',
       updateTime: '2019-06-14 17:53:42',
       productOrders: [
           {
             id: 63,
             productName: '华为华为',
             unitPrice: '10元',
             quantity: 1,
             type: true,
             status: '成功',
           }
       ],
       statusLabel: '成功'
    }
   ]
*/

二、配置参数

配置 配置说明 参数 默认参数 备注
rename 重命名属性 重命名后的名称 - 参数必填,原属性删除
copy 复制属性 复制后的名称 - 参数必填,原属性保留
default 设置默认值 默认字符串 '/' -
string 转成字符串 - - -
number 转成数字 - - -
boolean 转成布尔值 - - -
date 时间戳转日期 时间转换格式 yyyy-MM-dd hh:mm:ss.SSS yyyy-MM-dd hh:mm:ss 时间戳为null时,返回默认字符串'/'
timestamp 日期转时间戳 时间转换格式 yyyy-MM-dd hh:mm:ss.SSS yyyy-MM-dd hh:mm:ss 日期为null时,返回默认字符串'/'
compare 比较判断得布尔值或字符串 比较的字符串或比较的字符加三元运算的值 - -
prepend 在内容前添加字符串 字符串 - -
append 在内容后添加字符串 字符串 - -
enum 数组枚举转换 以','分隔的字符串 - 参数必填
mapping 对象枚举转换 以'&'和','分隔的字符串 - 参数必填
array 字符串转数组 分隔符号 逗号',' -

三、使用示例

重命名属性
 var obj = { name: 'mack' }
 to(obj, {
   name: 'rename:myname',
 })
// {myname: 'mack'}
基础类型转换
var obj = {
  age: 23,
  money: '123.23',
  love: 'yes',
}

to(obj, {
  age: 'string',
  money: 'number',
  love: 'boolean'
})

// { age:'23', money: 123.23, love: true }
时间戳转日期
var obj = {
  birthday: 1560827789638,
  createdAt: 1560827789638
}
to(obj, {
  birthday: 'date',
  createdAt: 'date:yyyy-MM-dd'
})

// {birthday: '2019-06-18 11:16:29', createdAt: '2019-06-18'}
比较判断,得到布尔值或赋值
var obj = {
  status: 'SUCCESS',
  type: 'order',
}
to(obj, {
  status: 'compare:SUCCESS',
  type: 'compare:order?交易:购买',
})

// {status: true, type: '交易'}
日期转时间戳
var obj = {
  birthday: '2019-06-18 11:16:29',
  createdAt: '2019-06-18'
}
to(obj, {
  birthday: 'timestamp',
  createdAt: 'timestamp:yyyy-MM-dd'
})

// {birthday: 1560827789000, createdAt: 1560787200000}
在内容前添加字符串
var obj = {
  name: '王小明',
}
to(obj, {
  name: 'prepend:姓名:',
})

// {name: '姓名:王小明'}
在内容后添加字符串
var obj = {
  money: 3.25,
}
to(obj, {
  money: 'append:元',
})

// {money: '3.25元'}
枚举转换
var obj = {
  status: 1,  // 0 不健康 1 健康
}
to(obj, {
  status: 'enum:不健康,健康',
})

// {status: '健康'}
枚举对象转换
 var obj = {
   status: 'health',  // 0 不健康 1 健康
 }
 to(obj, {
   status: {mapping: 'unHealth:不健康,health:健康'},
 })

// {status: '健康'}
属性复制
var obj = {
  status: 1,  // 0 不健康 1 健康
}
to(obj, {
  status: 'copy:statusLabel',
})

// {status: 1, statusLabel: 1}
属性复制后,再枚举
var obj = {
  status: 1,  // 0 不健康 1 健康
}
to(obj, {
  status: 'copy:statusLabel',
  statusLabel: 'enum:不健康,健康',
})

// {status: 1, statusLabel:'健康'}
字符串转数组
var obj = {
  words: 'a,b,c',
  words2: 'a|b|c'
}
to(obj, {
  words: 'array',
  words2: 'array:|',
})

// ['a','b','c']  ['a','b','c'] 

null转默认值

var obj = {
  words: null,
  words2: null,
}
to(obj, {
  words: 'default',
  words2: 'default:-',
})
// {words: '/', words2: '-'}
处理数组对象

可无视数组,直接把数组当作对象处理(内部会自动判断并循环处理)

var objArray = [
  {
    name: 'mack',
    age: 23,
    birthday: 1560827789638,
    status: 1,  // 0 不健康 1 健康
  },
  {
    name: 'cindy',
    age: 21,
    birthday: 1560827789638,
    status: 0,  // 0 不健康 1 健康
  },
]

to(objArray, {
  status: 'enum:不健康,健康',
})

// expect(objArray[0].status).toBe('健康')
// expect(objArray[1].status).toBe('不健康')

四、多层嵌套属性,多层属性数组处理

多层嵌套属性
var obj = {
  father: {
    child: {
      name: 'tom'
    }
  }
}
to(obj, {
  'father.child.name': 'rename:myname',
})

/*
{
  father: {
    child: {
      myname: 'tom'
    }
  }
}
*/
多层属性数组处理

直接将数组视为一个对象处理,内部会自动判断是否为数组并循环处理

var obj = {
  father: {
    child: {
      family: [
        { name: 'tom', status: 1},
        { name: 'cindy', status: 1},
        { name: 'bob', status: 0},
      ]
    }
  }
}
to(obj, {
  'father.child.family.status': {enum: '健康,不健康'},
})

// obj.father.child.family[1].status === '不健康'
option支持函数重点功能
var obj = {
    myname: 'mack',
}
to(obj, {
    myname: function (source) {
        return source + ' wang'
    }
})
expect(obj.myname).toBe('mack wang')

五、自定义拓展配置参数

多次调用 to.extend() 方法会以merge的形式合并拓展配置参数

to.extend({
  addOne: function (source, key, configValue) {
    source[key] = Number(source[key]) + 1
  }
})
var obj = {
  status: '1',
}
to(obj, {
  status: 'addOne'
}

// {status: 2}

六、配置参数数组

注意:如果配置参数是一个数组,则他只会作用于当前的属性,会按配置参数数组中的顺序处理

var obj = {
  status: 1,  // 0 不健康 1 健康
}
to(obj, {
  status: [{copy: 'statusLabel'}, {enum: ['不健康', '健康']}]
}

expect(obj.status).toBe('健康')

七、配置参数支持多种数据类型

字符串型单个配置(最简单的使用)
var obj = { status: 1 }
to(obj, 'status:string') 
// {status: '1'}
字符串型配置(以&符号分隔)
var obj = { status: 1 }
to(obj, 'status:rename:statusLabel&statusLabel:enum:不健康,健康') 
// {statusLabel: '健康'}

没有值的,一律不支持对象型配置,比如string,number,boolean

对象型单个配置(值为字符串)
var obj = { status: 1 }
to(obj, {
  status: 'enum:不健康,健康'
})
// {status: '健康'}
对象型多个配置(值为字符串)
var obj = { status: 1 }
to(obj, {
  status: 'rename:statusLabel',
  statusLabel: 'enum:不健康,健康'
})
// {statusLabel:'健康'}
对象型单个配置(值为对象,值的值为字符串)
var obj = { status: 1 }
to(obj, {
  status: {enum: '不健康,健康'}
})
// {status: '健康'}
对象型多个配置(值为对象,值的值为字符串)
 var obj = { status: 1 }
 to(obj, {
   status: {rename: 'statusLabel'},
   statusLabel: {enum: '不健康,健康'}
 })
// {statusLabel: '健康'}
对象型单个配置(值为对象,值的值为对象)
var obj = { status: 'health' }
to(obj, {
  status: {mapping: {unHealth: '不健康', health: '健康'}},
})
// {status: '健康'}
对象型单个配置(值为对象,值的值为对象,值有多个属性)
var obj = {
    status: 1,  // 0 不健康 1 健康
}
to(obj, {
    status: {copy: 'statusLabel', enum: '不健康,健康'},
})
expect(obj.statusLabel).toBe(1)
expect(obj.status).toBe('健康')

对象型多个配置(值为对象,值的值为对象)
var obj = { status: 'health' }
to(obj, {
  status: {rename: 'statusLabel'},
  statusLabel: {mapping: {unHealth: '不健康', health: '健康'}},
})
// {statusLabel: '健康'}

开发日志

2019.07.12 v1.0.2

  1. update: 增加option对函数的支持,和对象参数允许有多个属性
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,425评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,058评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,186评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,848评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,249评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,554评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,830评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,536评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,239评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,505评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,004评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,346评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,999评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,060评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,821评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,574评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,480评论 2 267

推荐阅读更多精彩内容

  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 10,499评论 6 13
  • 第5章 引用类型(返回首页) 本章内容 使用对象 创建并操作数组 理解基本的JavaScript类型 使用基本类型...
    大学一百阅读 3,151评论 0 4
  • 概要 64学时 3.5学分 章节安排 电子商务网站概况 HTML5+CSS3 JavaScript Node 电子...
    阿啊阿吖丁阅读 8,618评论 0 3
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,034评论 1 32
  • HTML 5 HTML5概述 因特网上的信息是以网页的形式展示给用户的,因此网页是网络信息传递的载体。网页文件是用...
    阿啊阿吖丁阅读 3,360评论 0 0