import { style } from '../assets';import { eventbus } from '../eventbus';import { page, RootObject } from '../vm/page';import * as d3 from 'd3'import * as d3g from 'd3-shape'import * as signalr from "@aspnet/signalr";export class AreaMain {    main: HTMLMainElement;    constructor(private stp: style, private bus: eventbus, private vm: page) {        this.main = document.createElement('main');        this.bus.load(this);        let uid: RootObject;        if (this.vm.uidata != undefined) {            uid = this.vm.uidata            this.initialView(this.main, uid);            this.setCss(uid)        }        this.conn = undefined            }    initialView(parent: HTMLMainElement, uid: RootObject): void {        let div1 = document.createElement('div')        let div2 = document.createElement('div')        let div3 = document.createElement('div')        this.init1(div1, uid)        this.init2(div2, uid)        this.init3(div3, uid)        for (var i of [div1, div2, div3]) {            parent.appendChild(i)        }    }    //#region ui components    init1(parent: HTMLElement, uid: RootObject): void {        var svg = d3.select(parent).append('svg')            .attr('width', '100%')        var g = svg.append('g')            .attr('transform', 'translate(250,10)')        var r = g.append('rect')            .attr('fill', 'skyblue')            .attr('width', 100)            .attr('height', 100)            .attr('transform', 'rotate(20,10,10)')           r.on('click',()=>{            if(this.conn!=undefined){                this.testkk(this.conn)  // 这里都不会执行的！            }        })    }    init2(parent: HTMLElement, uid: RootObject): void {        parent.setAttribute('id', 'div2')        var ul = document.createElement('ul')        parent.appendChild(ul)        const connection = new signalr.HubConnectionBuilder()            .withUrl("http://localhost:61866/chatHub")            .build();        this.conn = connection        console.log(2250)        console.log(this.conn)        connection.on("ReceiveMessage", function (user, message) {            var encodedMsg = user + " says " + message;            var li = document.createElement("li");            li.textContent = encodedMsg;            ul.appendChild(li);        });        this.conn.start().then(x=>{            console.log(x)        })    }    init3(parent: HTMLElement, uid: RootObject): void {    }    //#endregion    //#region change    conn: signalr.HubConnection | undefined    async testkk(connection: signalr.HubConnection) {        await connection.start();        await connection.invoke("SendMessage", 'user', 'message');    }    //#endregion    setCss(uid: RootObject): void {        this.stp.create('#div2')        .insert('height','600px')        .insert('background-color','#e8e8e9')        this.stp.create('#div2>ul')            .insert('list-style', 'none')    }}

这是我自己做的小项目里的代码 ，用C#来做这个是走得通的，但ts不行，见红字那里， 

原因我猜测是因为，r.on(...  这里这个r 的作用域只是属性 Init1 方法的，在js, ts里方法的权限很大，它和 this.conn不在同一个作用域里，所以在r的作用域中，this.conn的值 只是处于 constructor本部

里设置的那个值，不知道 有没有朋友 也遇到 过类似 的情形，欢迎跟贴讨论