Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Anthony gedeon
Anthony gedeon
6,140 Points
Posted by Anthony gedeon
Anthony gedeon
6,140 Points

Can somebody explain functions to me in Javascript? I don't know when to apply it in my code.

What I tried

  1. Edabit challenges
  2. Trying to make a password cracker with code inside a function
  3. using the return
  4. read books, revisit the treehouse tracks, and youtube

What I get

  1. the return keyword
  2. simple function programs like putting a console.log() in the function and calling it out

2 Answers

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

Functions serve many different purposes, but one you will encounter early on is making bits of code easy to use multiple times without repeating it over and over. Another common use is to create a "callback" to pass as an argument to another function. Both of these are covered well in the course tracks. Which one(s) have you completed?

Anthony gedeon
Anthony gedeon
6,140 Points
Anthony gedeon
Anthony gedeon
6,140 Points

Hey Steven, all the function videos and I was getting it or I thought I understood the info. but then I tried to make my own projects and I just did not know what to do with functions.

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

I'm not sure what you mean by "the function videos" but if you've been watching only some videos out of the courses that might explain the confusion. Watching the courses entirely from start to finish will give you a lot of supporting information that will help in understanding how functions work in the overall scheme of things.

Anthony gedeon
Anthony gedeon
6,140 Points
Anthony gedeon
Anthony gedeon
6,140 Points

I watched all the tracks in "Creating Reusable Code with Functions" and even did the challenges. But something about it was not clicking. For example, when I was making my password cracker, I made 2 arrays, 1 to contain the upper case alphabets and the other was for lowercase and I thought to myself is it okay to put this is in a function? Sorry if I'm not explaining things well but I do not really know how to describe my problem but I will try to rewatch some of the videos that were unclear.

Steven Parker
Steven Parker
229,732 Points
Steven Parker
Steven Parker
229,732 Points

I think we are using the word "track" to mean different things. "Creating Reusable Code with Functions" is just one part of the "JavaScript Basics" course, but Treehouse uses the word "track" to describe a whole collection of courses that cover a topic thoroughly.

One in particular that might be helpful to you now is the Beginning JavaScript track. It contains several courses (including the one you were watching) that are arranged in order and should help give you a more complete understanding of things, including when and how best to use functions.

Robert Stewart
Robert Stewart
11,921 Points
Robert Stewart
Robert Stewart
11,921 Points

The overall concept of a function is to make code that you use multiple times throughout your program accessible by reference instead of having to rewrite all that code in various places.

The long way without functions:

// Make the alert say Foo.
var alert = document.getElementById('alert');

alert.innerHTML = 'Foo';

// Make the alert say Bar
var alert = document.getElementById('alert');

alert.innerHTML = 'Bar';

Instead you could use a function to reduce the reused code like so:

var alert = function (text) {
    document.getElementById('alert').innerHTML = text;
};

alert('Foo');

alert('Bar');