问题描述
我有一个打字稿应用程序,它在一个类中混合了这个"上下文.
I have a typescript app that it is mixing 'this' context inside a class.
这个类负责设置新的 Express 服务器实例.
This class is responsible to setup new Express server instance.
如果我使用调试器和 node --inspect-brk
跟踪this",我们可以看到当 serverProtocol 解析时this"未定义但没关系!
If I track 'this' with debugger and node --inspect-brk
we can see 'this' is undefined when serverProtocol gets resolvedbut it does not matter!
我已经建立了一个小项目来展示我所面临的问题.
I've setup a little project to show what i'm facing.
$> git clone https://github.com/AdSegura/ThisLoseContext.git
$> cd ThisLoseContext/
$> npm i
$> npm run build && node dist/
应该期待什么输出:
INIT: Server_ID: quijote_1111, PORT: 1111
-----------------------------------------
INIT: Server_ID: quijote_2222, PORT: 2222
-----------------------------------------
Callback: Server_ID: quijote_1111, PORT: 1111
ServerProtocol: Server_ID: quijote_1111; PORT: 1111
Callback: Server_ID: quijote_2222, PORT: 2222
ServerProtocol: Server_ID: quijote_2222; PORT: 2222
什么是真正的输出:
INIT: Server_ID: quijote_1111, PORT: 1111
-----------------------------------------
INIT: Server_ID: quijote_2222, PORT: 2222
-----------------------------------------
Callback: Server_ID: quijote_1111, PORT: 2222 [ERROR]
ServerProtocol: Server_ID: quijote_1111; PORT: 2222 [ERROR]
Callback: Server_ID: quijote_2222, PORT: 2222
ServerProtocol: Server_ID: quijote_2222; PORT: 2222
问题出在 Server.ts this.serverProtocol()
正在混合 this.options.port
The problem is in Server.ts this.serverProtocol()
is mixing this.options.port
var http = require('http');
var express = require('express');
const os = require("os");
export class Server {
/** The http server.*/
public express: any;
/** express httpServer */
protected server: any;
/** id representing server instance */
protected server_id: any;
/**
* Create a new server instance.
*/
constructor(private options: any) {
this.server_id = this.generateServerId();
}
/**
* Start the Socket.io server.
*
* @return {void}
*/
init(): Promise<any> {
console.log(`INIT: Server_ID: ${this.server_id}, PORT: ${this.options.port}`);
return new Promise((resolve, reject) => {
debugger;
this.serverProtocol().then(instance => {
debugger;
console.log(`ServerProtocol: Server_ID: ${this.server_id}; PORT: ${this.options.port}`);
resolve();
}, error => reject(error));
});
}
/**
* Select the http protocol to run on.
*
* @return {Promise<any>}
*/
serverProtocol(): Promise<any> {
return this.httpServer()
}
/**
* Express socket.io server.
*/
httpServer(): Promise<any> {
return new Promise((resolve, reject) => {
this.express = express();
this.express.use((req, res, next) => {
for (var header in this.options.headers) {
res.setHeader(header, this.options.headers[header]);
}
next();
});
const httpServer = http.createServer(this.express);
function cb() {
debugger;
console.log(`Callback: Server_ID: ${this.server_id}, PORT: ${this.options.port}`)
return resolve.call(this, this)
}
this.server = httpServer.listen(this.options.port, this.options.host, () => cb.call(this));
})
}
/**
* Generate Server Id
*
* @return string hostname_port
*/
generateServerId(): string {
const hostname = os.hostname();
const port = this.options.port;
return `${hostname}_${port}`
}
}
我是打字稿的新手,我在 tsconfig 尝试了多个目标,但结果相同,this.options
获取最后一个配置 {port:2222}
当您实例化两个或多个对象时.
I'm a novice with typescript, I tried multiple targets at tsconfig but same result, this.options
gets the last config {port:2222}
when you instanciate two or more objects.
谢谢.
我想明白这一点:
没有本地对象"这样的东西.你确实有一个参考目的.两个实例可能有两个对同一个对象的引用.
this.options 指向全局 opt 变量,BAD
const opt = { foo: 3 };
export class MyClass {
constructor(private options: any){
this.options = Object.assign(opt, options)
}
getOptions(): any {
return this.options
}
}
this.options 指向本地 opt 变量,GOOD
export class MyClass {
constructor(private options: any){
const opt = { foo: 3 };
this.options = Object.assign(opt, options)
}
getOptions(): any {
return this.options
}
}
但正如我们的合作伙伴在下面所说的,创建新选项变量的最安全方法是:
But as our partners said bellow, the safest methods to create new options variable are:
this.options = Object.assign({}, this.defaultOptions, config);
或
this.options = { ...this.defaultOptions, ...config };
现在我们有了一个新对象,而不是构造函数方法范围之外的对象的副本.
And now we have a new object not a copy to an object outside the scope of the constructor method.
所以最安全的代码版本应该是:
So the safest version of the code should be:
export class MyClass {
constructor(private options: any){
const opt = { foo: 3 };
this.options = Object.assign({}, opt, options)
}
getOptions(): any {
return this.options
}
}
推荐答案
问题可能出在 EchoServer
类里面,也就是这里:
The issue is probably inside the EchoServer
class, namely here:
this.options = Object.assign(this.defaultOptions, config);
这等于:
this.options = this.defaultOptions;
Object.assign(this.defaultOptions, config);
我假设你真的想做:
this.options = Object.assign({}, this.defaultOptions, config);
为每个实例创建一个自己的 options
对象.
which creates an own options
object for each instance.
这篇关于TypeScript Javascript 类,返回 Promise 时混合了两个实例的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!