如何使用链式原型作为字符串

Question

我想将链式原型用于字符串。但是我不再使用一个返回字符串原型。如何在不通过原型方法返回this的情况下解决此问题，与本机String.prototype相同。

function StringUtil(str){
  this.str = str;
}

StringUtil.prototype.toCamelCase = function () {
  return this.str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(letter, index) {
    return index === 0 ? letter.toLowerCase() : letter.toUpperCase();
  }).replace(/\s+/g, '');
};

StringUtil.prototype.toSlug = function() {
  return this.str.toString().toLowerCase()
    .replace(/\s+/g, '-')           // Replace spaces with -
    .replace(/[^\w\-]+/g, '')       // Remove all non-word chars
    .replace(/\-\-+/g, '-')         // Replace multiple - with single -
    .replace(/^-+/, '')             // Trim - from start of text
    .replace(/-+$/, '');            // Trim - from end of text
};

var util = new StringUtil('this is a custom string');
console.log(util.toCamelCase()) // thisIsACustomString
console.log(util.toSlug()) // this-is-a-custom-string

util.toCamelCase().toSlug() // This does not work

Answer 1

StringUtil.prototype.toCamelCase = function () {
  return this.str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(letter, index) {
    return index === 0 ? letter.toLowerCase() : letter.toUpperCase();
  }).replace(/\s+/g, '');
};

您返回的this.str.replace返回的值与String.prototype.replace'返回（字符串）。

与您的下一个功能相同。

Answer 2

问题是您在String方法中返回StringUtil个对象（replace会返回一个新的string)。所以字符串原型没有新的方法您正在创建。您可以修复它在新方法中返回一个新的StringUtil对象：

function StringUtil(str){
  this.str = str;
}

StringUtil.prototype.toCamelCase = function () {
  return new StringUtil(this.str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(letter, index) {
    return index === 0 ? letter.toLowerCase() : letter.toUpperCase();
  }).replace(/\s+/g, ''));
};

Answer 3

您需要从链接方法中返回this才能工作。

例如

function StringUtil(str){
  this.str = str;
}

StringUtil.prototype.toCamelCase = function () {
  this.str = this.str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(letter, index) {
    return index === 0 ? letter.toLowerCase() : letter.toUpperCase();
  }).replace(/\s+/g, '');
  return this;
};

StringUtil.prototype.toSlug = function() {
  this.str = this.str.toString().toLowerCase()
    .replace(/\s+/g, '-')           // Replace spaces with -
    .replace(/[^\w\-]+/g, '')       // Remove all non-word chars
    .replace(/\-\-+/g, '-')         // Replace multiple - with single -
    .replace(/^-+/, '')             // Trim - from start of text
    .replace(/-+$/, '');            // Trim - from end of text
   return this;
};


StringUtil.prototype.setStr =function(str) {
   this.str = str;
   return this;
};

StringUtil.prototype.toString =function() {
   return this.str.toString();
};


var util = new StringUtil('this is a custom string');
console.log(util.toCamelCase().toString()) 
console.log(util.setStr("this is a custom string").toSlug().toString()) 

console.log(util.toCamelCase().toSlug().toString())

我已经为你的课程添加了几种方法来解释链接的效果。

• toString（） - 由于您要返回this，console.log将无法以所需格式打印数据。
• setStr（） - 因此，您可以看到toSlug处理原始字符串。