JavaScript中如何拼接名与姓？遇TypeError错误求解决方案

你遇到的TypeError: Person.fname is not a function错误，核心原因是你搞错了原型方法的调用方式：fname和lname是挂载在Person.prototype上的实例方法，这类方法只能通过Person的实例来调用，而不是直接用构造函数Person去调用。

看你代码里的fullname方法：

Person.prototype.fullname=function(){
  return Person.fname() + Person.lname()
}

这里直接用Person.fname()，相当于在找构造函数Person本身的fname静态方法，但你根本没定义过这个，所以才会抛出错误。

修正后的代码 #

只需要把调用方式改成通过this来访问实例方法即可——在实例方法内部，this指向当前的Person实例，能正确访问原型上的方法：

function Person(){ }
Person.prototype.fname=function(){ return "abc" }
Person.prototype.lname=function(){ return "lop" }
Person.prototype.fullname=function(){
  // 用this调用原型上的实例方法，加空格让姓名格式更合理
  return this.fname() + " " + this.lname()
}
var p = new Person();
console.log(p.fullname()) // 输出 "abc lop"

额外推荐：ES6 Class写法（更直观） #

如果你的运行环境支持ES6，用Class语法实现会更清晰，调用逻辑和上面一致：

class Person {
  fname() { return "abc" }
  lname() { return "lop" }
  fullname() {
    return `${this.fname()} ${this.lname()}`
  }
}
const p = new Person();
console.log(p.fullname()) // 输出 "abc lop"

记住一个关键点：挂载在prototype上的方法是给实例用的，必须通过实例（或者方法内部的this）来调用；如果是构造函数本身的静态方法，才用Person.method()的方式调用。

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