Home > Net >  Function with TypeScript works with VScode but not work with the interface of executeprogram.com
Function with TypeScript works with VScode but not work with the interface of executeprogram.com

Time:09-06

I have a exercice "Quiz: Add or subtract with union" of https://www.executeprogram.com/courses/typescript-basics

"Write a function that adds 1, subtracts 1, or does nothing to a number. Argument 1 is the number. Argument 2 is 'add', 'subtract', or 'leave-alone'"

My solution which works on Visual Studio Code :

 function addOrSubtract(
  number: number,
  choice: "add" | "subtract" | "leave-alone"
) {
  if (choice === "add") {
    return number   1;
  }
  if (choice === "subtract") {
    return number - 1;
  }
  if (choice === "leave-alone") {
    return number;
  }
}

addOrSubtract(5, "add"); //6
addOrSubtract(5, "subtract"); //4
addOrSubtract(5, "leave-alone"); //5

But it doesn't work on interface executeprogram.com

I have 3 errors :

addOrSubtract(5, 'add'); Expected: 6 but got: type error: Not all code paths return a value.

addOrSubtract(5, 'subtract'); Expected: 4 but got: type error: Not all code paths return a value.

addOrSubtract(5, 'leave-alone'); Expected: 5 but got: type error: Not all code paths return a value.

On VSCode it works, I don't understand what is the problem ???

CodePudding user response:

executeprogram.com has the noImplicitReturns setting turned on, but your local project in VSCode does not. Add that to your tsconfig.json in your local project and it should be flagged as a problem.

Or see this playground


To fix it you need make absolutely sure that a return statement is hit. And Typescript is having a hard time knowing that you have every case covered.

Since you have three separate if statements here, the compiler looks at each one and says "maybe this returns, maybe it doesn't". It does that three times and concludes that maybe no return statements are hit.


The simplest fix is to fall through the last case:

function addOrSubtract(
  number: number,
  choice: "add" | "subtract" | "leave-alone"
) {
  if (choice === "add") {
    return number   1;
  }
  if (choice === "subtract") {
    return number - 1;
  }
  
  return number; // not called conditionally
}

Here the compiler can see that a return statement will always be hit, not matter what.

Playground


Or you could use a switch statement so that the compiler can more easily see that all three possible values are handled.

function addOrSubtract(
  number: number,
  choice: "add" | "subtract" | "leave-alone"
) {
  switch(choice) {
    case 'add':
      return number   1;
    
    case 'subtract':
      return number - 1;

    case 'leave-alone':
      return number;
  }
}

Playground

CodePudding user response:

you had to add a return at the end of the function, VSCode is more robust

function addOrSubtract(
  number: number,
  choice: "add" | "subtract" | "leave-alone"
) {
  if (choice === "add") {
    return number   1;
  }
  if (choice === "subtract") {
    return number - 1;
  }
  if (choice === "leave-alone") {
    return number;
  }
  return number //origin Not all code paths return a value
}

addOrSubtract(5, "add");
addOrSubtract(5, "subtract");
addOrSubtract(5, "leave-alone");
  • Related