嵌套时的范围 objects/functions

Question

我对 JS 比较陌生，我正在尝试了解作用域如何与子 objects/functions。

例如：

const b = {
  c: () => {
    console.log("C", foo)
  }
}
const x = (foo) => {
  console.log("X", foo)
  return {
    a: () => {
      console.log("A", foo)
    },
    b: b 
  }
}

i = x("FOO")
i.a()
b.c()

我希望在所有 3 种情况下都能看到输出 FOO - 但实际上我看到了：

X FOO

A FOO

Uncaught ReferenceError: foo is not defined at Object.c

我正在尝试创建一个函数，其中它的所有方法实际上都映射到 external/imported 方法，但是由于这些都需要访问 foo，所以这是行不通的。 b (c) 有没有办法访问 foo？或者处理这种情况的替代方法？

Answer 1

将 b 的定义移到函数 x return 对象中

const x = (foo) => {
console.log("X", foo)
return {
  a: () => {
    console.log("A", foo)
  },
  b: {
    c: () => {
      console.log("C", foo)
    }
  }
}

}

由于关闭，现在您可以访问 foo。

Answer 2

您需要在 x 函数中创建 b 以便它可以访问参数值 foo - 否则它不在范围内。如果您必须从其他地方导入 b，则需要更改其他模块以导出函数，以便您可以提供 foo 来创建 b:

function makeB(foo) {
  // `foo` is in scope here
  return {
    c() {
      console.log("C", foo)
    }
  };
}

function x(foo) {
  // `foo` is in scope here
  console.log("X", foo)
  return {
    a() {
      console.log("A", foo)
    },
    b: makeB(foo), 
  };
}

const i = x("FOO");
i.a();
i.b.c();

嵌套时的范围 objects/functions

Scoping when nesting objects/functions

javascript

scoping