The following shows an example of inheritance in TypeScript. This resembles languages like Java and C#, but comes with peculiarities that are specific to this language.<\/p>\n
\nclass Dialog {\n message: String;\n \n constructor(message: String) {\n this.message = message; \n }\n \n render() {\n console.log(this.message); \n }\n}\n\nclass AlertDialog extends Dialog {\n render() {\n console.log(\"Alert\"); \n } \n}\n\nlet ad: Dialog = new AlertDialog(\"alert message\");\nad.render();\n<\/pre>\nOne thing I really like is that the child classes inherit the constructor from the top class, if one isn’t defined. If you do want to define one, call super:<\/p>\n
\nconstructor() {\n super(\"Alert message\") \n}\n<\/pre>\nBy default, all methods are public, but you can define them as protected or private, and they act as expected, although the access level is erased (I haven’t found anything like protected internal or final)<\/p>\n
One thing that is also really nice is that the actual Javascript that gets interpreted from TypeScript is not that complex. Here is what it ends up looking like:<\/p>\n
\nvar __extends = (this && this.__extends) || function (d, b) {\n for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];\n function __() { this.constructor = d; }\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\n};\nvar Dialog = (function () {\n function Dialog(message) {\n this.title = \"Test Title\";\n this.message = message;\n }\n Dialog.prototype.render = function () {\n console.log(this.title);\n console.log(this.message);\n };\n return Dialog;\n}());\nvar d = new Dialog(\"Test Message\");\nd.render();\nvar AlertDialog = (function (_super) {\n __extends(AlertDialog, _super);\n function AlertDialog() {\n _super.apply(this, arguments);\n }\n AlertDialog.prototype.render = function () {\n console.log(\"Alert\");\n };\n return AlertDialog;\n}(Dialog));\nvar ad = new AlertDialog(\"alert message\");\nad.render();\n<\/pre>\n","protected":false},"excerpt":{"rendered":"Demonstration of how inheritance gets rendered from TypeScript to Javascript<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"footnotes":""},"categories":[4],"tags":[302,557],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t