Expression and statement

arsham-azami — Tue, 17 Nov 2020 15:17:01 +0000

statement and expression these are two things that we Programmers deal with it every moment in the day.
It's impossible when you're writing code and don't use expressions or statements. But some of the developers aren't familiar with their differences. in this article, I am going to explain what expressions and statements are and why we use them a lot in our daily life as a programmer?🤔

Expression

In a simple word, expressions are a combination of Numbers, Symbols, and operators and the purpose of an expression is to produce a value. Let me give you an example in mathematics for example (32+67) is an expression because it produces a number (99) and containers (+) as an operator

expressions in computer programming mean the same expression in programming

let x =12
Console.log(x += 4)

output: 16

In the example above we define a variable and incremented by 4 and logged it on the console, in your opinion which part of the code above is an expression?🤔

😊Yes your answer is correct😊, (x += 4) is an expression because it produces the number 16 as a value

Statement

think of a computer program, a computer program contains a list of instructions in which to be executed by the computer.

in the programming languages, these instruction are called statement
actually, the statements can perform several operations like looping and

in a programming language like javascript, statements are composed of the following options:

1 - Values
2 - Operators
3 - Expressions (Expressions are also called statement)
4 - Keywords
5 - Comments

To understand better look at the following example

 let a = 'hello'
 let b = 'guys'
 var demo = document.getElementbyId('demo')
 demo.innerHTML = a +''+ b

in the code above 'dom' gets the HTML element(tag) by its ID
which is 'demo' and then set the HTML content to 'hello'
so why is it is a statement?🤔🤨

because the code contains an operator (=) and (a +''+ b ) is an expression because it produces a string ('hello guys') as a value

Another example of a statement is if...else in which is a conditional statement

var manner = 'happy' 
if(manner == 'happy'){
  return 'perfect😊'
}else{
  return 'You are sad😢'
}

output: 'perfect😊

the (manner == 'happy') is an expression because it returns a boolean as a value if the condition is true it returns 'perfect😊'
otherwise returns 'You are sad😢'

Note :
1-expressions are the statements that produce a value
2-when a variable name is used in an expression the current value
3-statements are executed one by one or in the same order they are
written

I tried to explain the concepts well and understandable
I hope you enjoy reading this article

❤see you until the next article❤

The differences between map() and forEach()

arsham-azami — Mon, 16 Nov 2020 13:38:28 +0000

In javascript, there are many methods to work with arrays
but some of them are a little bit confusing for most of the developers. the most common methods among javascript array methods are map() and forEach() methods but the majority of developers don't know when to use map() and forEach() and are not familiar with their differences.
in this article, I am going to completely describe this for you

map()

the map()method is a useful method and is used to repeat the same operation on every element of the array(just like a loop) and then return a new array with the same number of elements.

syntax:

Array.map(function(currentValue, index, arr), thisValue)

the first argument represents the current element(required)

the second argument represents the index of the current element(optional)

and the third argument represents the array object that an element belongs to(optional)

let arr = [21, 54, 32, 67, 90]
arr.map((element, index) => {
   console.log(`element:${element} index:${index}`)
})

//map() method
output :  
   element:21 index:0
   element:54 index:1
   element:32 index:2
   element:67 index:3
   element:90 index:4

code explanation:

In the example, above we define an array with five elements and took the element and index of the element by map() method and placed them in a string, and repeated this process on all the elements. and if we decide to make this approach by for loop
it would be something like this :

let arr = [21, 54, 32, 67, 90]

for(let x=0; x<arr.length; x++){
   console.log(`elements:${arr[x]} index:${x}`)
}

//for loop
output :  
   element:21 index:0
   element:54 index:1
   element:32 index:2
   element:67 index:3
   element:90 index:4

forEach()

This method is much similar to map() method it receives a function as the first argument and calls them for all the elements
but the main difference is instead of returning a new array it returns undefined and if it doesn't return anything it return a mutated array while map() method returns a new array

array.forEach(function(currentValue, index, arr), thisValue)

the first argument represents the current element(required)

the second argument represents the index of the current element(optional)

and the third argument represents the array object that an element belongs to(optional)

let arr = [21, 54, 32, 67, 90]
arr.forEach(element => element + 3)

//output: undefined 

let arr = [21, 54, 32, 67, 90]
arr.map(element => element + 3)

output: [24, 57, 35, 70, 93]

see! we performed the same operation( *defining a callback function to add 3 to each member * ) on the array with map and forEach but forEach returns undefined

You might say javascript is a little bit strange🤔

channing other methods

Chaining methods means after executing a method we can bind it with some methods such as filter(),splice(),pop(),etc.
and another difference is you can bind other methods to map() method but you can't take this approach with forEach if you do this it returns undefined

with map():

let arr = [21, 54, 32, 67, 90]
arr.map(element => element + 3)//adding 3 to each element 
.filter(element => element > 50) //filtering element bigger than50

output: [57, 70, 93]

with forEach():

let arr = [21, 54, 32, 67, 90]
arr.forEach(element => element + 3)//adding 3 to each element 
.filter(element => element > 50) //filtering element bigger than50

output: cannot read property 'filter' of undefined

conclusion

Both map and forEach perform the same process and receive callback function but the performance of these two methods is different, but is it important to know?🤔

It completely depends on you to choose map or forEach
if you are going to mutate or alternate the element, you should use map() because it returns a new array with mutated elements
but whenever you don't need a returning array you should use forEach

If you have any questions,suggestions or criticism please leave a comment

😊 Thanks for reading this article 😊
🙏🙏🙏🙏🙏🙏

DEV Community: arsham-azami