<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<body>
    <button>333</button>
    <script type="text/javascript">
        var that ;
        class test
        {
            constructor(uname, age) {
                that = this;
                console.log(this)
                this.uname = uname
                this.age = age;
                this.btn = document.querySelector('button');
                this.btn.onclick = this.sing;
            }

            sing() {
                //按钮点击的时候，this指向是调用者button，如果想要调用uname 需要用that这种方式
                console.log(this)
                console.log(that.uname)
            }
        }

        class child extends test {
            constructor(uname, age) {
                // super(uname, age)  //如果没有super（），直接调用sing，
                //sing里面的this是指向父类，没有定义会报错
                this.uname = uname
                this.age = age;
            }
        }
        // var testObject = new test('lilie', 23)
        // testObject.sing()  //this指向是test这个对象
        var childObj = new child('lile', 25)
        childObj.sing()
    </script>
</body>
</html>