0

I am learning about classes in Typescript and extend. Once I compiled .ts file and looked into .js. The code for class and extend in js is quite different. In .js class is made with function not with class.

My TS code

 class User4 { private city: string = "xyx"; protected number: number = 123123; constructor(public name: string) {} } class additional extends User4 { method1() { console.log(this.number); } } export {}; 

While the code in **.js ** is

"use strict"; var __extends = (this && this.__extends) || (function () { var extendStatics = function (d, b) { extendStatics = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; return extendStatics(d, b); }; return function (d, b) { if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); extendStatics(d, b); function __() { this.constructor = d; } d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); }; })(); exports.__esModule = true; var User4 = /** @class */ (function () { function User4(name) { this.name = name; this.city = "xyx"; this.number = 123123; } return User4; }()); var additional = /** @class */ (function (_super) { __extends(additional, _super); function additional() { return _super !== null && _super.apply(this, arguments) || this; } additional.prototype.method1 = function () { console.log(this.number); }; return additional; }(User4)); 

I am wondering, if there is any issue with my system or its something else because the code in .js file is really crazy

3
  • 4
    It's not crazy, it's transpiled to ES5 which didn't have a class keyword
    – CherryDT
    CommentedFeb 4, 2023 at 19:44
  • 1
    Why do you believe there is an issue? That's just transpiled to an older JS/ES standard which didn't have classes yet. If you want to transpile to more recent EcmaScript standards you have to configure this in your tsconfig file.
    – tkausl
    CommentedFeb 4, 2023 at 19:44
  • 2
    Consider targeting ES2015 or above, then check the transpiled output?CommentedFeb 4, 2023 at 19:53

1 Answer 1

3

JavaScript doesn't have real classes. Classes in JS are syntax sugar, take a look at this article: How Classes work in JavaScript

You're getting this "crazy" code, because the transpiler is by default set to handle old versions of JavaScript, before class was even added as part of the language.

5
  • What makes a class "real"?
    – Bergi
    CommentedFeb 4, 2023 at 20:11
  • @Bergi being a separate structure, compiled or interpreted as something that wouldn't be just an equivalent of other language features.CommentedFeb 4, 2023 at 20:13
  • So if a language is powerful enough to emulate classes it cannot have "real" classes by your definition?
    – Bergi
    CommentedFeb 4, 2023 at 20:17
  • There is no such language in existence ;)CommentedFeb 4, 2023 at 20:20
  • Every turing-complete language can emulate classes.
    – Bergi
    CommentedFeb 4, 2023 at 20:25

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.