Js Design pattern problem

export const typeMarry = (type) => {
  const charts = ["pie","bar","line"],
        text = ["normalText","multText"],
        media = ["file","picture","music","video"]
  if(charts.indexOf(type) !== -1) {
    return "CHARTS"
  }
  if(text.indexOf(type) !== -1) {
    return "TEXT"
  }
  if(media.indexOf(type) !== -1) {
    return "MEDIA"
  }
}

how is this method rewritten into maintainable overwriting, similar to policy mode?


For

extension, you only need to modify types

.
const types = {
  'CHARTS':['pie','bar','line'],
  'TEXT':['normalText','multText'],
  'MEDIA':['file','picture','music','video'],
}

export const typeMarry = (type) => {
   for(var k in types)
     if(types[k].includes(type))
       return k;
}

function isCharts (type) {
  return ['pie','bar','line'].includes(type) ? 'CHARTS' : false
}

function isText (type) {
  return ['normalText','multText'].includes(type) ? 'TEXT' : false
}

function isMedia (type) {
  return ['file','picture','music','video'].includes(type) ? 'MEDIA' : false
}

const typefun = [isCharts, isText, isMedia]

export const typeMarry = (type) => {
  for (let i = 0, len = typefun.length; i < len; iPP) {
    let cur = typefun[i](type)
    if (cur) return cur
  }
}

just return to the component instance, and there is nothing to optimize without more code.

  • How to better organize the code?

    with pictures this is a code to obtain order data. Function and method bindings are basically click events bound in html , as well as drop-down refresh functions. How to better organize the code structure for easy maintenance and module mode? I...

Menu