article This originally appeared on dormoshe.io How much time do you waste on writing logs for your functions? How many times do you change your function name and forget to change the name in the log message? How many time do you find yourself regretting that you didn’t add a log for knowing if the function was called? regrets, forgets, wasting time — just use the magical Typescript feature — Decorators. NO MORE NO MORE NO MORE In this article, we will review the rich logger decorators and their cool options. In the near future, I will publish another article in order to explain how to build decorators like these. TL;DR You can find the decorators in my GitHub and use them via . If you have further improvements, please make a pull request. repository npm Installation npm i rich-logger-decorator Basic usage In this example, we will use only the decorator in order to log all the class methods. ClassLogger Basic example And the console looks like: Basic example output Mixed decorators and options In this example, we use the and decorators with the default options and the decorator with custom options. ClassLogger DiableMethodLogger MethodLogger Mixed example And the console looks like: Mixed example output @Logger decorator The Logger is the main decorator. If we want to be precise, this is a decorator factory because this function is getting an argument and returns a function, but it is not the subject. The Logger decorator needs to be on top of the function you want to log. The log messages will be printed before the function will start and after the function will end. This decorator can get options which define the behavior of the flow and, eventually, affecting the log messages. When the options do not supply, the defaultFunctionLoggerOptions object is used by the decorator. The options are defined by the FunctionLoggerOptions interface. FunctionLoggerOptions This is the interface of the Logger decorator options argument. Function logger options interface As you can see the interface contains some properties. — this property can be boolean or array of strings. When the value is , the arguments and their values will not be a part of the log message. When the value is , all the argument and their values will be a part of the log message. When the value is an , the arguments, that their names contained in the array, will be a part of the log message. withArgs false true array of strings — when the value is true, the time will be a part of the log message. withTime — when the value is and the function is a method of a class, the class properties, and their values will be part of the log message. This option can be also an of the class (will behave like , just for class properties). withClassProperties true array of the properties names _withArgs_ —a function that replaces the traditional . This function will be called with the log message at the start and the end of the original function. logFunction console.info — a function that gets the resulted string of the decorator flow and logs the customized message. This function gets the time, class name (if exist), function name, start/end log, strings array of the arguments and their values and strings array of the class properties and their values. formatAndLogFunction All of the options are optional. DefaultFunctionLoggerOptions defaultFunctionLoggerOptions is an object with default values for LoggerOptions. The default values are: — true withArgs — true withTime — false withClassProperties — the console.info function logFunction —no default value. When the value doesn’t exist, the default behavior happened. formatAndLogFunction @ClassLogger decorator The used by classes. When you put the decorator on top of the class definition, all the methods in the class are logged automatically. This is so convenient to put the decorator and watch the magic happened. ClassLogger As the decorator, the decorator can get options which define the behavior of the flow and eventually affects the log messages.When the options do not supply, the used by the decorator. The options are defined by the interface. Logger defaultClassLoggerOptions ClassLoggerOptions ClassLoggerOptions This is the interface of the decorator options argument. ClassLogger Class logger options interface As you can see the interface contains some properties. —the options for the methods of the decorated class. Same as the options of the Logger function decorator. methodOptions — array of method’s names that being logged. When the option is undefined, all the class methods are logged. loggedMethodsNames All of the options are optional. DefaultClassLoggerOptions is an object with default values for . The default values are: defaultClassLoggerOptions ClassLoggerOptions —same as of the function decorator. methodOptions defaultLoggerOptions — undefined (so all the class methods will be logged) loggedMethodsNames Additional decorators For more convienient usage we will see two more decorators that make our life easier. @DisableLogger decorator When you are using the decorator (without the methods array option), all the class methods will be logged. In order to disable specific method for being logged, you can put the decorator before the method definition. This is a clearer way to prevent the logger behavior than the method array option, because of the second one restricts us to write the method name in the array. ClassLogger DisableLogger @LoggerWithoutArgs decorator This decorator is a syntactic sugar of the Logger decorator with option of false. Namely, the argument and their values will not be part of the log message. If other options will be provided, the decorator will use them, except for the option. withArgs withArgs Conclusion The decorators are available to use via the npm package. From now on, the logging feature is easy to use than ever. All you need is to use the rich-logger-decorator and that’s it. You can configure the decorator with the options and just coding… rich-logger-decorator The next part of the article can be found . here You can follow me on dormoshe.io or Twitter to read more about Angular, JavaScript and web development.
