>  기사  >  웹 프론트엔드  >  JavaScript 복합 판단 논리 작성 기술

JavaScript 복합 판단 논리 작성 기술

不言
不言앞으로
2019-03-05 14:25:082503검색

이 기사의 내용은 JavaScript의 복잡한 판단 논리 작성 기술에 관한 것입니다. 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.

일부 시나리오에서는 여러 판단 조건이 발생할 수 있습니다. 이 경우 일반적으로 if/else/switch를 사용하여 처리하지만, 여러 판단에서 이 작성 방법에는 많은 코드가 있으며 이를 해결하는 방법은 다음과 같습니다. 계속 읽어주세요

우선 if/esle을 예로 들어보겠습니다. 스위치 메소드는 다시 쓰지 않겠습니다

checkStatus(status) {
 if (status == 1) {
    function1();
  } else if (status == 2) {
    function2();
  } else if (status == 3) {
    function3();
  } else if (status == 4) {
    function4();
  } else if (status == 5) {
    function5();
  }
}

상태를 다르게 판단하여 다른 메소드를 실행하는 방식입니다. 단점은 코드의 양이 많아 가독성에 도움이 되지 않는다는 점입니다. 다른 사람들이 이를 유지관리하러 왔을 때 이 메소드에 얼마나 많은 판단 조건이 있는지, 얼마나 많은 메소드를 호출해야 하는지 빨리 알 수 없습니다. 이를 알기 위해서는 전체 방법을 읽어야 합니다. 다음은 좀 더 최적화된 방법입니다. 이 기사에서는 vue 작성 방법

const actions = {
  '1': 'function1',
  '2': 'function2',
  '3': 'function3',
  '4': 'function4',
  '5': 'function5'
 }
 function checkStatus(status) {
   let action = actions[status];
  this[action]()
 }

에 중점을 둡니다. 이 작성 방법은 호출 시 속성 이름을 통해 해당 속성 값을 찾아 호출합니다. 해당 방법. 작성 방법은 간단하고 명확합니다. 확장 프로그램에서 유형이 1일 때 두 개 이상의 메소드를 호출해야 하는 경우 아래를 참조하세요.

const actions = {
 '1': ['function1','function2'],
 '2': ['function3','function4'],
 '3': ['function5','function6'],
}

유형이 1일 때 호출해야 하는 메소드를 배열에 작성한 다음 You를 호출합니다. 다음과 같이 사용할 수 있습니다:

function checkStatus(status) {
  let action = actions[status];
   this[action[0]]()
  this[action[1]]()
 }

위의 두 가지 방법은 1위안 판단을 내릴 때 사용됩니다. 구체적인 용도는 특정 시나리오에 따라 다릅니다.
복수판결이라면? 예를 들어 상태를 1로 판단할 때 유형 값이 1인지 여부도 판단해야 합니다. . .
조건은

if (status == 1 && type == 1) {
    //do someThing
} else if (status == 2 && type == 2) {
   //do someThing
} else if (status == 3 && type == 3) {
   //do someThing
} else if (status == 4 && type == 4) {
   //do someThing
} else if (status == 5 && type == 5) {
   //do someThing
}
에 해당합니다

이 비즈니스 시나리오에서 전통적인 if/else를 사용하면 코드의 양이 상상을 초월합니다. 다음으로 이 상황을 최적화하는 방법을 살펴보겠습니다.

  const actions = new Map([
   [{type:'1',status:1},()=>{/*do sth*/}],
   [{type:'2',status:2},()=>{/*do sth*/}],
   //...
  ])

  function checkStatus(type,status)=>{
   let action = [...actions].filter(([key,value])=>(key.type == type && key.status == status))
   action.forEach(([key,value])=>value.call(this))
  }

여기서 설명해야 할 요점은 다음과 같습니다. 지도는 모든 유형의 데이터를 키로 사용할 수 있습니다. 키가 조건을 충족하는지 직접 확인할 수 있으며 해당 vulue 값에 해당 처리 방법을 쓸 수 있습니다. 이러한 작성 방식은 기본적으로 대부분의 판단 논리를 만족시킬 수 있습니다. . . 아래에서 난이도가 상향 조정됩니다. . .
위에서는 type과 status가 일대일 대응일 때 해당 메소드가 실행된다고 언급했는데, type이 1이면 ststus가 2, 3이고, type이 2이면 status가 1이 되어 같은 메소드를 실행해야 합니다. 2. 동일한 방법을 수행해야 합니까? 위의 방법은 다음과 같이 사용할 수도 있습니다.

const actions = new Map([
  [{type:'1',status:2},()=>{functionA}],
  [{type:'3',status:3},()=>{/functionB}],
  [{type:'2',status:1},()=>{functionC}],
  [{type:'1',status:3},()=>{functionA}],
  //...
 ])

이렇게 작성하면 이미 일상적인 요구 사항을 충족할 수 있지만, 예를 들어 판단 조건이 특히 복잡해지면 상태가 2인 상황을 두 번 다시 작성하는 것은 여전히 ​​약간 불편합니다. , 유형은 3개입니다. 상태에는 10개의 상태가 있으므로 30개의 처리 논리를 정의해야 하며 이러한 논리 중 많은 부분이 동일한 경우가 많으므로 위의 작성 방법을 받아들이기 어려울 것 같으므로 다음과 같이 작성하면 됩니다.

  const actions = ()=>{
   const functionA = ()=>{/*do sth*/}
   const functionB = ()=>{/*do sth*/}
   const functionC = ()=>{/*send log*/}
   return new Map([
   [/^1_[1-4]$/,functionA],
   [/^2_.*$/,functionC], 
   //...
   ])
  }

  function checkStatus(type,status)=>{
   let action = [...actions()].filter(([key,value])=>(key.test(`${type}_${status}`)))
   action.forEach(([key,value])=>value.call(this))
  }

즉, 배열 루프의 특성을 활용하면 규칙적인 조건을 충족하는 로직이 실행되므로 공개 로직과 개별 로직이 동시에 실행될 수 있으므로 규칙성이 있으므로 상상력을 발휘할 수 있습니다. 더 많은 플레이 방법. ES6Map의 기능을 이해하지 못한다면 이에 대해 배울 수 있습니다. 다음으로 위의 사용법은 실제로 많은 양의 판단 논리에 많이 최적화되어 있습니다. .

미래에는 if/else/switch 이상의 기능이 있기를 바랍니다. . . .

위 내용은 JavaScript 복합 판단 논리 작성 기술의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
이 기사는 csdn.net에서 복제됩니다. 침해가 있는 경우 admin@php.cn으로 문의하시기 바랍니다. 삭제