Javascript

Dijkstra's Algorithm on JavaScript

Koowoy
Definition of Dijkstra’s Algorithm Algorithm to calculate the shortest path from one vertex of a graph to another vertex, using a priority array Input and Output Input: starting vertex, ending vertex Output: an array of vertices consisting of the shortest path from start to end in order Logic 1. To begin with, 4 variables need to be initialized. distances object: used to store the shortest distance from start to each vertex previous object: used to store the previous vertex of the path shortest to the current vertex priority queue: used to store vertices to pay visits to, in ascending order of distances from the starting vertex to the current vertex, this will be used for looping through the graph path: an array for storing path info at the end for returning the path 2.

Sorting Algorithms

Koowoy
1. Bubble Sort In each loop, place the largest number on the top, creating a “bubble” const bubbleSort = (arr) => { for (let i = arr.length - 1; i > 0; i--) { let swap = false; for (let j = 0; j < i; j++) { if(arr[j] > arr[j + 1]) { let temp = arr[j + 1]; arr[j + 1] = arr[j]; arr[j] = temp; swap = true; } } if(!

JavaScript Recursion Exercise

Koowoy
Flatten Create a function that flattens all nested arrays in the given array. My initial instinct was to use the JavaScript function .flat() and recursion. However, a problem occurred with the base case. In order for recursion to function correctly, the base case needs to be set to determine if the recursion should stop. In my above solution, I wanted to compare the array before and after flattening it.

Problem Solving Patterns

Koowoy
Source: JavaScript Algorithms and Data Structures Masterclass Frequency Counter When counting frequency of iterable objects, avoid nested looping that results in O(n^2), by using objects or sets to collect values. Example Create a function named “same” that compares 2 arrays, and check if one array contains the squared values of the other, with matching frequencies The Naive Solution Use nested loop to check if squared value of current looping element exists.

[JavaScript] Sending AJAX Request to Django Backend for Spotify Music Search

Koowoy
Task Create a search input and add an event listener to it in JavaScript. Whenever the search query changes, send a request to the view in the backend via url. Code // Function to Get Token function getCookie(name) { let cookieValue = null; if (document.cookie && document.cookie !== "") { const cookies = document.cookie.split(";"); for (let i = 0; i < cookies.length; i++) { const cookie = cookies[i].trim(); // Does this cookie string begin with the name we want?

[JavaScript] Custom Music Player

Koowoy
Background The audio tag from HTML provides a default music player, or more specifically the browser provides a controllable music player for audio tags. However, since this is powered by the browser, customizing the player to fit the style and need of the web page is impossible. Therefore the alternative is to create a custom music player that is connected to the original audio source. Code HTML <!-- hidden audio tag (with tachyon display-none class) --> <audio class="media-player dn" src="{{ post.

TIL of the Past: 20-10-10

Koowoy
Promise The Promise object represents the eventual completion (or failure) of an asynchronous operation and its resulting value. In simple words, promise is used to process async operation, and when successful it returns a single value. It is mainly used to process data received from a different source and display on the page. Before promise, async operations were processed with a chain of callback functions, which, in complex cases, made the code very hard to read.

[Javascript] Conversion from if statement to OR expression | Deconstruction

Koowoy
The following themes are newly learned features of Javascript. Short-Circuit Evaluation and OR Expression While using the logical operators, for instance and, or, and not, there are cases where the assessment of the second value is irrelevant. For example in OR expressions, when the first value is true, the expression is true no matter the second value of the expression. In these cases, Javascript chooses not to evaluate the second value, and this is called “short-circuit evaluation”.

TIL of the Past: 20-10-07

Koowoy
React - Create React App Creating a react app was… harder than I expected, although Repl.it supported React template and even the Create React App template. Concept of React With React, front end can be broken down into “Components”, which allows for further uses of the function later on. Literally, it means that parts of html is written in pieces in javascript form, so that it can be written more efficiently with lots more extensibility.

TIL of the Past: 20-10-03

Koowoy
JavaScript - Advanced Loop Along with the for, while, do, and forEach loop, the topic in this section was the usage of for of and for in loop. The idea is generally similar to the one of forEach loop, but the difference of ‘for in’ loop compared to the other two was that ‘for in’ was enumerating, while the other two were iterating. A more thorough explanation is provided by this link, to be honest, I’m still not 100% sure.