Monthly Archives: October 2020

JavaScript || How To Get A Variable Name As A String Using Vanilla JavaScript

The following is a module with functions which demonstrates how to get the name of a variable as a string using vanilla JavaScript.


1. Simple Variable

The example below demonstrates the use of ‘Utils.nameOf‘ to get name of a simple variable.


2. Array

The example below demonstrates the use of ‘Utils.nameOf‘ to get the name of an array.


3. Function

The example below demonstrates the use of ‘Utils.nameOf‘ to get the name of a function.


4. Utils Namespace

The following is the Utils.js Namespace. Include this in your project to start using!

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.

JavaScript/CSS/HTML || Notice.js – Simple Notification Message With Success, Warning & Error Icons Using Vanilla JavaScript

The following is a module with functions that demonstrates how to display a simple notification message with success, warning & error icons.

Using vanilla JavaScript, the message fades in and is displayed to the page, and fades out after a delay (in milliseconds). It’s look and feel can also be adjusted via CSS.

Notice.js & CSS Source

Contents

1. Basic Usage
2. Notice HTML
3. Notice.js & CSS Source
4. More Examples

1. Basic Usage

Syntax is very straightforward. The following demonstrates the JavaScript used to show the notification message. The message fades away after a specified amount of time (in milliseconds).

Sample:

Sample


2. Notice HTML

If you wish to show the messages without using JavaScript, the following is an example of the HTML used to display the notices.

Sample:

Sample

Sample:

Sample

Sample:

Sample


3. Notice.js & CSS Source

The following is the Notice.js Namespace & CSS Source. Include this in your project to start using!

The following is Notice.css.


4. More Examples

Below are more examples demonstrating the use of ‘Notice.js‘. Don’t forget to include the module when running the examples!

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.

JavaScript || How To Get All Unique Values In An Array & Remove Duplicates Using Vanilla JavaScript

The following is a module with functions which demonstrates how to get all distinct values in an array & remove duplicates from a simple and object array.

The functions on this page allows for an optional selector function as a parameter, which makes them general enough to work on arrays of any type.


1. Simple Array

The example below demonstrates the use of ‘Utils.arrayUnique‘ to get unique values from a simple array.


2. Object Array

The example below demonstrates the use of ‘Utils.arrayUnique‘ to get unique values from an object array.

In this example, a selector is used, which extracts the value to be used in the evaluation.


3. Mixed Array

The example below demonstrates the use of ‘Utils.arrayUnique‘ to get unique values from a mixed array.

In this example, a selector is used, which extracts the value to be used in the evaluation.


4. Utils Namespace

The following is the Utils.js Namespace. Include this in your project to start using!

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.

JavaScript || Circular Array – How To Index Into Array As If It Is Circular Using Vanilla JavaScript

The following is a module with functions which demonstrates how to index into an array as if it is circular using Vanilla JavaScript.

This function adjusts a range as circular and ‘wraps around’ the value to become in bounds.


1. Circular Array

The example below demonstrates the use of ‘Utils.circularWrap‘ to index into an array as if it is circular.


2. Utils Namespace

The following is the Utils.js Namespace. Include this in your project to start using!

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.

C++ || How To Find All Combinations Of Well-Formed Brackets Using C++

The following is a program with functions which demonstrates how to find all combinations of well-formed brackets.

The task is to write a function Brackets(int n) that prints all combinations of well-formed brackets from 1…n. For example, Brackets(3), the output would be:

()
(()) ()()
((())) (()()) (())() ()(()) ()()()

The number of possible combinations is the Catalan number of N pairs C(n).


1. Find All Well-Formed Brackets

The example below demonstrates the use of the ‘brackets‘ function to find all the well-formed bracket combinations.

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.

Once compiled, you should get this as your output


Pair: 1, Combination: ()
Pair: 2, Combination: (()), ()()
Pair: 3, Combination: ((())), (()()), (())(), ()(()), ()()()
Pair: 4, Combination: (((()))), ((()())), ((())()), ((()))(), (()(())), (()()()), (()())(), (())(()), (())()(), ()((())), ()(()()), ()(())(), ()()(()), ()()()()

JavaScript || How To Find All Combinations Of Well-Formed Brackets Using Vanilla JavaScript

The following is a module with functions which demonstrates how to find all combinations of well-formed brackets.

The task is to write a function Brackets(int n) that prints all combinations of well-formed brackets from 1…n. For example, Brackets(3), the output would be:

()
(()) ()()
((())) (()()) (())() ()(()) ()()()

The number of possible combinations is the Catalan number of N pairs C(n).


1. Find All Well-Formed Brackets

The example below demonstrates the use of ‘Utils.brackets‘ to find all the well-formed bracket combinations.


2. Utils Namespace

The following is the Utils.js Namespace. Include this in your project to start using!

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.

JavaScript || How To Calculate Nth Catalan Number Using Vanilla JavaScript

In combinatorial mathematics, a Catalan number forms a sequence of natural numbers that occur in various counting problems. It can be used to determine how many different ways to split something up.

The following is a module with functions which demonstrates how to calculate nth Catalan number.


1. Calculate Nth Catalan Number

The example below demonstrates the use of ‘Utils.catalan‘ to calculate nth Catalan number.


2. Utils Namespace

The following is the Utils.js Namespace. Include this in your project to start using!

QUICK NOTES:
The highlighted lines are sections of interest to look out for.

The code is heavily commented, so no further insight is necessary. If you have any questions, feel free to leave a comment below.