javascript - 函数内存在多个 'includes'

标签 javascript reactjs ecmascript-6

我正在寻找一种方法来访问对象内的“fit”和“gif”键。现在,我只能在页面上显示其中一个 - “fit”是图像,“gif”是 gif。

我想我可能可以使用 .match 但我不太确定正确的语法

谢谢

const sizeMappings = {
master: '1280',
  small: '192w',
  small_fit: '192w',
  medium: '384w',
  medium_low_res: '288w',
  medium_fit: '384w',
  medium_gif: '384w',
  medium_fit_low_res: '288w',
  large: '768w',
  large_fit: '768w',
  large_gif: '768w',
  xlarge: '1280w',
  xlarge_fit: '1280w',
}

const getSrcSet = (renditions, fit, gif) => {
  const sizes = Object.keys(sizeMappings)
    .map((key) => {
      if (fit && !key.includes('fit')) return null
      const mapping = `${renditions[key]} ${sizeMappings[key]}`
      return mapping
    })

  return sizes
    .filter(el => el !== null)
    .join(',')
}

最佳答案

我会使用 filter() 而不是 map() 因为您实际上希望提取数组的子集。然后,只需将每个键匹配给定的尺寸名称 + "_gif" 或尺寸名称 + "_fit"

const sizeMappings = {
  master: '1280',
  small: '192w',
  small_fit: '192w',
  medium: '384w',
  medium_low_res: '288w',
  medium_fit: '384w',
  medium_gif: '384w',
  medium_fit_low_res: '288w',
  large: '768w',
  large_fit: '768w',
  large_gif: '768w',
  xlarge: '1280w',
  xlarge_fit: '1280w',
}

let size = "large";  //change me

let arr = Object.keys(sizeMappings).filter(
  (key) => (key === size + "_fit" || key === size + "_gif")
);

console.log(arr)

关于javascript - 函数内存在多个 'includes',我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46215004/

相关文章:

javascript - React 应用程序无法在 safari 浏览器中运行?语法错误

reactjs - react 导航全局 FAB

javascript - Symbol数据类型的应用

javascript - 无法在 Nodejs Express 中将类作为函数调用

javascript - Phaser.js 在 forEach 循环期间删除组中的对象

javascript - Jquery/javascript : Select all the selected values from drop down

javascript - 帮助 JS setInterval,有时会很疯狂!

javascript - 有人可以解释 createStore 函数以及如何将计数器函数传递给它才能使它了解状态吗?

javascript - .val() 四舍五入?

javascript - 如何创建函数过滤器 reactjs?