首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

格式化js对象的长数组,将日期与数字、颜色与月份、日期与数字以及各自的颜色分隔开

,可以通过以下步骤实现:

  1. 遍历数组中的每个对象。
  2. 根据对象的属性类型进行分类,将日期与数字、颜色与月份分别存放在不同的数组中。
  3. 对日期与数字数组进行排序,可以使用JavaScript的sort()方法。
  4. 对颜色与月份数组进行排序,可以使用JavaScript的sort()方法。
  5. 将排序后的日期与数字数组和颜色与月份数组合并为一个新的数组。
  6. 根据新数组中的元素类型,将日期与数字、颜色与月份以及各自的颜色分隔开。
  7. 最后得到格式化后的数组。

以下是一个示例代码:

代码语言:txt
复制
// 假设原始数组为data
var data = [
  { value: 10, type: 'number' },
  { value: 'blue', type: 'color' },
  { value: '2022-01-01', type: 'date' },
  { value: 'red', type: 'color' },
  { value: 20, type: 'number' },
  { value: '2022-02-01', type: 'date' },
];

// 分类存放日期与数字、颜色与月份
var dateAndNumber = [];
var colorAndMonth = [];

data.forEach(function(obj) {
  if (obj.type === 'date' || obj.type === 'number') {
    dateAndNumber.push(obj.value);
  } else if (obj.type === 'color' || obj.type === 'month') {
    colorAndMonth.push(obj.value);
  }
});

// 对日期与数字数组进行排序
dateAndNumber.sort();

// 对颜色与月份数组进行排序
colorAndMonth.sort();

// 合并排序后的数组
var formattedArray = dateAndNumber.concat(colorAndMonth);

// 根据元素类型分隔开
var separatedArray = [];
var currentDateAndNumber = [];
var currentColorAndMonth = [];

formattedArray.forEach(function(value) {
  if (typeof value === 'number' || !isNaN(Date.parse(value))) {
    currentDateAndNumber.push(value);
  } else {
    currentColorAndMonth.push(value);
  }
});

separatedArray.push(currentDateAndNumber);
separatedArray.push(currentColorAndMonth);

console.log(separatedArray);

这样,separatedArray就是格式化后的数组,其中包含了按照日期与数字、颜色与月份以及各自的颜色分隔开的元素。

关于腾讯云相关产品和产品介绍链接地址,由于要求不能提及具体的云计算品牌商,无法给出相关链接。但腾讯云提供了丰富的云计算服务,可以根据具体需求在腾讯云官网上查找相关产品和文档。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

《Ext JS模板与组件基本知识框架图----模板》

最近在整理Ext JS的模板和组件,在参考《Ext JS权威指南》,《Ext JS Web应用程序开发指南》,《Ext JS API》等相关书籍后才写下这篇《Ext JS模板与组件基本知识思维导图》,由于篇幅较长...想要《Ext JS模板与组件基本知识思维导图》原文档的可以与我联系。...一.模板概述{1.什么是模板(HTML片段,占位符)2.为什么会用到模板(统一的渲染管道)3.Ext JS中模板有哪些,怎么分的?...) 8.isLeapYear (返回指定日期中其年份的周数) 9.getFirstDayOfMonth(返回指定日期中其月份第一天是星期几,返回值为0到6中的数字,0便是星期日)...10.getLastDayOfMonth (返回指定日期中其月份最后一天是星期几,返回0到6中数字,0表示星期日) 11.getFirstDateOfMonth (返回指定日期中返回月份第一天的日期值

3.2K20

如何打造属于自己的Javascript武器库

前言 代码写的久了,就会发现很多时候都是在写一些重复的东西,这个时候就应该要考虑到提高工作效率了,比如对常用方法的封装,例如日期格式化,浏览器类型判断等。...判断操作系统类型 任意对象的深度克隆 对象的克隆是一个很常见的方法,在jQuery和AngularJS等常用框架中都有封装,那么我们也可以自己用原生JS去封装下。...其中对日期Date类型和数组Array类型以及Object对象类型分别用不同的方法处理,最后封装的方法如下。...随机数字 随机颜色 有的时候我们会看到这样一个场景,在页面点击,会随机改变页面的背景色,让人觉得很炫酷,其实就是随机生成了颜色的效果。...随机颜色 数字转化为中文大写金额 在有的与金额有关的系统中,需要显示到中文大写版,但是在实际运算时,一般都是使用数字的,这就需要一种封装的方法去将数字转化为中文大写。

1.5K90
  • 实践-小细节 Ⅰ

    alloc] init]; // 为日期格式器设置格式字符串 [dateFormatter setDateFormat:@"yyyy年MM月dd日 HH:mm +0800"]; // 使用日期格式器格式化日期...我们可以分别在父类以及本类中定义各自的context字符串,比如在本类中定义context为@"ThisIsMyKVOContextNotSuper";然后在dealloc中remove observer...当内容大小超出了当前的Frame  就可以滚动。 UITextField  无法设置多行输入 8.日期格式的设置细节(不带0) d  将日显示为不带前导零的数字(如 1)。...EEEE  将日显示为全名(例如 Sunday)。 M  将月份显示为不带前导零的数字(如一月表示为 1)。如果这是用户定义的数字格式中的唯一字符,请使用 %M。...MM  将月份显示为带前导零的数字(例如 01/12/01)。 MMM   将月份显示为缩写形式(例如 Jan)。 MMMM 将月份显示为完整月份名(例如 January)。

    1.6K20

    jQuery日历价格、库存设置Web组件2,前后台适用,可自定义字段及颜色风格

    /build/calendar-price-jquery.min.js"> // 以下mockData是模拟JSON数据,一般情况是从后端(服务器端)获取 // 对象中...startDate: 2017-06-20 (可选),开始日期。可设置数据的开始日期,该日期以前的月份将不能设置或操作,支持某月2017-06或某天。...日历中可设置数据的结束日期,该日期以后的月份将不能显示或操作,同startDate,支持某月(默认去该月最后一天)或某天。若未配置此项,系统默认为1年后的今日,即日期范围为1年。...config: array (必须),与data中的数据参数(属性)对应,该配置里的配置项,即可设置的参数字段,key 为需要设置的字段,name为输入框前面显示的名称。...show: array (可选), 日历中需要显示的参数(属性),与data中的数据参数(属性)对应。key 为需要设置的字段名,name为显示在日历中的名称(简称)。

    2.9K50

    jQuery日历价格、库存设置Web组件2,前后台适用,可自定义字段及颜色风格

    /build/calendar-price-jquery.min.js"> // 以下mockData是模拟JSON数据,一般情况是从后端(服务器端)获取 // 对象中...startDate: 2017-06-20 (可选),开始日期。可设置数据的开始日期,该日期以前的月份将不能设置或操作,支持某月2017-06或某天。...日历中可设置数据的结束日期,该日期以后的月份将不能显示或操作,同startDate,支持某月(默认去该月最后一天)或某天。若未配置此项,系统默认为1年后的今日,即日期范围为1年。...config: array (必须),与data中的数据参数(属性)对应,该配置里的配置项,即可设置的参数字段,key 为需要设置的字段,name为输入框前面显示的名称。...show: array (可选), 日历中需要显示的参数(属性),与data中的数据参数(属性)对应。key 为需要设置的字段名,name为显示在日历中的名称(简称)。

    2.2K30

    【Hybrid开发高级系列】ReactNative(七) —— RN组件专题

    当用户更改了UI的日期或时间时,它就会被调用。第一个也是唯一一个参数是一个Date对象,代表了新的日期和时间。    ...此属性需要一个对象数组,其中每个对象具有以下键:     • title :必要的,这个操作的标题     • icon :这个操作的图标,例如:require('image!...titleColor string         设置工具栏副标题的颜色。 2.5 ToastAndroid         它揭示了如何将本地ToastAndroid模块作为一个JS模块。...对象有所有的导航方法,以及一些实用程序:     • parentNavigator         ——父导航对象的参考,在props.navigator中被传递     • onWillFocus...这个例子创建了一个视图,将两个 颜色的框和自定义的组件打包填充成一行。

    58440

    JavaScript的使用前言

    3、js的变量: js中用var声明变量,取分大小写。变量的命名需遵循如下规则:     (1)变量必须使用字母、下划线_或者美元符$开始。     ...,和Java中的带参方法一样,多个参数用逗号隔开。...接下来看看js提供了哪些内置对象: 1、Date日期对象: 定义日期对象:var date = new Date(),也可以带参数定义:var date = new Date(2018,9,23)...4、Array数组对象: (1)、一维数组: js中的数组存储的数据可以是任何类型(数字、字符、布尔值等),定义数组方式如下: var myarr=new Array(); //定义数组 myarr...总结: JavaScript十分强大,且使用广泛,几乎所有的web应用都会用到JavaScript。重点要理解DOM以及对DOM的一些操作。

    2.6K20

    使用moment格式化日期

    我们日常开发中最常用的是格式化时间,下面我把常用的格式制作成表格说明供有需要的朋友查看 格式代码 说明 返回值例子 M 数字表示的月份,没有前导零 1到12 MM 数字表示的月份,有前导零 01到12...MMM 三个字母缩写表示的月份 Jan到Dec MMMM 月份,完整的文本格式 January到December Q 季度 1到4 D 月份中的第几天,没有前导零 1到31 DD 月份中的第几天,有前导零...mm 有前导零的分钟数 00到59 s 没有前导零的秒数 1到59 ss 有前导零的描述 01到59 X Unix时间戳 1411572969 ---- Moment.js 写法示例 Moment.js...0 到 59 moment().minute() //获得 分 moment().minute(Number) //设置 分。...moment().add(7, 'd')// 与上面一行代码的运行结果一样。

    3.1K20

    Spread for Windows Forms高级主题(2)---理解单元格类型

    对象层次 Spread控件中的对象,例如表单、行和单元格等,有很多格式和其他的属性继承自它的 “父母”。一个单元格可以从一个表单中继承格式,例如背景颜色。...你在日历中选择的日期(或者在时钟中选择的时间)被放置在日期时间单元格中。如果你想要显示日期与时间,你可以在日历控制中点击“Today”;如果你想要显示时间,你可以在时钟控制里点击“Now”。...弹出日历控件 弹出时钟控件 你可以指定日期和月份的常规名称和缩写名称,并且可以指定控件底部按钮的文本。...下面的示例代码设置按钮的文本,并且在数组列表中指定日期和月份的名称。...例如,在日期时间单元格中,你可能想要禁止弹出的日历控件; 在数字单元格中你可能想要禁止弹出的计算器控件。

    2.5K80

    魔改react-calendar还原UI设计中的打卡日历效果

    , 周二, 周三, 转换为一, 二, 三 日期的话只需要数字即可 数字下方需要显示打卡状态 , [绿色:已打卡] , [黄色:请假], [红色:未打卡] 当天日期的背景颜色需要高亮显示 日历可以进行一个展开...icon + 年月份 + 打卡数量, 右边则是上个月和下个月的button....locale: 当前的区域设置(例如 en-US、zh-CN 等),决定了日期格式的语言和地区规则。 date: 当前的日期对象,代表一周中的某一天。...大概就是做了 格式化日期 比对MocK的数据日期的状态, 如果是completed, 就设置指示状态的背景颜色为 绿色 如果是missed, 就设置指示状态的背景颜色为 红色...如果是leave, 就设置指示状态的背景颜色为 黄色 比对当天的日期, 对当天的日期进行一个背景颜色的高亮 最后将这些上面格式化之后的数据进行一个数据填入, 最后将这个dom结构进行return

    23010

    JavaScript学习参考结构

    } 注:主动跑出异常 throw Error('xxxx') JS对象 数字Number 对象方法 方法 描述 toString 把数字转换为字符串,使用指定的基数。...toExponential 把对象的值转换为指数计数法。 toPrecision 把数字格式化为指定的长度。 valueOf 返回一个 Number 对象的基本数字值。...setMonth() 设置 Date 对象中月份 (0 ~ 11)。 setFullYear() 设置 Date 对象中的年份(四位数字)。...setUTCMonth() 根据世界时设置 Date 对象中的月份 (0 ~ 11)。 setUTCFullYear() 根据世界时设置 Date 对象中的年份(四位数字)。...语法:prompt("文本","默认值") ajax获取数据 json格式化到js能接收的数据 js处理处理数据(dom、bom、事件) 提交数据流程反过来 参考 timing http://www.w3school.com.cn

    2K20

    HTML、CSS、JavaScript学习总结

    alink 超链接点选但未被放开的颜色 • vlink 超链接已被点选过的颜色 插入并格式化图像 B 标签:用于在网页中插入图像内容。...• rules常见属性 规定水平或垂直的分界线。 注释:必须与 “border” 属性配合使用! 定义表格列的分组。通过此元素,您可以对列进行组合以便进行格式化。...|长度|关键字 利用百分比和长度设置图片位置时,都要指定两个值,并且这两个值要用空格隔开。...其实,在函数中有一个参数数组对象(arguments),该对象将传递的参数都封装在一个数组中。 例: function demo()//定义函数。...对象有setxxx( )方法用于设置日期和时间,getxxx( )方法用于获得日期和时间 Window 对象 • 窗口对象window是浏览器网页的文档对象模型结构中的最高级的对象,只要网页的html标记中包含有

    3.2K20

    Telerik RadControls for ASP.NET AJAX

    可定制的日矩阵-程序员可以完全地控制日矩阵,因为在7X6模式下尚未硬编码。 通过设置FirstDayOfWeek 以及日x行矩阵,您可以对月视图中的行/列数进行格式化。...对System.Globalization 命名空间的支持 –全球化命名空间由一些包含与文化相关的信息的类组成,例如语言、国家/地区、所采用的日历、日期的格式、货币、数字以及字串的排序等。...先进的坐标轴标签处理 –RadChart现在允许您将时间、日期、货币、科学计数值、百分比等作为坐标轴的标签显示。 您还可以旋转坐标轴的标签,改变其颜色、字体、最小值和最大值等。...为数值定制数值格式 –允许对项目的值进行定制的格式化—即货币、小数、科学计数值、千位分隔符、特殊格式等 标题和图例的位置-图表标题和图例可以在图表区域的内部和外部进行对接,从而指定对齐方式和与空白处的距离...您也可以通过设置个别样式,将皮肤的某些特性覆盖: 对于整个对象、标题条和grips(可对接对象) 对于高亮显示、边框和背景(对接区) 高亮区 –在可对接对象要与对接区对接时,对接区内对象象将要放置的位置将呈高亮状态

    2.4K00

    JavaScript第七节

    内置对象 JS内置对象就是指Javascript自带的一些对象,供开发者使用,这些对象提供了一些常用的的功能。...年、月、日…… var date = new Date(2017, 2, 22, 0, 52, 34);月份从0开始 日期格式化(了解) date.toLocalString();//本地风格的日期格式...> 数组对象在javascript中非常的常用 + 数组转换(★)--- **join** ```javascript //语法:array.join(分隔符) //作用:将数组的值拼接成字符串.../将学生数组按照年龄从大到小排列 var arr = [18,34,21,20,66]; 数组的拼接与截取 //1. concat:数组合并,不会影响原来的数组,会返回一个新数组。...Number对象 Number对象是数字的包装类型,数字可以直接使用这些方法 toFixed(2)//保留2位小数 toString();//转换成字符串 Boolean对象 Boolean对象是布尔类型的包装类型

    94120

    Shell脚本常用命令一览

    #用法:     bash [GNU 长选项] [选项] ... bash [GNU 长选项] [选项] 脚本文件 ......: movie[0]=ip && movie[1]=tcp echo ${movie[n]} # 单个数字的数组 echo ${movie[*]} # 显示数组中的全部内容 #示例7.Check...WeiyiGeek.sleep cal 命令 - 显示系统日历 描述: cal命令即(calendar)列出指定日期的月份年与日及其周几; 基础示例: # (1) 显示目前这个月份的月历,连同今日处会有反白的显示...-d :显示字符串所指的日期与时间 -s :根据字符串来设置日期与时间。...:十进制表示的月份(01~12) %d:十进制表示的每月的第几天 = %e:在两字符域中,十进制表示的每月的第几天 %C:年份的前两位数字 %g:年份的后两位数字,使用基于周的年=%y:不带世纪的十进制年份

    2K41

    Flutter Utils 全网最齐全的工具类

    用于组件之间通信 CalculateUtils 计算文本的宽,高 ColorUtils 主要是将RGB/ARGB转化为16进制字符串颜色或者Color DateFormats 常见中文,英文的日期时间转化的格式...json之间转化等 get_it spi接口实现,将接口(抽象基类)与具体实现分离和解耦合 LogUtils 日志工具类,设置日志开关,长度,以及可以过滤标签,打印5种类型日志 NumUtils Num...主要是将RGB或者ARGB颜色转化为Color对象,16进制颜色字符串等等。...: 将#FF6325颜色或者#50A357D6转化为16进制的Color colorString : 将color颜色转变为字符串 colorString...主要是获取当前日期,按指定格式格式化时间,以及多种格式化日期工具方法getNowDateTime : 获取当前日期返回DateTime getYesterday

    3.5K00

    由浅入深,走进中级工程师都未必知道的 JavaScript 时间处理冷知识

    1 背景与基本概念 在过去,世界各地都各自订定当地时间,例如我国古代将一昼夜分为十二时辰,每一时辰相当于现代的两个小时。但随着交通和通信的发达,各地交流日益频繁,不同的地方时间给人们造成了许多困扰。...2.3 两种国际时间标准:ISO8601 与 RFC2822 ISO8601,全称为《数据存储和交换形式·信息交换·日期和时间的表示方法》,规定了国际标准日期与时间表示法。 只使用数字为基本格式。...使用短横线"-"间隔开年、月、日为扩展格式。 每个日期和时间值都有一个固定的位数,必须用前导零填充。...RFC 2822 包括星期几(短)、数字日期、月份的三字母缩写、年、时间和时区,显示为 Wed 01 Jun 2016 14:31:46 -0700 3 前端中的时间表示 后端一般返回的是时间的秒数或毫秒数...3.2.2 包体积过大 因为 Momnet.js 将全部的功能和所有支持的语言都打到一个包里,包的大小也是到了 280.9 kB 这样一个夸张的数字,而且对于 Tree shaking 无效。

    2.2K10
    领券