JavaScript Return

今天一起了解一下 JavaScript 中的 return 语句。

语法

return 语句用于指定函数的返回值。当 JavaScript 遇到 return 语句时，函数将立即返回，并且不再执行任何后续的语句。

return [expression]; // expression 是要返回的值

function add(a, b) {
  return a + b;
}

console.log(add(1, 2)); // 3

如果省略 expression，或者 return 语句没有在函数中，则返回值为 undefined。

return; // undefined

return后面省略表达式，返回值为undefined。

function foo() {
  const a = 1;
  const b = 2;
  return;
}

console.log(foo()); // undefined

没有return语句，也返回undefined。

function bar() {
  const a = 1;
  const b = 2;
}

console.log(bar()); // undefined

返回对象

return 语句返回复杂值时，return不能独占一行，否则会报错。

下面这样写会导致语法错误。

function getPerson() {
  return // return 不能独占一行
  {
    name: 'zdd',
    age: 18
  };
}

正确的写法是：

function getPerson() {
  return { // '{' 与 'return' 在同一行
    name: 'zdd',
    age: 18
  };
}

try…catch…finally

如果在 try-catch-finally 语句块中使用了 return 语句，则执行顺序如下：

1. 先计算return后面的表达式的值。
2. 然后执行 finally 语句块中的代码。
3. 最后return步骤1中计算出的值。

function foo() {
  try {
    console.log(1);
    return 2;
  } finally {
    console.log('3');
  }
}
console.log(foo()); // 1 3 2

再看一个复杂的例子

function foo() {
  let a = 1;
  try {
    console.log(a);
    return a++;
  } finally {
    console.log(a);
  }
}

console.log(foo()); // 1 2 1

为啥结果是1 2 1呢？

• try中`console.log(a)输出1，这个很好理解。
• return a++，这里的a++是先返回a的值，然后再执行a++，所以return返回的是1。
• finally中console.log(a)输出的是2，因为a++执行了一次。

所以执行的顺序是：

1. 先计算return后面的表达式，a = 2.
2. 然后执行finally中的代码，输出a = 2
3. 最后return返回1.