DEV Community

Chi
Chi

Posted on • Updated on

 

For Beginners: What is a function? My sh*tty explanation 💩

It's 12:09AM, I can't sleep. After drinking my protein shake (I was hungry) I decided, why not write an informational piece.
During a Women Who Code virtual meetup, someone needed help understanding what functions are so, here it is!

Understand the vocabulary

  • Use the vocab, whenever you can when you are talking about your code. For example, people get parameters and arguments mixed up when they first start. The more you use the correct language, the better you'll understand.

Vocabulary:

  • Function: A reusable block that allows you to perform some calculation or task. Reusable, so you don't have to repeat work!
  • Function Body: That's the meat of the function - the logic part.
  • Parameters: That's the words inside the parenthesis. Basically, empty variables names that aren't assigned to any data, until you call the function with the arguments. Speaking of arguments...
  • Arguments: When you call a function (aka execute your function after you have defined it), you provide the data/values to pass into that function. I dare you to code this function and run it function human(protein, veggie){ console.log( arguments);} tell me what you see! What is the data structure?
  • Return: Return allows you to exit out of a function when a condition is satisfied. Or, sometimes a function provides an output so you can use that output for something else.

Here is my shitty explanation:


//function name is human
//parameters are protein and vegetable
function human(protein, vegetable){
  //body
  console.log(arguments);
  console.log(`I am digesting ${protein} and ${vegetable}`);
  return '💩';
}

//calling the function with the arguments, 'protein shake' and 'spinach'
human('protein shake', 'spinach');
//output:
//[Arguments] { '0': 'protein shake', '1': 'spinach' }
//'I am digesting protein shake and spinach'
//'💩'

I am a human and one of my main functions is to take input like food and digest it. After the food is digested, what the output (aka return) is 💩. That's my shitty explanation. 😬

I will edit this later for more clarity and better examples but it is now 1:11AM and I should sleep.

Eat your vegetables!

//Chi

Top comments (2)

Collapse
 
feministclickback profile image
tina

I enjoyed this :-) And it was really helpful. Thank you. Hope you got some sleep.

Collapse
 
chiexplores profile image
Chi

I am so happy it helped in some way haha!

The JavaScript Brief

1. Top 5 MERN STACK projects to improve your practical understanding

Boost your MERN Stack development skills by undertaking interesting beginner projects. These five engaging projects cover web applications and range from social media website applications to geo-social networking maps. Hone your understanding and apply modern techniques backed up by hands-on experience.

2. How To Optimize Your React App’s Performance

Learn the best optimizing techniques to make your React applications faster and more efficient. Focusing on the identification of performance bottlenecks and common pitfalls to avoid, these optimization strategies will keep your applications running smoothly even when faced with growing complexity.

3. A story of let, const, object mutation, and a bug in my code

In the pursuit of bug-free code, explore an incident involving a mix-up between const and let, making sure your custom code works effectively with third

party documentation. Discover best practices on program flow and learn about JavaScript's unpredictable aspects to ensure your core code is robust.