6

我试图String.Prototype在TypeScript中定义一些属性：

Object.defineProperty(String.prototype, 'test', {
    value: () => {
        console.log("this is a test over text " + this);
    }
})

在javaScript原型中，this指的是调用方法的对象（在这种情况下是字符串值）。但是文件的编译输出是：

var _this = this;
Object.defineProperty(String.prototype, 'test', {
    value: function () {
        console.log("this is a test over text " + _this);
    }
});

TypeScript 编译器添加变量_this并引用它。

这是一个错误还是我的实现有问题？

4

1 回答 1

12

这是一个错误还是我的实现有问题？

不，这就是 TypeScript 的箭头函数的工作方式：在箭头函数中，this是从创建函数的上下文继承的，而不是通过调用它的方式设置的。（箭头函数也在 ES2015 中，至少部分受到 CoffeeScript 的“胖箭头”函数的启发；我不知道 TypeScript 的历史，也不知道它是否也是 ES2015 箭头函数灵感的一部分，反之亦然。）

这是上面规范链接的引用：

函数表达式引入了一个新的动态绑定 this，而箭头函数表达式保留了其封闭上下文的 this。

箭头函数表达式对于编写回调特别有用，否则通常会有未定义或意外的 this。

在示例中

class Messenger {  
    message = "Hello World";  
    start() {  
        setTimeout(() => alert(this.message), 3000);  
    }  
};

var messenger = new Messenger();  
messenger.start();

使用箭头函数表达式会导致回调与周围的“开始”方法具有相同的 this。

如果您想this依赖于函数的调用方式，请不要使用箭头函数，请使用function：

Object.defineProperty(String.prototype, 'test', function() {
    console.log("this is a test over text " + this);
})

另请注意，正如 nils 指出的那样，第三个参数Object.defineProperty应该是属性描述符，而不是函数。您可能的意思是：

Object.defineProperty(String.prototype, 'test', {
    value: function() {
        console.log("this is a test over text " + this);
    }
});

TypeScript 转译器根本不会改变它；调用"testing".test()输出"this is a test of text testing"：

Object.defineProperty(String.prototype, 'test', {
    value: function() {
        snippet.log("this is a test over text " + this);
    }
});
"testing".test();
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="//tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

于 2015-10-18T11:39:09.267 回答