Deep Tech Point
first stop in your tech adventure
Home /
January 21, 2022 | Javascript

In this article, you will get to know the innerHTML property of the HTML DOM and how is connected to JavaScript.

January 12, 2022 | Javascript

Loops are a beautiful thing – they can cut down lines and lines of your code because loops are used to avoid repeating a block of code. Therefore, if you want to run one code time and time again, but each time with a different value, use a loop. Want to repeat some message 10 times? Use a loop.

JavaScript supports five types of loops:

  • a for loop loops through a block of code a certain number of times
  • a for/in loop loops through the properties of an object
  • a for/of loop loops through the values of an iterable object
  • a while loop loops through a block of code only while a specified condition is true
  • a do/while loop is similar to the one above and also loops through a block of code while a specified condition is true

We’ve already covered while loops in previous articles, but in one, we will focus on the first three loops that contain the for keyword. So, let’s see what these three for loops are all about.

January 8, 2022 | Learn programming

Desktop apps, mobile apps, and web apps. Apps are everywhere. In the past years, as hardware became more powerful, the tendency to merge apps between desktop, mobile, and web platforms is higher than ever. And, in accordance with that, we meet more and more programming languages and frameworks that we can use on every platform with a minimal trade-off in terms of code difference, app execution speed, and even user interface.
In this article, we are going to answer the question of how to make a (mobile) app as a total beginner. The answer requires a multi-faceted approach, starting with the perspective of the person that is asking that question. Are you an aspiring developer who wants to learn how to develop an app? Are you an eager product manager? Or are you an ambitious startup owner?

December 28, 2021 | Javascript

This article is going to take you into the world of the “finally”. We will take a look at how to handle the try/catch/finally blocks, but we will also learn more about the Promise and a finally() method.

1. What you should know about the try/catch/finally blocks?

We’ve already taken a peek at one of the most recognized exception handling mechanisms – the try/catch/finally statement, but let’s summarize the main points again:

  • when an exception occurs in the try block, block of statements from a catch clause is invoked
  • the finally block follows the catch clause – the finally block consists of a cleanup code and this code is definitely executed, regardless of whether or not the error is thrown and no matter what happens in the initial try block.
  • the try block is obligatory but must be followed by at least one of the optional – catch or/and finally – blocks
  • after the try block and catch block execute, the finally block will execute if it’s provided

When we are using the blocks, we must understand the follow-up of the return values. Let’s take a look at one example of the try/catch/finally blocks in the function, where we expect a user to insert a number that is higher than 3, but lower than 6.
We’ve prepared several scenarios with if conditionals:

  • the system accepts the number if the values is is higher than 3, but lower than 6
  • the system throws an error if there is no value and returns “please insert some value”
  • the system throws an error if a value is not a number and returns “value is not a number”
  • the system throws an error if a value is higher than 6 and returns “value is too high”
  • the system throws an error if a value is lower than 3 and returns “value is too low”

When you’re using the try/catch/finally blocks, you should be aware of which block’s return values will be returned.
Let’s take a look at the code, where the finally statement will help you execute the code after the try and catch, no matter what the result is:





Please insert a number between 3 and 6:

1. What you should know about the Promise and a finally() method

First, let's recap what a Promise in Javascript is. A Promise is an object used as a proxy for a value that is not known at the moment. Maybe this is the very reason, it is called a Promise - the value is not yet known, but JavaScript PROMISES to return that value at some point. So, for example a synchronous method (such as try/catch/finally statement is) would immediatelly return the final value, but a Promise allows you to use an asynchronous method. That means that you would wait for the final value to be returned, and afterwards you would do the next things you planned to do when that final value is returned. This is done is the form of .then() methods, which is a common practice to learn if you're working with Promises. .then() is sort of attaching a callback functions onto Promise so it can handle what comes back from it - .then() takes a callback function and returns another Promise.
Some of the built-in Promise-specific methods are .catch() and .finally(). Here, we are going to focus on finally() method, which was introduced in ES2018 and represents a method that is always executed regardless a promise was fulfilled or rejected, so basically when the promise is settled. With a finally() method you can add a code that cleans the resource when the promise is settled, which enables you to bypass duplicate code in the then() and catch() methods.

It the example below we're duplicating the code in the then() and catch() methods:

promise
    .then(result => {
        // system processes the result
        // system cleans the resources
    })
    .catch(error => {
        // system handles the error
        // system cleans the resources
    });

But as said above the finally() method helps you avoid duplicating the code because you can put the entire code that cleans the resources in the finally method. Therefore, the finally() method can be useful if you want to do some processing or cleanup once the promise is settled, whatever the outcome is - either the promise is resolved or rejected.

promise
    .then(result => {
        // system processes the result
    })
    .catch(error => {
        // system handles the error
    })
    .finally(() => {
        // system cleans the resources
    });

In terms of avoiding duplicate code and cleaning it, we can try to compare the finally() method to the finally block that is covered in the try/catch/finally statement that we've covered above. The finally() method is used in asynchronous code, while the finally block from the try/catch/finally statement is used in the synchronous code to clean up the resources.

So, what happens in the above code? The Promise executes immediately - it either resolves to a single value, or rejects with an error object. So, when the system rejects the Promise, the return value passes through .then()s and then the .catch() picks it up. But, once a promise has been settled - either rejected or resolved - it cannot be settled again. The job can be either: finished with success and results in a value, which means the job is resolved, or another option is, rejection, which means an error has occurred and that error is the error object.

As the MDN says: "Promise.prototype.finally() - The finally() method returns a Promise. When the promise is settled, i.e either fulfilled or rejected, the specified callback function is executed. This provides a way for code to be run whether the promise was fulfilled successfully or rejected once the Promise has been dealt with. This helps to avoid duplicating code in both the promise's then() and catch() handlers."


function checkPassword(password) {
  return new Promise((resolve, reject) => {
    if (password === "secret") {
      resolve("Password is correct.");
    } else {
      reject(new Error("Password is not correct"));
    }
  });
}

checkPassword("secret")
  .then((msg) => {
    console.log(msg);
  })
  .catch((err) => {
    console.error(err);
  })
  .finally(() => {
    console.log("You completed a test");
  });

We've created a function called checkPassword(), which does what it says - it checks whether your password is correct. We defined the password with if conditional to be strictly equal to "secret". Within this function, we want to have a return of a new Promise - either the Promise is resolved or rejected - either your password is correct or not. If your password is correct (password === secret) we have a resolution of a Promise with a message "Password is correct", and if your password isn't correct, we get an error, or in Promise's terminology, we have a rejection that console logs "Password is not correct". Through a function call (with a help of .then), a Promise results in console.log(msg) or catches (.catch) an error and messages "Password is not correct". Nevertheless, at the very end, either the Promise is rejected or resolved, we get a definite .finally(), which results in a console.log "You completed a test".

It is also important to bring out that the finally() method is very similar to calling .then(onFinally, onFinally) however there are a few differences:

  • when you create a function inline, you can pass it once, which means you don't have to declare it two times, or even create a variable for it
  • sometimes you simply don't need rejection or resolution reason - a finally callback does exactly that - it does not receive any argument, in terms of whether a Promise was rejected or resolved.
December 22, 2021 | Javascript

The boolean logic is named after George Boole, who is the pioneer in the field of mathematical logic. At the very core of boolean logic is the idea that all values can be either true or false, and this has been translated into computer science as booleans – a logical data type that can only have two values, either true or false, on or off, yes or no, etc. In this article, we’re going to look into booleans basics, we will get to know the concept of falsy and truthy values, and at the end, we will get to know what boolean() object is all about.

A primitive JavaScript Boolean: true or false

When programming, you will often need a data type that can have only two values, such as on/off, yes/no, and as already noticed – true or false. These data types are called Boolean data types. JavaScript booleans are a primitive type of data, which means you don’t have to create them as an object explicitly. The reserved words – true or false – are used to assign a boolean value to a variable, and we follow the same logic when we create a boolean in JSON.

In JavaScript, we use boolean as a function to get the boolean value – either true or false – of a variable, object, conditions, expression.

Let’s take a look at a simple example where we assign a boolean value as true and false to the following variables:

let example1 = true;
let example2 = false;

Do not specify a boolean value as a string

Keep in mind that strings are not the correct data type for boolean expressions:

let example1 = "true"; // not a boolean

Do not specify a boolean value as an object

When you create booleans as objects, it may result in an unnecessary complication of a code.

let example2 = my_Boolean(true);  // overcomplicated

Some JavaScript control statements rely on booleans to evaluate conditions

Some JavaScript control statements only execute under specific conditions, and in cases like these, we count on booleans. This evaluation mechanism is crucial, for example in while loops and if-else statements.

Below, we will show an example of a while loop, where we will assume that myBoolean() is a Javascript function that will return a boolean value:

let example1 = myBoolean();
while (example1 === true) {
    ... some code...
}

And here, we show an example of if-else statement:

let example1 = myBoolean();
if (example1 === true) {
    ... code if true ...
} else {
    ... code if false ...
}

Remember, the Boolean value (true vs. false) of an expression is the basis for all JavaScript comparisons and conditions.

What should you know about truthy and falsy values?

We’ve already explained that in JavaScript booleans result in either true or false values. But what are truthy and what are falsy values?

Usually, a truthy value comes from an object with a defined value or a structure, and this can be:

  • an empty array:
    let example = [];
  • an empty object:
    let example = {};
  • a majority of numbers, even negative numbers:
    let example = -5;
  • strings that are not empty, for example:
    let example = "my string";

You should take for granted that all values are truthy unless they are defined as falsy, and even when values are defined as falsy, they can sometimes differ between different browsers and different Javascript implementations.

On the other hand, a falsy or falsey value comes from an object that does not have a defined value or a structure, and this can be:

  • null values:
    let example = -0;
  • undefined values, such as values for Not A Number:
    let example = NaN;
  • strings that are empty, for example:
    let example = "";

What about JavaScript booleans defined as objects?

As we presented above, JavaScript booleans are primitive values created from literals, but booleans can be also defined as objects. In cases like these, when we want to define them as objects, we use a keyword new. Let’s take a look at an example below:

let example1 = false; // typeof example1 returns boolean
let example2 = new Boolean(false); // typeof example2 returns object

In addition to that, any object whose value is not undefined or null, including a Boolean object whose value is false, evaluates to true when passed to a conditional statement. In the example below, the condition in the following if statement evaluates to true:

let example = new Boolean(false);
if (example) {
  // this code is executed
}

However, as a rule of thumb, it is advised not to create Boolean objects, because they can produce unexpected results, and the “new” keyword complicates the code and slows down execution speed.

In the context of booleans, we should also bring out implicit and explicit coercion. The explicit coercion occurs when types are converted directly using syntax like Boolean(value). Implicit coercion is however much more interesting and is recognized when specific operators and expressions are used. The loose (==) and strict (===) equality operators are acknowledged for this behavior.
You should pay attention to whether you’re using equal-to or loose ( == ) or strict operator ( === ). Use only strict operators to evaluate boolean expressions because truthy and falsy expressions only evaluate as equal to explicit booleans if you are not using strict comparisons. In general, if you’re comparing two JavaScript objects, JavaScript will always return false.

Let’s explore an example where we bring out loose and strict operators.
The first example returns equal because we used a nonstrict operator ( == ), so the example is evaluated as true because a non-empty string is truthy:

let example = ("10" == true);

In the second example, we used a strict comparison operator ( === ), and our string is considered false because of that:

let example = ("10" === true);

So, what is the takeaway message?

Booleans are one of the main data types and in JavaScript, many concepts are dependant on them. You should learn to distinguish between explicit booleans and implicit coercion – a proper distinction will help you avoid common programming mistakes.

December 16, 2021 | Javascript

In this article, we will explore the eval() method. We will get to know the syntax and explain what is the purpose of the method. We will explore whether eval() is really evil and whether you should really stop using it. And if it’s not, are there any legitimate reasons when you should use the eval() method.

December 11, 2021 | Javascript

In JavaScript “else” keyword is a part of conditional statements that we use to perform specific actions which are based on different conditions. There are two conditionals that use the else keyword in their statements – “else” and “else-if”. In this article, we will explore the world of these two conditionals – when to use them, should you stop using them, and whether there are better alternatives available.

December 6, 2021 | Javascript

“Do” is another reserved keyword in JavaScript that cannot be used as a variable, label, or function name. However, this reserved keyword cannot stand alone and is closely connected to another reserved keyword – “while”. Together “do” and “while” keywords create a loop and in that loop, the do keyword executes (does) some part of the code. Let’s go through a few examples and see what is the purpose of the “do” keyword in the do-while loop.

November 30, 2021 | Javascript

Delete. The sole purpose of this keyword is quite self-explanatory – we want to delete “something”. But what can we delete? And do we really delete “that” or can we read it again? This article will take you into the world of the delete operator in JavaScript – you will learn what you can and cannot delete and what exactly the delete operator in specific situations really means?

November 25, 2021 | Javascript

You will make errors. Your scripts will have errors, no matter what. These errors can be in relation to syntax or logic. And often it will be a case, that you won’t see any error messages and you’ll have no clue where exaclty you should look for errors. This is where code debugging comes into place. Luckily, all browsers have JavaScript debugger built-in and it can be turned on or off, which dictates whether script errors are reported to the user. You can also set breakpoints and check variables during the code execution. In short, Debuggers go through the entire code and they identify these errors and also fix them.