将方法添加到字符串变量的原型

Question

预期：当使用 createGreetable 创建变量时，它应该有一个由 greetable(text) 设置的附加属性 greet。通常的 string 方法应该仍然可以在此变量上调用。

我尝试了什么：

const greetablePrototype = {
  greetable: function(greeting) {
    this.greet = `${greeting}, ${ this.valueOf() }!`
  }
}

function createGreetable(str) {
  const result = new String(str);
  Object.setPrototypeOf(result, greetablePrototype)
  return result;
}

const t = new createGreetable("world");
t.greetable("hello");
console.log(t.greet);

console.log(t.length);

输出：

hello, [object String]!
5

预期输出：

hello, world!
5

Answer 1

您可以扩展字符串 class:

class Greetable extends String {
  greet (greeting) {
    return `${greeting}, ${this}!`;
  }
}

const g = new Greetable('world');
g.greet('hello'); // hello, world!
g.length // 5

Answer 2

需要对您的代码进行一些修改才能使其按预期工作：

在greetable原型函数中加入this.length，每次更新字符串长度（记住这是一个string object）。
在构造函数中将 const result 行更改为 this.greet，按预期将 this 的原型设置为 greetablePrototype，然后返回我们对象的实例return this.

const greetablePrototype = {
  greetable: function(greeting) {
    this.greet = `${greeting}, ${this.greet}!`
    this.length = this.greet.length;
  }
}

function createGreetable(str) {
  this.greet = String(str);
  Object.setPrototypeOf(this, greetablePrototype)
  return this;
}

const t = new createGreetable("world");
t.greetable("hello");
console.log(t.greet);
console.log(t.length);

将方法添加到字符串变量的原型

Add a method to a string variable's prototype

javascript

prototype-chain