Forem: Martin Nordström

Javascript Algorithms Challenges | Part 2

Martin Nordström — Sat, 07 Apr 2018 21:46:31 +0000

Hey again!

This is the second part of my Javascript coding challenges and I'm super excited to get into it. I want to thank you all for the very kind response that I got in my first article and I especially want to thank the Dev.to team for featuring it on their Twitter!

If you haven't read the first one, you can do it here: Javascript Algorithms Challenges | Part 1

Let's get into the challenges now! :-)

Prerequisites

I will be using Node.js to run the Javascript code, so you should install that before continuing.

I have created some start code for this article so you can get started quick! Here it is:

/*
Author: Martin Nordström
Created: 2018/04/07 
Keep coding!
*/

// MAX CHARACTER CHALLENGE
// Return the character that is most common in a string
function maxCharacter(str) {}

// FIZZBUZZ CHALLENGE
// Write a program that prints all the numbers from 1 to 100. For multiples of 3, instead of the number, print "Fizz", for multiples of 5 print "Buzz". For numbers which are multiples of both 3 and 5, print "FizzBuzz".
function fizzBuzz() {}

When you have Node.js installed and the start code you are ready to go! :-)

Challenge 1 — Max character

There's a lot of different ways you can approach and solve this problem. I want to show you one that is kinda complicated, but I believe it's a really good way to better up your skills and show off if you are getting this problem at an interview.

What we need to do is show the most common character in a string. For example:

maxCharacter('lollipop') == 'l'

As you can see the most used character in the string lollipop is l.

We are first going to create an object as a map. So we will be creating an empty object.

function maxCharacter(str) {
  const charMap = {};
}

After that, we want to loop through the string as an array. We first use the split() method to make the string into an array and then use forEach() to loop through every index in the array. Note that we need to provide forEach() a function that it will call each iteration.

function maxCharacter(str) {
  const charMap = {};

  str.split('').forEach((char) => {

  });
}

We want to look through each key-value pair since it's going to be key-value pairs of the actual character and how many of them that are inside. So if the key exists we want to add 1 to it so we can see which one is the biggest. And if no character has been found yet, like the first character of the string, we just want to add 1 to it.

function maxCharacter(str) {
  const charMap = {};

  str.split('').forEach((char) => {
    if (charMap[char]) {
      charMap[char]++; // This will add 1
   } else { // If no letter has been found yet
       charMap[char] = 1;
      }
  });
}

If we try to run this function with the string lollipop we will get:

{ l: 3, o: 2, i: 1, p: 2 }

As you can see it does notice wich character is most used in the string! Which is l in this case.

By the way! I'm calling the function like this:

const output = maxCharacter('lollipop');

console.log(output);

Since it doesn't work if I don't and if you know why please let me know!!

Now we have to return the character that is most common in the string. For that, I will be using a for in loop, which is used to loop through an object, instead of an array. We also going to add two more variables. maxChar and maxNum. They will both equal "nothing", meaning empty string an just a 0. maxChar is going to be the actual number that has the most occurrences and maxNum will be that number. So for lollipop maxNum will be 2 and maxChar is going to be l.

I should also say that we will create the variables with let and not const since the values of the variables will change.

We can check that with an if statement:

for (let char in charMap) {
  if (charMap[char] > maxNum) {
    maxNum = charMap[char];
    maxChar = char;
  }
}

Here we are checking if the key is greater than the maxNum (which it will be the first iteration). So we will set maxNum to the actual value and then we will set the maxChar to the actual character. And then just return the maxChar.

What we will have is this:

function maxCharacter(str) {
  const charMap = {};
  let maxNum = 0;
  let maxChar = '';

  str.split('').forEach((char) => {
    if (charMap[char]) {
      charMap[char]++; // This will add 1
   } else { // If no letter has been found yet
       charMap[char] = 1;
      }
  });

  for (let char in charMap) {
    if (charMap[char] > maxNum) {
      maxNum = charMap[char];
      maxChar = char;
    }
  }
  return maxChar;
}

const output = maxCharacter('lollipop');

console.log(output); // Gives us l in this case

Congrats! You now know how to check the most common character in a string with Javascript!

Challenge 2 — Fizzbuzz

The last challenge for this article is a popular one and you probably have heard of this. It's super popular in interviews and in schools. I did this in C++ once in my programming class for example.

What we first going to do is create a for loop. And in the for loop we are going to set a variable to 1 and say that as long as that variable is less, or equal to 100 we will keep looping and lastly we also want to increment that variable.

function fizzBuzz() {
  for (let i = 1; i <= 100; i++) {
    console.log(i) // 1,2,3,4,5,6,7,8....100
  }
}

What we want to happen is every multiple of 3 (3, 6, 9, 12 etc) we want to print the word fizz. And every multiple of 5 (5, 10, 15, 20 etc) we want to print the word buzz. And every time we get the same multiple for the two numbers, like 15 we want to print fizzbuzz.

If you know how to use the modulus operator you can solve this pretty quickly and easily.

We are just going to create an if statement that looks like this:

if (i % 3 === 0) {
  console.log('fizz');
} else {
  console.log(i);
}

Modulus will just give us a remainder and if there's no remainder it's a multiple. Otherwise, we will just output the number. If we run this we will get the following output:

1
2
fizz
4
5
fizz
7
8
fizz
10
11
fizz

And as you can see, no 3 or 6 or 9 etc!

For the number 5, we can just create an else if` statement inside of the if statement. And replace the 3 with 5 in this case. Like this:

if (i % 3 === 0) { console.log('Fizz'); } else if (i % 5 === 0) { console.log('Buzz'); } else { console.log(i); }

And that will give us:

1 2 Fizz 4 Buzz Fizz 7 8 Fizz Buzz 11 Fizz 13 14 Fizz // Gotta fix this!!

It works! But we need to fix that every time there's a multiple of 3 and 5 together we want to print put FizzBuzz. As you can see, the number 15 is being printed out as Fizz which is no bueno.

What we can do is make our current if statement an else if statement, because we want to check if there are any "FizzBuzz" numbers out there first.

`
if (i % 3 === 0 && i % 5 === 0) {
console.log('FizzBuzz');
} else if (i % 3 === 0) {
console.log('Fizz');
} else if (i % 5 === 0) {
console.log('Buzz');
} else {
console.log(i);
}

This will give us:

1 2 Fizz 4 Buzz Fizz 7 8 Fizz Buzz 11 Fizz 13 14 FizzBuzz

And that's it! You have now completed the famous FizzBuzz challange!

Also, you can shorten this up a little bit by replacing
if (i % 3 === 0 && i % 5 === 0) with if (i % 15 === 0)
Because if it's a multiple of 15 it will be a multiple by 3 and 5.

Last Remarks

Thank you for reading the second part of my “Javascript Algorithms Challenges” series. I hope you have learned something new that you might be able to use later in the future! I will try to find more fun and instructive challenges. So please follow me here or on my other social media platforms to get news about the upcoming articles!

Martin Nordström

Instagram | Twitter | Github

Javascript Algorithms Challenges | Part 1

Martin Nordström — Tue, 13 Mar 2018 09:24:56 +0000

This is the beginning of a series I will be writting about coding challanges in Javascript and how to solve them (in SOME ways).

Why even bother with reading this?

If you are planning on becoming a good programmer I bet some of you have plans on getting a job in the future. And when getting a job you have to go through a process, of which contains interviews and probably coding challenges. Some can be on a whiteboard at the company or on your computer at home. Companies usually do these types of tests because of:

It shows that you know your programming logic
It shows that you have critical thinking skills
It shows how you can work under pressure
It just shows the company a general picture of how you code

Therefore it’s good to know and get better at writing algorithms since it’s probably those the company want’s you to write.

I have therefore decided to start a series, “Javascript Algorithms Challenges”, where I will bring up different challenges and show how to solve them (in some ways) to make you get a better understanding about writing algorithms and understand them.

Prerequisites

I will be using Node.js to run the Javascript code, so you should install that before continuing.

I have created a Gist for this article so you can get started quick! Here it is:

/*
Author: Martin Nordström
Created: 2018/03/09 
Keep coding!
*/

// REVERSE A STRING CHALLENGE
// Return string in reverse
function reverseString(str) {}

// PALINDROME CHALLENGE
// Return true if palindrome and false if not
function isPalindrome(str) {}

When you have Node.js installed and the Gist downloaded you are ready to go! :-)

Challenge 1 — Reverse a string

Since this challenge is pretty simple I will include a couple of ways on how to solve it so you can get an idea that there’s a lot of different ways to accomplish the same results. Here’s what we will start with:

function reverseString(str) {}

The first thing we could do is create a new variable and we’re going to set that to the string that’s passed in with split(). Since split() turns a string into an array and takes in a parameter of a separator. And because we want each character to be put in its own array value we will just be setting the parameter to ''. It will look like this:

function reverseString(str) {
  const strArray = str.split('');
}

Then we could use the array prototype method reverse() which will just reverse the array (smart right?). So let’s overwrite the current value.

function reverseString(str) { const strArray = str.split(''); strArray.reverse(); }

To test this we can call the function and pass in a string to see what this gives us. And let’s not forget to put a console.log() at the bottom of the function.

function reverseString(str) {
  const strArray = str.split('');
  strArray.reverse();
  console.log(strArray);
}
reverseString('Hello Medium');
// Output:
[ 'm', 'u', 'i', 'd', 'e', 'M', ' ', 'o', 'l', 'l', 'e', 'H' ]

Now that we get the array in reversed order we can just turn it back to a regular string. And we can do this with join() which joins the elements of an array into a string and returns the string. We can also specify a separator like we did with split(). So let’s return the new string with the join() method applied. The code will then look like this:

function reverseString(str) {
  const strArray = str.split('');
  strArray.reverse();
  return strArray.join('');
}
reverseString('hello');
// Output: muideM olleH

This works fine, but it is really messy. We honestly don’t even need the strArray variable! What we can do to clean this up is to just chain these methods together, like this:

function reverseString(str) {
  return str.split('').reverse().join('');
}
reverseString('Hello Medium');
// Output: muideM olleH

Instead of using these methods we could also use the good old FOR loop! For this example we will be using a decrementing FOR loop.

The first thing we should do is create a new variable that contains an empty string that will host the new created string.

function reverseString(str) {
  let revString = "";  
}

The second step is to create the actual for loop. We will be using the str length, but like this: str.length — 1 since that it will correspond to the last letter in the string. In our case, “m”. We will also loop as long as i is greater than or equals 0 and decrement i after each iteration. Then add the newString variable to it’s self and to the index value of the array str. We also have to return the revString.

function reverseString(str) {
  let revString = "";

  for (let i = str.length - 1; i >= 0; i--) {
    revString += str[i];
  }

  return revString;

}
reverseString('Hello Medium');
// Output: muideM olleH

Congrats! You now know two ways to reverse a string in Javascript!

Challenge 2— Palindrome

First, a palindrome is a word or a phrase that’s the same whether it’s forward or backward. Some examples:

Anna
A but tuba
Are we not pure? “No sir!” Panama’s moody Noriega brags. “It is garbage!” Irony dooms a man; a prisoner up to new era

So what we are going to do is to return true if the word or phrase is a palindrome or return false if it’s not a palindrome. Pretty simple stuff!

This is our starting block of code:

function isPalindrome(str) {}

The first we could do is reverse the string, set it’s value to a variable and since we already know how to do it this one will be super easy! I will go with our first solution since it’s the most practical (in my opinion).

function isPalidrom(str) {
  const revString = str.split('').reverse().join('');
}

And since a palindrome is the same thing forward as it is backward we can just check if the two different strings are equal!

function isPalidrom(str) {
  const revString = str.split('').reverse().join('');

  return revString === str;
}

We can also tidy up the code a little bit and of course call the function and pass in a string.

function isPalidrom(str) {
  return str === str.split('').reverse().join('');
}
isPalidrom('Hello Medium');
// Output: false

As you can see this will return false since “Hello Medium” is not a palidrom! But “Are we not pure? “No sir!” Panama’s moody Noriega brags. “It is garbage!” Irony dooms a man; a prisoner up to new era” is!

function isPalidrom(str) {
  return str === str.split('').reverse().join('');
}
isPalidrom('Are we not pure? “No sir!” Panama’s moody Noriega brags. “It is garbage!” Irony dooms a man; a prisoner up to new era');
// Output: true

One quick note thought! If we type in rAceCar it will return false since we have a capital C? and a capitalA`. But don’t worry, the fix is super easy!

function isPalidrom(str) { str = str.toLowerCase(); return str === str.split('').reverse().join(''); } isPalidrom('Are we not pure? “No sir!” Panama’s moody Noriega brags. “It is garbage!” Irony dooms a man; a prisoner up to new era'); // Output: true

Here we are just making the string to be lowercase and then compare them two.

Congratulations again! You now know how to check after palindromes with Javascript as well!

Last Remarks

I hope you found this helpful. This is the first part of my “Javascript Algorithms Challenges” series. I will try to find more fun and instructive challenges. So please follow me here or on my other social media platforms to get news about the upcoming articles!

Goals

I have many goals this year. The most important one is to become a better developer in general, but also reach 100 followers on Medium and publish more content here that will help others to learn new things. Knowledge is power!

Martin Nordström

Instagram | Twitter | Github

This article was originally posted on Medium. If you want to check it out there, follow this link: Original Article

Callback Functions in NodeJS

Martin Nordström — Tue, 06 Mar 2018 00:05:57 +0000

What is Node.js?

NodeJS is a runtime for server side “Javascripting”. You probably already know that we have Javascript in thr client side (browser) that pretty much power everything we see online. And there’re a lot of different client side frameworks that runs on Javascript, like React, Angular, Vue etc. But what NodeJS lets us do is to run it on the server side.
NodeJS is also an asynchronous platform, it doesn’t wait around for things to finish, it’s non-blocking. But how does it do that? Callbacks!
Callback is a function that is called at the completion of any given task. So if I tell Node to go and to something, once that task is completed we can have a callback function to do something else. It basically allows other code to run in the meantime.
So I’d like to show what that does and what it looks like.

The Code

We can start off by brining in the file system package because I want to work with some files on my disk. I’ve pre-written a file named helloWorld.txt in the same directory as my app.js.

const fs = require('fs')

Now we’re going to make an anonymous function:

const fs = require('fs')
let results = (path) => {
  fs.readFile(path, 'utf8', function(err, contents) {
    console.log(contents)
  })
}
results('./helloworld.txt')

The first thing we do is passing in the path. Then we want to asynchronously read in a file, so we give it a path, an encoding utf8 and finally we pass in a callback function (I didn’t use an arrow function because it will easier if you see the keyword function). That function will execute once the read file is completed.

This is the order once more:

readFile() will run.
function(err, contents) will run after readFile() is completed.

In our callback function, we are passing in an error, not because we’ll get one, but because we follow the standard callback pattern. We also pass in the contents that will come back from reading the file.

So far we’ve created a very standard anonymous function (we haven’t given it a name) that takes a path and we store it in the let results.

Finally we can call reader just by calling the function with () and passing in a path.

Hit CMD + S or Ctrl + S , bring up your console and then type node app.js (or whatever you named your file). Your output should be what’s inside of your text file.

And your done!

How I Landed My First Developer Job After 78 Days.

Martin Nordström — Mon, 05 Mar 2018 22:09:42 +0000

“Life is like riding a bicycle. To keep your balance you must keep moving.” — Albert Einstein.

Background

It wasn't till I got into high school my interest for programming started to develop, before that. I hated it. My friend Oskar introduced me to web development about one year ago and I started to enjoy it. I never became a pro, but I managed to create some websites, i.e. my own. So, I first touched code about one year ago.

Related experience

Before I got into development I was a web developer, but after some time I got tired of it and wanted a change. So I downloaded Xcode from the App store and booted up the playground. After some time I started to get comfortable with Swift. I believe that you never know when you are ready for something, you just need to take the shot, so I started to apply for internships over the summer, even though I’ve been coding with Swift for about 1,5 months (crazy, I know).

I took the shot

I applied to a lot of companies, too many for me to remember. My inbox was filled with emails containing: “Sorry, but we can’t take in you right now”, “There’s no space here”, “You need more experience” etc. But I never gave up, I continued to search and apply, till one startup was interested and wanted to meet me. The first thought I got was; “What the f*ck have I done?!”, but I acted cool and went on their meeting.

They liked me (I think) and decided to send me a test. The test was related to what they’re doing and if I pass the test I will have good prerequisites to get the job. I won’t go into too much detail about the test, but I wanted to rip my hair off because I had no idea what I was doing. But again, I didn’t give up, I continued to work and learn because I wanted the job so bad.

“You can do anything you set your mind to”, Benjamin Franklin.

And I passed it and got the job. I got the agreement, signed it and poof, I was a hired as a developer. I went from watching videos and reading about software development and used my self-taught knowledge to get a job as a developer. I was so proud and the feeling was amazing.

How I did it

Step 1 — Teaching Myself Software Development

The first and oblivious part is to teach yourself software development. I actually began with buying a course on Udemy. I followed along on some videos, but I wanted a different kind of learning recourse, so I started to read Hacking with Swift. A really great book with a lot of small projects which gives you a foundation around software development. But after some time I realized that the most effective way to learn is by doing. Try different things, make small apps and just hack along!

Step 2 — Showcasing Myself

I began to upload my projects to my Github profile so I have somewhere to showcase them and show that I am an active developer. I also started to build up my LinkedIn profile so I would look more professional.

Step 3 — Introducing Myself to the Company

When I started to feel comfortable with software development, I started reaching out to companies in my area. At first, everything felt hopeless, no one responded to my email and those who did ditch me. But after a while, one startup responded and wanted to meet me.

Step 4 — The Interview

The final, scariest and most important part in the process. I watched countless of hours how to nail an interview and how to act cool, but nothing helped. This is where you will talk about the apps you’ve built, the skills you have and why want to be an software developer. If the interview went well, they will probably send you a test that they want you to pass, and if you pass it, you’re home safe.

Last Remarks

I hope you got some insights about how to take your coding career to the next level and that you found at least one thing valuable!

Martin Nordström

Instagram | Twitter | Github

This article was originally posted on Medium. If you want to check it out there, follow this link: Original Article