Важность ключевого слова return в Javascript

вот разница между вашими двумя примерами

с return:

function getWaterBottle(money) {
  console.info("console.info inside function:", `You Can Buy "${parseInt(money / 1.5)}" Bottles Of Water`)
  
  return money % 1.5;
}

const dataFromFunction = getWaterBottle(4);

console.info("console.info outside function:", "data from function: " + dataFromFunction)

без return:

function getWaterBottle(money) {
  console.info("console.info inside function:", `You Can Buy "${parseInt(money / 1.5)}" Bottles Of Water`);

  console.info("console.info inside function:", `The change is ${money % 1.5}`);

}

const dataFromFunction = getWaterBottle(4);

console.info("console.info outside function:","data from function: " + dataFromFunction)

без return во втором примере dataFromFunction это undefined. ключевое слово return вернет все, что вы напишете сразу после ключевого слова вызывающему абоненту. узнайте больше здесь

Ключевое слово return — это не просто ключевое слово, а одна из самых основных и фундаментальных концепций компьютерного программирования.

Я хочу сохранить значение результатов расчета. Я делаю этот расчет с помощью function и сохраняю возвращенный результат.

Для чистой функции важно то, что она ничего не делает сама по себе. Он должен принимать некоторые значения в качестве аргументов, выполнять вычисления, а затем возвращать результаты без побочных эффектов.

Другими словами, вызов чистой функции без каких-либо действий с возвращаемым значением должен быть таким же, как и отсутствие вызова функции вообще.

Операторы журнала не изменяют состояние вашей программы, поэтому это все еще чистые функции. Они просто ничего не делают, кроме чтения данных и отображения их в консоли.

Что, в конце концов, равнозначно отсутствию вызова, когда дело доходит до фактического состояния вашей программы.

return в Javascript называется оператором. Его роль состоит в том, чтобы вернуть значение вызывающей функции. Некоторые функции могут не возвращать значение, поэтому оператор return не является обязательным, это зависит от того, что вы хотите сделать. Код после оператора return не выполняется. Например, можно использовать несколько return в функции, когда мы используем несколько операторов if.

Вы можете использовать оператор return в определенной ситуации, поскольку переменные, объявленные внутри вашего getWaterBottle(), имеют ограниченную область действия в теле функции, они не видны снаружи этой функции. Чтобы поделиться значением переменной, объявленной внутри вашей функции, с вызывающей функцией, вы используете оператор return.

Значение, возвращаемое оператором return, может быть присвоено переменной.

Например, пусть используется ваш код, в следующем коде вы вычисляете изменение, но не используете его. Вы просто показываете в консоли количество бутылок, которые вы можете купить на имеющиеся у вас деньги. Сдача фактически возвращается, но не используется. Мы можем использовать его в переменной, например:

    function getWaterBottle(money) {
        console.info(`You Can Buy "${parseInt(money / 1.5)}" Bottles Of Water`)
    
        return money % 1.5;
    
    }
    
    //We assign the returned value by the return statement to the variable that we name "change"
    let change = getWaterBottle(4)
    //We display the value of the variable in the console
    console.info(`The change is ${change}`);

Этот пример должен помочь вам понять, как мы можем поделиться результатом функции с оператором return.

С другой стороны, вы можете использовать его значение, не присваивая его переменной, например, мы хотим применить скидку к клиентам, покупающим более трех бутылок:

function getWaterBottle(money) {
    //We return the number of bottles the customer can buy
    return parseInt(money / 1.5)
}

//We use an "if" statement, as you can see, the getWaterBottle() function is returning a value that can be read directly by the "if" statement.
let money = 5
if (getWaterBottle(money) > 3) {
    console.info("Eligible to a discount");
}
else {
    console.info("Not eligible to a discount");
}

Теперь, чтобы показать вам использование нескольких операторов return, давайте возьмем предыдущий пример со скидкой:

function getWaterBottle(money) {
    //We assign the number of bottles the customer can buy to a variable
    numberOfBottles = parseInt(money / 1.5)

    //we check for the discount
    if (numberOfBottles > 3) {

        return true
    }
    else {

        return false
    }
}


//In this "if" statement, we check if the getWaterBottle() is returning true or famse
if (getWaterBottle(8)) {
    console.info("eligible to a discount");
}
else {
    console.info("not eligible to a discount");
}

Опять же, это примеры, в соответствии с вашим проектом, код можно сделать короче с некоторой хорошей практикой.

Что касается вашего второго кода, неиспользование оператора return означает, что код внутри вашей функции выполняется, но значение не возвращается, на самом деле он возвращает undefined, и даже если вы объявляете переменные внутри него, вы не можете использовать их вне вашей функции.