代码之家 › 专栏 › 技术社区 › user3142695

如何用包含递增字符串化数字的对象填充数组?

ecmascript-6 javascript

user3142695 · 技术社区 · 7 年前

我需要生成一个对象数组,它有三个键,字符串值从1到31。字符串应该有两个字符,这意味着1-9应该在前面得到一个0。

const days = [
  { key: '01', value: '01', text: '01' },
  { key: '02', value: '02', text: '02' },
  { key: '03', value: '03', text: '03' },
  ...
  { key: '30', value: '30', text: '30' },
  { key: '31', value: '31', text: '31' }
]

我认为应该做的更短更聪明,然后我提出的解决方案:

const days = Array.from({ length: 31 }, (v, k) => {
  return { 
    key: k > 10 ? (k + 1).toString() : '0' + (k + 1),
    value: k > 10 ? (k + 1).toString() : '0' + (k + 1),
    text: k > 10 ? (k + 1).toString() : '0' + (k + 1)
  }
})

如果我不从值1开始怎么办?例如,从1950年到现在的同一个数组(顺序相反):

const years = [
  { key: '2018', value: '2018', text: '2018' },
  ...
  { key: '1950', value: '1950', text: '1950' }
]

3 回复 | 直到 7 年前

Eddie 7 年前

简单点,你可以用 padStart()

const days = Array.from({length: 31}, (v, k) => {
  let o = (k + 1).toString().padStart(2, '0');
  return {key: o,value: o,text: o}
});

console.log(days);

对于年份,使用相同的结构,但不添加1,而是添加开始年份。

const years = Array.from({length: 20}, (v, k) => {
  let o = (k + 2000);
  return {key: o,value: o,text: o}
});

console.log(years);

文件: padStart()

T.J. Crowder 7 年前

我觉得应该做得更短更聪明…

嗯,你当然可以少说几句:

const days = Array.from({ length: 31 }, (v, k) => {
  const value = k > 10 ? (k + 1).toString() : '0' + (k + 1);
  return { 
    key: value,
    value,
    text: value
  };
});

现场示例:

const days = Array.from({ length: 31 }, (v, k) => {
  const value = k > 10 ? (k + 1).toString() : '0' + (k + 1);
  return { 
    key: value,
    value,
    text: value
  };
});
console.log(days);

.as-console-wrapper {
  max-height: 100% !important;
}

如果我不从值1开始怎么办?

只需添加您想要的值:

const startYear = 2018;
const years = Array.from({ length: 5 }, (v, k) => {
  const value = String(k + startYear);
  return { 
    key: value,
    value,
    text: value
  };
});

现场示例:

const startYear = 2018;
const years = Array.from({ length: 5 }, (v, k) => {
  const value = String(k + startYear);
  return { 
    key: value,
    value,
    text: value
  };
});
console.log(years);

.作为控制台包装{
最大高度:100%!重要事项;
}

当然,如果需要可重用的东西,可以将其包装在函数中。

Slai 7 年前

const days = Array.from({ length: 31 }, (v, i) => 
  ({ key: v = (++i > 9 ? '' : '0') + i, value: v, text: v }) );

const years = Array.from({ length: 2018 - 1950 + 1 }, (v, i) => 
  ({ key: v = 2018 - i + '', value: v, text: v }) );

console.log( JSON.stringify( days  ).replace(/},/g, '},\n ') );
console.log( JSON.stringify( years ).replace(/},/g, '},\n ') );

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

7 月前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

7 月前

Alex · 在轻量级中同时解构和不解构变量

7 月前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

7 月前

bairog · 从按属性筛选的对象数组字典中创建值数组

7 月前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

7 月前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

7 月前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

8 月前

user3472810 · Angular@Output/EventEmitter返回undefined

8 月前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

8 月前