[ECMAScript] 举例说明你对es6的extends的理解

Posted 2021-12-30 前端小歌谣

[ECMAScript] 举例说明你对es6的extends的理解

es6引入的class其实本质上就是一个函数，而extends关键字则是通过原型实现继承，请看以下例子：

 class A 
            constructor() 
                this.a = 1;
                this.b = 2;
            
        
        class B extends A 
            constructor() 
                this.c = 3;
                this.d = 4;
            
        

es6代码经过babel编译后转化为es5的兼容性代码如下：

 "use strict";

        function _inheritsLoose(subClass, superClass) 
            subClass.prototype = Object.create(superClass.prototype);
            subClass.prototype.constructor = subClass;
            subClass.__proto__ = superClass;
        

        var A = /*#__PURE__*/function () 
            function A() 
                this.a = 1;
                this.b = 2;
            

            var _proto = A.prototype;

            _proto.print = function print() 
                console.log('print');
            ;

            return A;
        ();

        var B = /*#__PURE__*/function (_A) 
            _inheritsLoose(B, _A);

            function B() 
                var _this;

                _this = _A.call(this) || this;
                _this.c = 3;
                _this.d = 4;

                return _this;
            

            return B;
        (A);

 个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题