Question

我无法弄清楚我在这里失踪了什么。

我在utils.js中将原型设置为String

String.prototype.toTitleCase = () => {
    return this.replace(/\w\S*/g, (txt) => {
        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
};

当我从app.js

测试时

import * as utils from 'utils'

"This is a test".toTitleCase();

我收到错误：TypeError: Cannot read property 'replace' of undefined

我认为原型制作比创建一个函数更干净。这就是我想要理解的原因。谢谢！

Answer 1

问题是您使用了"Arrow function"。

箭头函数表达式[...]词汇绑定此值

因此，当您创建函数时，this的值已绑定到undefined。它没有绑定到您调用该函数的字符串对象。

要解决此问题，请使用常规功能：

String.prototype.toTitleCase = (function() {
    return this.replace(/\w\S*/g, (txt) => {
        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
});

Answer 2

this是Window对象，如果使用箭头功能，切换到正常功能并且可以正常工作

String.prototype.toTitleCase = function() {
    return this.replace(/\w\S*/g, (txt) => {
        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
};

Answer 3

调试你的代码，在你的firebug控制台上用你的返回行上的断点检查this的值，你会发现this不是字符串是表示你的String原型的对象

String无法读取undefined的属性'replace'

3 个答案: