JavaScript: Building Custom Functions, for Greater Programming Enjoyment (`console.log` and `===`)

DISCLAIMER: I am still just starting to learn JavaScript, so this post may contain errors or incorrect information. I also haven’t spent much time editing it, as I was originally just planning to post it on the course specific Launch School forum, but I thought maybe it would be helpful to more people if I made a blog post instead. This is definitely a post geared towards beginners like me, so you probably won’t find it to be very useful if you have much experience. Please feel free to let me know if you notice any issues.


I just finished making three custom functions, which may prove to be useful to you as well. Well maybe not the actual functions themselves, which are still very much “rough drafts”, but conveying the idea that it’s easy to make your own custom functions. Using such functions can make your programming experience much more enjoyable and less repetitive.


I got tired of typing console.log() all the time, especially because I am used to Ruby’s much more concise Kernel#p method. So I decided to make a custom console.log() style function, with functionality similar to Ruby’s p. It accepts zero or more arguments, like console.log(). But instead of always returning undefined, it returns the argument(s) passed in, like Ruby’s p. This can be really useful when you want to log an expression and still be able to use its return value, such as in the return statement of a function. Here is the code of the p function:

// p - combination of `console.log` and Ruby's `Kernel#p`:
const p = (...args) => {
args.length > 0
? console.log(...args) // logs 1+ comma separated arguments - ex: console.log(1, 'a', [])
: console.log(''); // logs a blank line if no arguments.
return args.length === 0
? undefined // returns undefined if no arguments passed.
: args.length === 1
? args[0] // returns single argument's value if one argument.
: args; // returns all args as an array if 2+ arguments.
};

I also created an equality function, eql, that can be used to determine if the JSON string representation of two objects or values are equal. It can be used to test for array equality in exercise test cases:

// Equality function:
// Converts each argument to a string, then determines if they are equal.
// This allows comparison of arrays, which can be useful for exercise test cases.
const eql = (a, b) => {
return JSON.stringify(a) === JSON.stringify(b);
};

The third function I made, elog, combines of the first two. First it logs the two arguments passed in using p, then it invokes eql and returns the value returned by eql:

// Equality-Logger: logs both objects, and returns true if equal.
const elog = (a, b) => {
p('a =>', a); // logs each argument using the `p` function, with a readable notation.
p('b =>', b);
return p(eql(a, b)); // logs and returns the return value of `eql`
};

It’s actually very easy to be able to use any custom functions like this in all your code if you write your code in an HTML file and run it via a web browser. (I’m not sure about other methods, as that is the only way I’ve been doing it so far.) All you have to do is add an extra <script> tag above the one where your code is referenced or located, and then these functions will be available for use everywhere, even directly in the DevTools Console, which makes it very convenient to set up and use. Here is how I have mine set up:

<body>
<script src='good_functions.js'></script>
<script src='exercises/small_problems/list_processing.js'></script>
</body>

I just made all this less than an hour ago, so I haven’t been able to test or use it too much yet, so I apologize for the poor style and possible bugs/errors (in both the blog post and the code). I tried it with a few test cases, and so far it’s been working as expected, but I definitely wouldn’t rely on it for anything important without further testing.

I was thinking about making a custom console.log function for a while, but I kept putting it off because I thought that it would be more difficult and less useful than it turned out to be. Now that I realize how little time it actually took, and how it’s already been making my programming experience much more enjoyable, I wish I had started doing this sooner.

The main point I want to make is that it’s not hard to create your own custom functions like this, which can be really useful. I’m not sure if this is something obvious to most people, but to me it feels like a valuable discovery, which is why I wanted to share it in this blog post.

Please feel free to use the above code freely, either as is, or as a starting point for building your own functions. Also please let me know if you have any questions, feedback, or would like a more detailed explanation of any of the above.