JavaScript

Basics

FUNCTIONS

functions

Text

function makeCats(catName) {

	console.log("I have a cat named " + catName);
}

makeCats("Sammy");

What does this print out in the console?

functions

  • What is a function? 
  • Why do we use functions? 
  • What are some functions you've worked with so far? 

functions

  • How to make a function:
    • function keyword
    • name of function followed by ()
    • unique parameters or no parameters
    • { } to indicate the scope of your function 
    • return value - we'll go over this later
  • How to use a function:
    • Call it by its name
    • Pass in the required parameters!

Let's make our first function!

Open up JSFiddle 

Step 1

  • Write out the first line, with the function keyword
  • The name of your function is: makeAnimals
  • Your parameters are: animal1, animal2, animal1name, animal2name
  • Don't forget the {}

 

function functionName(param1, param2, param3, param4) {
    //code here
}

your code should look like this:

function makeAnimals(animal1, animal2,
                animal1name, animal2name) {
    //code here
}

IMPORTANT NOTE: YOUR PARAMETERS SHOULD BE ON ONE LINE, I HAVE "animal1name" on a newline for formatting purposes only!!!

what is a parameter?

function makeAnimals(animal1, animal2,
                animal1name, animal2name) {
    //code here
}

What are the parameters of makeAnimals?

What is the point of having them?

how do we call a function?

Call it by its name!

Step 2

  • On a new line, after the } call the function by its name.
  • Pass in values to the parameters.
    • This means you assign values, in this case, strings, to animal1, animal1, animal1name, and animal2name
    • You can come up with your own, but I'll use:
      • "dog"
      • "cat"
      • "Leonard"
      • "Sammy" 
  • Don't forget the semicolon at the end!

Step 2

  • Your code should look something like this:
function makeAnimals(animal1, animal2,
                animal1name, animal2name) {
    //code here
}

makeAnimals("dog", "cat", "Leonard", "Sammy");

Why do pass in values to the parameters, instead of just typing them out again? 

 

Step 3

  • Let's actually add some functionality to our function. 
  • Delete the comment inside the function, and replace it with two new lines:
    • console.log("String here" + animal1 + "string here" + animal1name);
    • console.log("String here" + animal2 + "string here" + animal2name);
      • You can replace "string here" with any string of your choosing

Step 3

  • Your code should look something like this: 
function makeAnimals(animal1, animal2,
                animal1name, animal2name) {
    
    console.log("I have a " + animal1 + "named " + animal1name);
    console.log("I have a " + animal2 + "named " + animal2name);

}

makeAnimals("dog", "cat", "Leonard", "Sammy");

what happens when we run our code?

Why does this work? 

try removing the quotes from  the function call. 

makeAnimals(dog, cat, Leonard, Sammy);

Why doesn't this work? 

team function review

Write a function, called tempConvert, that takes in two parameters: a numerical temperature, and a system (Fahrenheit or Celsius). The function converts temperatures in one system to the temperature in the other system. 

 

ex. tempConvert("C", 30) will print out "86F"

tempConvert("F", 100) will print out "37.78C"

 

Look up the temperature conversion formulas online!

Survey time

  • Go to this link:
  • https://www.surveymonkey.com/r/5MZ2CNJ
  • Answer the questions and submit! 
 
 

JavaScript Basics: Functions

By ifang

JavaScript Basics: Functions

  • 626