JAVASCRIPT: 在 document.write() 中调用函数后得到 NaN 结果

Question

我正在尝试使用以下代码获取 bornYear 作为结果，但结果为 NaN。

function person(name, age){
    this.name = name;
    this.age = age;
    this.yearOfBirth = bornYear;
}
function bornYear(){
    return 2020 - this.age;
}
document.write(bornYear());

我在这里缺少什么？

Answer 1

试试这个：

function bornYear(){
    return 2020 - parseInt(this.age);
}

Answer 2

您没有创建 person 的实例，也没有调用该实例的属性：

bornYear 引用 this，这似乎是一个 person 实例，因此您必须以某种方式将 this 绑定到它。
正如您定义的属性 yearOfBirth，调用那个方法是合适的。

此外，您的 bornYear 函数仅限于 2020 年。您应该使用当前年份，使用 Date 构造函数。

这是它的工作原理：

function person(name, age){
    this.name = name;
    this.age = age;
    this.yearOfBirth = bornYear.bind(this); // bind this
}
function bornYear(){
    // Use the current year to calculate year of birth
    return new Date().getFullYear() - this.age;
}
// First create an instance, then call the method
document.write(new person("Helen", 18).yearOfBirth());

虽然在原型上定义这样的方法并以大写 (Person) 开头的构造函数名称更为常见。

此外，在这种情况下使用 document.write 是不好的做法。使用 console.log.

标准的方式是这样的：

class Person {
    constructor(name, age) {
        this.name = name;
        this.age = age;
    }
    bornYear() {
        return new Date().getFullYear() - this.age;
    }
}
console.log(new Person("Helen", 18).bornYear());

Answer 3

您似乎混淆了面向对象编程和函数式编程风格。如果您想像现在这样使用 this，则必须执行以下操作：

function Person(name, age) {
    this.name = name;
    this.age = age;
    this.yearOfBirth = () => {
        return new Date().getFullYear() - this.age;
    };
}
let newPerson = new Person('Foo', 25);
document.write(newPerson.yearOfBirth());

JAVASCRIPT: 在 document.write() 中调用函数后得到 NaN 结果

JAVASCRIPT: Getting NaN result after calling function in document.write()

javascript

function

object

methods

object-properties