JavaScript中如何在对象内部调用全局函数，写法差异原因是什么

你遇到的报错本质是对象字面量初始化顺序的问题：在const person = { ... }的整个对象字面量解析完成之前，person变量还未完成赋值，此时的值是undefined。你在字面量内部执行fullName.call(person)时，相当于给call传入了undefined作为this指向，严格模式下函数的this会严格保留传入的值，访问undefined.firstName自然会抛出错误。而(02)的写法是等person对象初始化完成后再执行call，此时person已经是正常的对象实例，所以可以正常运行。

问题1：如何正确在对象内部通过call调用外部函数 #

两种常用的正确实现方式：

• 如果需要每次访问属性时动态计算值，使用getter语法，getter内部的this会自动绑定到当前对象实例，不需要依赖未初始化的变量：

const person = {
    firstName: "Anant",
    lastName: "Ghotale",
    get completeName() {
        return fullName.call(this);
    }
};
// 直接访问person.completeName即可拿到正确结果

• 如果只需要在对象初始化时计算一次固定值，可以先声明对象再赋值，或者使用工厂函数绕开变量未初始化的问题：

// 工厂函数写法
function createPerson(firstName, lastName) {
    return {
        firstName,
        lastName,
        completeName: fullName.call({ firstName, lastName })
    }
}
const person = createPerson("Anant", "Ghotale");

问题2：对象内部调用外部函数是否合理？有没有更优方案？ #

这种做法本身是合理的，属于公共逻辑复用的常规实现，只要避开变量初始化时序问题即可。如果你的场景需要创建大量同类型对象，更推荐以下两种优化方案：

1. 复用原型方法
   如果是批量生成实例，用类/构造函数把公共方法挂载到原型上，不需要每个对象单独生成函数，内存占用更低：

class Person {
    constructor(firstName, lastName) {
        this.firstName = firstName;
        this.lastName = lastName;
    }
    // 直接复用全局公共函数
    completeName() {
        return fullName.call(this);
    }
}
const person1 = new Person("Anant", "Ghotale");
const person2 = new Person("Zhang", "San");

2. 直接绑定方法引用
   如果不需要兼容旧环境，也可以直接把全局公共函数赋值为对象方法，调用时this会自动绑定到当前对象，不需要手动写call：

const person = {
    firstName: "Anant",
    lastName: "Ghotale",
    completeName: fullName
};
// 调用时执行person.completeName()即可

内容的提问来源于stack exchange，提问作者Chinmay Ghule