News

Q&A with Ben Hoelting: Top Tips on JavaScript Patterns for the C# Developer

From variables to inheritances to what JavaScript patterns you really need to know, C# MVP Ben Hoelting offers his top tips for C# coders looking to use JavaScript to build complex client-side Web apps.

When picking up JavaScript design patterns, which are crucial for complex client-side Web applications, there's a few areas that every C# developer finds issues with (or just using JavaScript in general) -- like the lack of simple keywords or differences in inheritances. Ben Hoelting, C# MVP and speaker at the upcoming Visual Studio Live! Boston conference, offers his top tips below for which patterns to focus on and the differences you need to understand to quickly transition (plus what not to do).

What are the top 3 differences between JavaScript and C# that are the most challenging in general for C# developers?
By far the biggest difference between JavaScript and C# is that JavaScript is a dynamically typed language and C# is a static or strongly typed language. This means that you can define a variable and assign a string to it and later in the code assign a number to it without causing an error. If you do that in C# your code will not compile. That is what we love about C#, the compiler lets us know if we do something that is a bad practice.

Another key difference is how scoping works. Most C# developers struggle with this when it comes to the "this" keyword. "This" is not always the object or function you are in. It is determined by how the function or object is called. "This" throws most people for a loop. Pun intended.

There are other differences but a key thing to understand is that as JavaScript's standards are evolving many things are improving. Some of these differences are going away as browsers catch up with the new ECMAScript standards.

How does inheritance work differently in JavaScript?
Inheritance is different in JavaScript than it is in any other languages. Since JavaScript is a dynamic language, it allows objects to be changed at run time. We can use a concept called Prototypes to add the behavior of one object to another. That is how JavaScript inheritance works. We add the behaviors of the base class to the concrete class at run time.

As you point out in your Visual Studio Live! Boston session on this topic, Design Patterns are key to using JavaScript effectively for larger applications -- what are your top tips for C# developers when it comes to JavaScript Design Patterns?
One of the most important patterns to understand in JavaScript is the Module pattern. This pattern is used to encapsulate functionality in JavaScript. In essence, they can be used to create something that is equivalent to a class in C#. The Module pattern uses the scoping functionality in JavaScript to keep certain variables and/or functions private to the Module. It can then "reveal" the variables and functions it allows the consumers of the module to use.

"Another pattern that a JavaScript developer must become very familiar with is the idea of a Promise. A Promise is the way JavaScript handles async programming."

Ben Hoelting, C# MVP, Senior Technologist, Aspenware

Another pattern that a JavaScript developer must become very familiar with is the idea of a Promise. A Promise is the way JavaScript handles async programming. So, most of the popular frameworks return a Promise when potentially long-running/thread-blocking functions are called. This is a Promise to call back to the consumer when the long-running process is complete. It is similar for the Async pattern in C#, but implemented differently.

Obviously, there are many other patterns to learn but these two will help you get started with JavaScript programming.

What is the number one thing that you recommend C# developers to NOT do when they're picking up JavaScript Patterns?
Some of the biggest issues with JavaScript programming do not have anything to do with patterns or coding. The biggest issues come down to building, packaging, deploying and debugging your code. In JavaScript development, the browser is the compiler and the runtime environment. So, figuring out how to develop and debug your code quickly to be the most productive is key.

What else should developers know about this topic?
I think any C# developer that is planning to build a complex client-side application like a Single Page Application (SPA) should use TypeScript. TypeScript adds syntax to JavaScript that allows developers to compile their application as they are coding it. What I mean by this is that Visual Studio or VS Code can give you red squiggles as you code. So, you don't have to wait to run it in a browser to see any JavaScript errors. This gives early feedback to developers and helps to enforce best practices.

Learn more about this and other great topics and Visual Studio Live! Boston in June 2018.

About the Author

Becky Nagel is the vice president of Web & Digital Strategy for 1105's Converge360 Group, where she oversees the front-end Web team and deals with all aspects of digital projects at the company, including launching and running the group's popular virtual summit and Coffee talk series . She an experienced tech journalist (20 years), and before her current position, was the editorial director of the group's sites. A few years ago she gave a talk at a leading technical publishers conference about how changes in Web browser technology would impact online advertising for publishers. Follow her on twitter @beckynagel.

comments powered by Disqus

Featured

  • Steve Sanderson Wows Web-Devs with Peek at 'Blazor United' for .NET 8

    "We've started some experiments to combine the advantages of Razor Pages, Blazor Server and Blazor WebAssembly all into one thing."

  • Spring Cloud Azure 5.0 Ships with Updated, Redesigned Documentation

    "We've created a new online resource, Azure for Spring developers, to help Spring developers code, deploy and scale their Spring applications on Azure.

  • What's New in Progress Telerik UI for Blazor, .NET MAUI and WinForms

    The company said its new Progress Developer Tools R1 2023 release includes design and accessibility upgrades, deeper customizations and support for the latest frameworks.

  • Take ChatGPT for a Spin with VS Code Tools

    With ChatGPT being the first "It" tech in the cutting-edge AI space that regular people can play around with, it's no wonder that tools to use it are exploding in the Visual Studio Code Marketplace.