DEV Community: anetasargsyan

Functions in JavaScript

anetasargsyan — Wed, 09 Nov 2022 20:02:21 +0000

Another essential part of programming is function. So…

What is a function?

The function is a set of statements that are executed when the function is called.

Let’s first understand how a function is constructed and what it means to call a function.

To create a function, we will use a new keyword - function. This will tell that what comes after it is a function. Then we need to name our function. The same rules work here for naming a function, except that you can have multiple functions with the same name. Just the thing is, the program will consider the last one only. After the name, we have parenthesis, in which we write arguments for our function(there may be none). Then we open curly brackets, which identify the body of the function. When the function is called, whatever is in its body gets executed. Now let’s get into details.

function ExampleWithNoArguments(){
    //do something
}

//calling the function with no arguments
ExampleFunctionWithNoArguments(); 

function ExampleWithMultipleArguments(a, b, c){
    //add a, b and c, and return the value
    var sum = a + b + c;
    if(sum > 0){ 
        return(sum); 
    } else {
        return(-sum);
    }
}

var Sum = ExampleWithMultipleArguments;
//type of Sum will be a function, since we assigned a function to it
//aka you can call "Sum" just the way you call 
ExampleWithMultipleArguments

var sumOfNums = ExampleWithMultipleArguments(-5, -6, -8); 
//type of sumOfNums will be number since function RETURNS number

function ExampleFunction(argument){
    var message = "My argument: " + argument;
    console.log(message);
    return message;
}
ExampleFunction("some random string");

Let’s consider the last one.

The function is the keyword, “ExampleFunction” is the name of our function, what is inside brackets is the argument, and in curly brackets is the body, which will be executed when called.

In the following line, the function is called with a string argument with a value of “some random string.” To call a function, we simply write its name, open brackets, and write inside of its arguments if we have any. And that’s it. The body of the function will be executed.

As one of my beloved teachers once explained: function is like a factory, you give it raw materials, and it works on them and then returns a result to you.

In our case argument is the raw material. When we call this function, a variable with the name of “argument” is created, and it takes the value which we give in parenthesis (in our case, “some random string”). The important thing is this variable is local to the function it belongs to, which means you cannot use this parameter outside of the function’s body. So, ExampleFunction takes the argument and prints in the console “My argument: “ + “some random string” (as our argument has this value).

Functions may have many parameters and may have none as shown in the example. It is not recommended to have many parameters for a single function to avoid messing things up. Also, they may and may not return a value.

Returning value from a function

In JavaScript, functions are variables, which means you can create a variable and assign a function to it. If you do this without calling the function, the variable will take the reference to that function.

function ExampleWithMultipleArguments(a, b, c){
    //add a, b and c, and return the value
    var sum = a + b + c;
    if(sum > 0){ 
        return(sum); 
    } else {
        return(-sum);
    }
}

var Sum = ExampleWithMultipleArguments;
//type of Sum will be a function, since we assigned a function to it
//aka you can call "Sum" just the way you call 
ExampleWithMultipleArguments

var sumOfNums = ExampleWithMultipleArguments(-5, -6, -8); 
//type of sumOfNums will be number since function RETURNS number
//output: 19

And if you return something, your variable will take that as a value.

I keep repeating, “return a value.” Returning a value means giving the result of some actions, as shown in the factory example. You gave arguments (raw material) to the function (the factory) and got a value returned (result). After returning function stops its execution, which means you cannot have more than one return statement in a function, as only the first one will give away the result and stop the execution of the function. However, you may say, how come we have two return statements in the example? The answer is inside the if statement, so if we had a negative number, the program would ignore the first brackets and jump to the second one. In the end, only one of those statements will be executed.

!Note.

The function's return value is the value of the called function.

Function inside of a function

Since the function is just a variable that does some operations to get its value, it can be declared inside a function. You can have multiple functions created inside of a function.


//takes two arguments, gives their product's absolute value 
//as a result
function ProductOfAbsolutes(x, y){

    //is a function, with argument x, which has the value 
   //of x's absolute
    var absoluteOfNumber = function(a){

        //returns (value) absolute of x
        return Math.abs(a);
    }

    //is a function, with 2 arguments a and b, returns 
//their product
    var product = function(a, b){

        //gives the value of a times b
        return a * b;
    }

    //this is return statement for "ProductOfAbsolutes" function
    //first it calls the function "absolteOfNumber" 
    //with argument x, then with y

    //then puts their outputs as arguments to function "product"
    //returns the product
    return product(absoluteOfNumber(x), absoluteOfNumber(y));
}

console.log(ProductOfAbsolutes(2.5, -5)); // output: 12.5

Here’s an example of that. Just remember, what’s declared inside the body, stays in the body(most of the time). (Body is { inside of these }).

Additional

Just to give an idea of why we need functions, we can always write things when they need to be executed. This helps A LOT with repetitions. If you need to multiply two numbers, then find the square root of the result, then take the negative of that number and divide by 5 for some reason, and you need to do this more than once, you may find it exhausting to write that over and over again, making it complicated not only for you but for the computer as well. Here come the functions. If you need a neater code, or you have some part that will be repeated multiple times (like playing some sound when a user clicks a button), the functions come in handy. They make your project more understandable, easier to navigate, and in the end, have a beautiful structure.

Thank you for bearing with me this far! If you have any questions, leave a comment, I will answer as soon as I see.))

Variables in JavaScript

anetasargsyan — Wed, 09 Nov 2022 19:32:15 +0000

As for creating a program, we need to perform some operations. To perform those operations we need some values. Here come the variables.

What are variables?

Variable is a thing programming language uses to store some piece of information under a specific name. Variable has a name, by which it may be accessed and which cannot be changed after its declaration, and a value - which can be changed. So basically, by creating a variable we retain some part of memory, saving some value in it, and accessing it through its name.

This was something general. Now, let’s dig into JavaScript variables.

To create a variable we use the special keyword var. This indicates, that what comes after this expression will be the name of a newly created variable. So, as I mentioned, there we put the name of the variable. By doing so we already created a variable and gave a name to it. However, you can go ahead and assign a value to it at the time of creation by using the = operator, which is used to assign values to variables. The = operator assigns what comes after it, to what was before it. By using the keyword var you can create multiple variables (and also assign them!). See the code below for a better understanding.


var variableName; // you may stop here as your variable 
                 //has already been declared

var otherVariable = 10; //in this example we assigned 10 to 
                        //"otherVariable", which means that 
                        //otherVariable noe holds the value of 10


var number1 = 1, number2 = 2;

var name1, name2, name3;

What to name my variable?

You do have some restrictions when it comes to naming variables. The name of the variable cannot start with a number, but it can include numbers. You cannot use reserved words, aka keywords, which are the ones we use to tell the language some specific things(like we used var to tell it to create a variable). Names cannot include spaces, or special characters other than $ and underscore( _ ) . Also, you cannot have multiple variables with the same name, unless you work in and out of scopes. (Will talk about these later)

Trust me you absolutely do not need some crazy and funny names for your variables. They must be meaningful. You will start off with small projects, and here, you will most probably be able to remember which variable was used for what reason. Nevertheless, in a bit bigger projects you will start forgetting what was “aaaCuteNameee” used for. So, make it a habit to choose variable names wisely. Take this as friendly advice from me :)

Can the values that are given to a variable change?

Absolutely! When you assign a value to a variable, you simply tell the computer, that this name means its value. In our example, otherVariable is 10, so whenever I write the name otherVariable, I mean 10. Any value can be assigned to a variable, anytime, just the same way we did with otherVariable, which is, to write the name, then the operator =, then the value we wish to assign.

!Note.

When you have already declared the variable (wrote var name; in your code) you no longer need to declare it before assigning the new value.

Some notes on variable declaration in JavaScript

The keyword var is not the only keyword in JavaScript used for initializing variables. There is also const which creates a variable, you can assign a value to it, but you cannot change it afterward.
As you will see in further exploration of the language, there are local and global variables. For now, just remember that there is also the keyword let, which also creates a variable, but in this case local only, while var may as well create a global variable.

Binary representation and operations on binary numbers

anetasargsyan — Wed, 14 Sep 2022 21:57:20 +0000

What is binary?

Binary is a base-2 numbering system that has two states (“0”, “1”).

Why do we use binary?

Computers can understand only 2 states: either there is electricity or there is not => 0 / 1.

Understanding binary representation of a decimal number.

The Decimal system is base-10. To represent a number of base-10 system we use our base, and add power to it depending on which row it is on (counting from right to left, starting with 0)

Since the binary system is base-2, we do the same just changing the “10” by “2”.

(this is 21 in decimal)

Conversion from decimal to binary and vice versa

Converting from binary to decimal is what’s shown above: If you calculate the right-hand side, you’ll get 21 which was represented in binary.
Now let’s get to conversion from decimal to binary:
To convert it we need to divide that number by two, and every time write the quotient until you get either 1 or 0. Also, remember to write the remainders right by their side. I’ll give an example of 21. Let’s convert it.

So, we divide 21 by 2, get 10 and 1 as quotient, write it down, and continue. Now we have 10 left: we divide that by 2, get 5, and 0 remainder, write that down and repeat again. Now we have 5: divide that by 2, get 2, and 1 as a remainder. Finally, we divide 2 by two, get 1 for the quotient, and 0 for the remainder. Now we need to “assemble” our binary number. We start from the very end: the last quotient - 1, we write all of the remainders from down-up. So we go in the direction of the purple arrow. I wrote the remainders top-down, so we need to reverse it. Read it down-up, and you will get 10101, which is, in fact, 21 in decimal.

Addition of binary numbers

Arithmetic operations we know work for binary numbers as well. They might seem slightly different, but mostly it is the same, just it is a bit unusual for our eyes) Let’s dive into addition.

To add numbers we can use the traditional method of writing one below the other and add rows with carrying any additionals to the next row. Let’s add 11 to 10 to get 21 again.

10 represented as the binary number will be - 1010,
And 11 will be - 1011)

So, we got 10101, which is, indeed, 21)

Multiplication of binary numbers

Multiplication works the same way we are used to: write the numbers we need to multiply one below the other, multiply the rightmost digit of the multiplier with all the digits of the multiplicand. Add a placeholder of '0' before multiplying the next higher order digit of the multiplier with the multiplicand's digits. Repeat the same process for all the following digits. Then add the products to get the outcome of the multiplication.

P.S. I'll do another post featuring subtraction and division of binary numbers :D