API Design Good Practices
Programming Tips

#Day30 – From Python to JavaScript – The Basics Part 3

Posted by

In the last article, we discussed the following

  • Conditional Statements
  • Blocks
  • Comparison Operators
  • Logical Operators
  • Truthy and Falsy Values
  • Ternary Operators
  • Switch Cases

Today, we will be discussing the following

  • Function Definitions
  • Positional and Keyword/Named Parameters
  • Arrow Functions in Javascript

Function Definitions

In this section, we will discuss the basic way of defining functions in Python and JavaScript. We will be defining a function named func. It will simply calculate the sum of 10,20 and return the sum

Python

Below is the syntax for a function in Python

def functionName():
  '''
  SOME CODE
  '''
  pass

Now let’s define the function func we discussed earlier

def func():
  sum = 10 + 20
  return sum 


# Calling the function func
func()

JavaScript

Below is the general syntax for a function

function functionName(){
  /*
  SOME CODE
  */
  pass
}

Let’s define the function func in javascript

function func(){
  let sum = 10 + 20
  return sum
}

// Caling the function func
func()

Parameters

If you want to learn about Positional and Keyword Arguments, check out this article

Python

  • Python has support for default parameters and non-default parameters
  • Python can accept positional and keyword arguments
  • In Python, when calling a function, positional arguments CAN NOT follow keyword arguments
  • In Python, if we do not pass an argument for non-default parameters, Python will raise an exception
'''
Default Parameter
'''
def func1(num1 , num2 = 10):
  return num1 + num2 

print( func1(10) )   # OUTPUT: 20
print ( func1(1,1) ) # OUTPUT: 2  


'''
Positional and Keyword Arguments
'''
def func2(num1 , num2 , num3, num4):
  return num1 + num2 + num3 + num4

print( func2(10,10,num3=30,num4=5) )# OUTPUT: 55

print( func2(10,num2=10,10,num4=10) ) # ERROR

'''
Not passing an argument for non-default parameters
'''
print( func2(10,10,num3=30) )# OUTPUT: TypeError

JavaScript

  • JavaScript has support for default parameters and non-default parameters
  • JavaScript can accept both positional and named arguments. Named arguments in JavaScript is similar to Keyword Arguments in Python
  • In JavaScript, when calling a function positional arguments can follow named arguments. However, you need to respect the order of the arguments and the parameters. We will discuss this below
  • In JavaScript, if you do not pass an argument for non-default parameters, the parameter will be set to undefined. Unlike Python, JavaScript doesn’t return an error.
/*
  Default Parameters
*/
function func1(num1 , num2 = 10){
  return num1 + num2
}

console.log(func1(10)) // OUTPUT: 20
console.log(func1(1,1)) // OUTPUT: 2

/*
Not passing an argument for non-default parameters
*/
function func2(num1,num2,num3,num4){
  return num1+num2+num3+num4
}

console.log(func2(10,20,30)) // OUTPUT: Nan

As mentioned above the order of the positional and named arguments doesn’t matter but you should be careful while using them.

function func2(num1,num2,num3,num4){
  console.log("num1: " + num1)
  console.log("num2: " + num2)
  console.log("num3: " + num3)
  console.log("num4: " + num4)
}

We will try passing positional and named arguments to the above function

func2(10,20,num3=30,num4=40)
/*
num1: 10
num2: 20
num3: 30
num4: 40
*/


func2(10,20,num3=30,40)
/*
num1: 10
num2: 20
num3: 30
num4: 40
*/

But this is where it gets weird

func2(10,num3=30,20,40)
/*
num1: 10
num2: 30
num3: 20
num4: 40
*/

Although, we explicitly set num3 to 30, inside the function num2 is set to 30, and num3 is set to 20. We need to respect the order of the parameters. If the order of the parameters is not followed, the parameters are set to the respective argument values (irrespective of if they are positional or named).

func2(10,num1=30,20,40)
/*
num1: 10
num2: 30
num3: 20
num4: 40
*/

Arrow functions in JavaScript

Although not related, Python supports lambda functions, you can find more about them here

JavaScript supports arrow functions. It’s just a cleaner version of defining functions. Below is a cheatsheet. The arrow is an equal sign(=) followed by a greater than sign (>)

EzuD2aoWEAI6OlW.jpeg