결합도 Coupling

• 외부 모듈과의 연관도 또는 모듈 간의 상호의존성을 나타내는 정도
• 소프트웨어 구조에서 모듈간의 관련성을 측정하는 척도
• 한 모듈이 변경되기 위해서 다른 모듈의 변경을 요구하는 정도
  • 결합도가 높을 수록 함께 변경해야 하는 모듈의 수가 늘어나게 됨

결합도 특징

• 모듈 연관성 없음
• 인터페이스 의존성
• 복잡성 감소
• 파급효과 최소화

결합도의 유형

• 자료 < 스탬프 < 제어 < 외부 < 공통 < 내용
• 내용 결합도
  • 다른 모듈 내부에 있는 변수나 기능을 다른 모듈에서 사용하는 경우의 결합도
  • 하나의 모듈이 직접적으로 다른 모듈의 내용을 참조할 때 두 모듈은 내용적으로 결합된 경우의 결합도
• 공통 결합도
  • 파라미터가 아닌 모듈 밖에 선언되어 있는 전역 변수를 참조하고, 전역 변수를 갱신하는 식으로 상호작용 하는 경우의 결합도
• 외부 결합도
  • 모듈이 다수의 관련 기능을 가질 때 모듈 안의 구성요소들이 그 기능을 순차적으로 수행할 경우의 결합도
• 제어 결합도
  • 어떤 모듈이 다른 모듈의 내부 논리 조직을 제어하기 위한 목적으로 제어 신호를 이용해 통신하는 경우의 결합도
  • 하위 모듈에서 상위 모듈로 제어 신호가 이동하여 상위 모듈에게 처리 명령을 부여하는 권리 전도 현상 발생하는 결합도
• 스탬프 결합도
  • 모듈 간의 인터페이스로 배열이나 객체, 구조 등이 전달되는 경우의 결합도
• 자료 결합도
  • 모듈 간의 인터페이스로 전달되는 파라미터를 통해서만 모듈간의 상호 작용이 일어나는 경우의 결합도

응집도 Cohesion

• 모듈의 독립성을 나타내는 개념
• 모듈 내부 구성요소 간 연관 정도 의미
• 하나의 모듈은 하나의 기능을 수행하는 것을 의미
• 즉 변경이 발생할 때 모듈 내부에서 발생하는 변경의 정도
  • 하나의 변경을 수용하기 위해 모듈 전체가 변경 -> 높은 응집도
  • 하나의 변경을 수용하기 위해 일부 모듈의 일부만 변경 -> 낮은 응집도

특징

• 유사기능 영역 구성
• 단일 책임 할당
• 함수 간 상호 협력

유형

• 우연적 < 논리적 < 시간적 < 절차적 < 통신적 < 순차적 < 기능적
• 우연적 응집도
  • 서로 간에 어떠한 의미 있는 연관 관계도 없는 기능 요소로 구성될 경우의 응집도
  • 서로 다른 상위 모듈에 의해 호출되어 처리상의 연관성이 없는 서로 다른 기능을 수행할 경우의 응집도
• 논리적 응집도
  • 유사한 성격을 갖거나 특정 형태로 분류되는 처리 요소들이 한 모듈에서 처리되는 경우의 응집도
• 시간적 응집도
  • 특정 시간에 처리되어야 하는 활동들을 한 모듈에서 처리할 경우의 응집도
• 절차적 응집도
  • 모듈이 다수의 관련 기능을 가질 때 모듈 안의 구성요소들이 그 기능을 순차적으로 수행할 경우의 응집도
• 통신적 응집도
  • 동일한 입력과 출력을 사용하여 다른 기능을 수행하는 활동들이 모여 있을 경우의 응집도
• 순차적 응집도
  • 모듈 내에서 한 활동으로부터 나온 출력 값을 다른 활동이 사용할 경우의 응집도
• 기능적 응집도
  • 모듈 내부의 모든 기능이 단일한 목적을 위해 수행되는 경우의 응집도

결론

• 응집도는 높아야 하고, 결합도는 느슨해야 한다.
• 설계를 변경하기에 편리해 지기 때문

_Async/Await_

자바스크립트에서 async/await는 뭘까?

async/await는?

Promise 기반으로 동작하지만, then/catch/finally 와 같은 프로미스 후속 처리 메서드에 콜백 함수를 전달하여

비동기 처리 결과를 후속 처리할 필요 없이 마치 동기 처리처럼 프로미스를 사용할 수 있다.

결과적으로 Promise를 더 쉽게 다룰 수 있게 해 준다.

async/await을 사용하면 비동기 함수들을 마치 동기 함수처럼 작성하여 동작할 수 있게 해 준다.

function getData(){

/*

 비동기 함수

 */

}

// 프로미스

new Promise((resolve, reject) => {

const result = getData();

if ( /* 비동기 작업 수행 성공 */) {

resolve(result);

} else {

reject(result);

}

})


// async/await

async function getData() {

await /* 비동기 함수 */

}

Async

async 함수는 async 키워드를 사용해 정의하고, 언제나 프로미스를 반환한다.

Await

await 키워드는 프로미스가 settled 상태가 될 때까지 대기하다가 settled 상태가 되면 프로미스가 resolve 한 처리 결과를 반환한다.

참고 링크

- async/await (https://learnjs.vlpt.us/async/02-async-await.html)

자바스크립트에서 사용되는 Promise는 무엇일까?

콜백

콜백 함수는 다른 함수에 인자로 전달되는 함수로

어떤 함수의 동작에서 이벤트가 발생하였을 때, 혹은 특정 시점에 도달했을 때 호출하는 함수이다.

아래 예시는 정말 러프하게 이해할 수 있게끔만 적어놓은 함수이다. 단순한 구조라면 콜백 구조가 깊지 않지만, 복잡도가 높아짐에 따라 콜백 함수가 중첩되고 그 깊이가 엄청나게 깊어지는 것을 콜백 지옥이라 한다.

function getData(){

  /*

  비동기 함수

  */

}


getData().then(

  // 완료 되었을 때

).then().then().catch().finally()

Promise

Promise 객체는 ES6에서 추가된 개념으로, 비동기 작업이 작업 완료 후 미래의 완료 혹은 실패 결과를 나타낸다.

기존의 방식으로는 작성하게 된다면 콜백 지옥에 빠지게 된다.

또한 Promise 객체는는 비동기 함수들을 병렬로 수행할 수 있도록 하며 .all() 메서드와 .allSettled() 메서드를 프로퍼티로 가진다.

_출처: https://adrianalonso.es/desarrollo-web/apis/trabajando-con-promises-pagination-promise-chain/_

Promise는 비동기 작업을 수행하고 그 작업의 성공 혹은 실패 함수를 호출할 수 있다.

function getData(){

  /*

  비동기 함수

  */

}


new Promise((resolve, reject) => {

  const result = getData();


  if ( /* 비동기 작업 수행 성공 */) {

    resolve(result);

  } else {

    reject(result);

  }

})

Promise의 상태(State)

Promise 객체의 상태 정보는 세가지가 있다.

• pending: 비동기 처리가 아직 수행되지 않은 상태 - Promise 객체가 생성된 직후 기본 상태
• fulfilled: 비동기 처리가 수행된 상태 (성공) -> resolve 함수 호출
• rejected: 비동기 처리가 수행된 상태 (실패) -> reject 함수 호출

정리

• Promise는 콜백 지옥에 빠지는 비동기 처리를 간결하게 처리할 수 있게 표현
• 상태에는 pending, fulfilled, rejected 가 있다.
• 실행 결과에 따라 실패 시 reject, 성공 시 resolve 함수를 호출할 수 있다.

참고 링크

- Promise (https://learnjs.vlpt.us/async/01-promise.html)