为何无法将函数返回值赋值给对象属性？如何解决？附报错示例

Hey there! Let's break down what's going on here and fix this step by step.

The core issue here is execution order—you're trying to call a function before it even exists on your object. Let's look at your code line by line:

let program = { name: "...something..." };
program.wantedKeys = program.test(); // ❌ At this point, `program.test` doesn't exist yet!
program.test = () => "test"; // This runs AFTER you tried to call the function

When you execute program.test(), the program object has no test property, so JavaScript throws that TypeError because it can't call something that isn't a function (or doesn't exist at all).

The simplest solution is to define the function before you try to call it:

let program = { name: "...something..." };
program.test = () => "test"; // ✅ Define the function first
program.wantedKeys = program.test(); // Now call it safely
console.log(program.wantedKeys); // Output: "test"

This way, program.test is already a valid arrow function when you invoke it, so the assignment works as expected.

If you want the test function to access other properties of the program object (like name), arrow functions aren't the best choice—they don't have their own this context and inherit it from the outer scope. Instead, use a regular function, which binds this to the object it's called on.

Option 1: Define the Method During Object Initialization #

This is the cleanest way to ensure this works correctly:

let program = {
  name: "My Awesome Program",
  test: function() {
    // `this` refers directly to the `program` object here
    return `Test result for ${this.name}`;
  }
};
program.wantedKeys = program.test();
console.log(program.wantedKeys); // Output: "Test result for My Awesome Program"

Option 2: Add the Method Dynamically Later #

If you need to attach the function after the object is created, use a regular function instead of an arrow function:

let program = { name: "My Awesome Program" };
program.test = function() {
  return `This is a test from ${this.name}`;
};
program.wantedKeys = program.test();
console.log(program.wantedKeys); // Output: "This is a test from My Awesome Program"

Note: Arrow Functions with Object Context (Not Recommended) #

If you really want to use an arrow function, you can reference the object directly (but this defeats the purpose of this and makes your code less flexible if the object variable changes):

let program = { name: "My Awesome Program" };
program.test = () => `Arrow function test: ${program.name}`;
program.wantedKeys = program.test();
console.log(program.wantedKeys); // Output: "Arrow function test: My Awesome Program"

Stick with regular functions for object methods if you need to use this properly.

内容的提问来源于stack exchange，提问作者Martin Melichar