void / never / return과 console.log의 차이점

백아름·2023년 7월 10일
0

프론트엔드

목록 보기
63/80

void를 이해하기 전에 return문과 console.log의 차이점을 알아보자.

return으로 반환하는 값과 console.log로 출력하는 값의 차이점은 다음과 같습니다:

  • 반환 값의 용도
    : return함수에서 값을 반환하기 위해 사용됩니다. 함수 내부에서 return 문을 사용하여 특정 값을 호출한 곳으로 반환할 수 있습니다. 반환된 값은 다른 변수에 할당하거나 다른 함수의 인자로 전달할 수 있습니다.
    : 반면, console.log단순히 값을 콘솔에 출력하는 역할을 합니다.

  • 실행 시점
    :return 문해당 문이 실행되면 함수가 즉시 종료됩니다. 따라서 return 문 이후에 오는 코드는 실행되지 않습니다.
    : console.log값을 출력한 후에도 함수의 실행은 계속됩니다. 함수 내에서 여러 번 console.log를 사용하더라도 함수는 정상적으로 진행됩니다.

  • 출력 위치
    : return값을 호출한 곳으로 반환하며, 반환된 값은 다른 변수나 표현식에 저장되어 활용될 수 있습니다.
    : console.log는 콘솔에 값을 출력하기 때문에 주로 디버깅이나 로그 작성 등의 목적으로 사용됩니다.

결론적으로,

  • return은 값을 반환하고 함수의 실행을 종료하는 역할을 하며, 반환된 값은 다른 곳에서 활용가능.
  • console.log는 값을 콘솔에 출력하는 역할을 하고, 함수의 실행을 계속 진행.

void

// void
// void -> 공허 -> 아무것도 없다
// void -> 아무 것도 없음을 의미하는 타입

- 반환값의 유형도 적어줄 수 있음. ()매개변수 뒤에 콜론 찍고 유형 적어주면 됨.

  • hello라는 문자열을 반환하기 때문에 string 써줌.
function func1(): string {
  //반환값의 유형도 적어줄 수 있음. ()매개변수 뒤에 콜론 찍고 유형 적어주면 됨. hello라는 문자열을 반환하기 때문에 string 써줌.
  return "hello";
}

func1과 func2의 차이점: return문의 유무

function func2(): void {
  console.log("hello"); 
}
  • func1과의 차이점: func1은 반환하는 값인데, func2는 출력하는 값을 적어줌.

  • func2는 반환없이 출력만 하고 있기 때문에, 이럴 때 void 타입을 써주는 것임.
    // 진짜 return문을 작성하기 싫은 함수에 void를 써줌
    // 즉 void는 return문을 작성해주지 않아도 상관없음.

  • 적어도 return; 이렇게 써줘야함.

  • 만약 func2(): undefined 이렇게 type 써주면 return undefined; 혹은 return; 를 해줘야하기 때문.

  • null도 마찬가지. return null;혹은 return;

void 타입 변수로도 정의 가능: undefined만 가능 (상황에 따라 null 가능)

never

  • 존재하지 않는.
  • 즉, 불가능한 타입.

never타입도 void타입과 마찬가지로 변수의 타입으로 설정해줄 수 있음.

  • // void는 undefined와 strictNullChecks상황에 따라 null을 담을 수 있었지만, never타입은 이 둘도 담지 못함.
  • // any타입의 값도 never 타입에는 절대 담을 수 없음. 정말 아무 타입도 담을 수 없음.

// void
// void -> 공허 -> 아무것도 없다
// void -> 아무 것도 없음을 의미하는 타입

function func1(): string {
  //반환값의 유형도 적어줄 수 있음. ()매개변수 뒤에 콜론 찍고 유형 적어주면 됨. hello라는 문자열을 반환하기 때문에 string 써줌.
  return "hello";
}

function func2(): void {
  console.log("hello"); //func1과의 차이점: func1은 반환하는 값인데, func2는 출력하는 값을 적어줌.
  // func2는 반환없이 출력만 하고 있기 때문에, 이럴 때 void 타입을 써주는 것임.
  // 진짜 return문을 작성하기 싫은 함수에 void를 써줌
  // 즉 void는 return문을 작성해주지 않아도 상관없음.
  // 왜냐하면 만약 func2(): undefined 이렇게 써주면 return undefined를 해줘야하기 때문. null도 마찬가지. 적어도 return; 이렇게 써줘야함.
}

let a: void; // 만약 이렇게 변수를 void 타입으로 정의하면 문자, 숫자, 객체 등 아무것도 담을 수 없음. 오직 undefined만 담을 수 있음.

// 아래는 안되는 예시임
// a = 1;
// a = "hello";
// a = {};

a = undefined; //얘는 가능
// 단, tsconfig.json의 strictNullChecks를 false로 설정하면 null도 집어넣을 수 있음.
// a = null;

// never
// never -> 존재하지 않는
// 불가능한 타입

function func3(): never {
  while (true) {}
}

function func4() {
  throw new Error(); // javascript에서는 프로그램 실행도중에 에러를 던져줄 수 있음.
  // 이런 경우에도 실행되면 바로 프로그램이 정지될 것이기 때문에 반환값으로는 never를 정의하는게 적합함.
}

// never타입도 void타입과 마찬가지로 변수의 타입으로 설정해줄 수 있음.
// void는 undefined와 strictNullChecks상황에 따라 null을 담을 수 있었지만, never타입은 이 둘도 담지 못함.
// any타입의 값도 never 타입에는 절대 담을 수 없음. 정말 아무 타입도 담을 수 없음.

// let a: never;
// a = 1;
// a = {};
// a = "";
// a = undefined;
// a = null;
// a = anyVar;
profile
곧 훌륭해질 거에요!

0개의 댓글