BMI Presentation 1:

Creating Variables and concatentating strings

Follow along: https://bit.ly/2WtAGDJ

Lesson Objective

By the end of this lesson you should be able to create a variable and concatenate strings in your browser console

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

What You Should Know

You should know the following:

  • Algebra (from grade school)
  • You should be able to open the browser, and browse the internet

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

Why are we doing this?

Your Work

  • What is your workday like?
  • How much of it is on your computer?

Your free time

  • What do you do on your free time?
  • How much of it is on Netflix, or just Browsing?

94% of Alberta is on the internet (2017)*

 

Have you ever thought about how these things work?

They're all written in code.

You're going to write some code today.

*https://www150.statcan.gc.ca/n1/pub/11-627-m/11-627-m2017032-eng.htm

Dan, I can't do this!

We'll break it down, yes you can!

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

Math Review

If

and 

what is the ? equal to

x = 1

x + 4 = ?

Math Review

If

and 

what is the ? equal to

y = "the"
z="hat"

y + " cat in the " + z = ?

Math Review

Of Course we know that!

Well code isn't too different from this, and we're covering that next:)

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

Follow along!

Press F12 in your browser

You should see something like the image on the right pop up.

Algebra vs Code

Algebra

Code

x = 1

var x = 1;

y = "the"
z = "hat"

var y = "the";

var z = "hat";

Looks pretty similar right?

  • "var" is letting a special word in the language to create the variable. If we reassign a variable then we don't need this word.

  • The assignment is different from text, and a number

  • ";" is used to end every line (or statement).

Variable Assignment

You Did it!

You just wrote your first few lines of code!
Let's do one more concepts and then you can try doing this on your own!

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

Concatenating Strings

Algebra

Code

y = "the"
z = "hat"

y + " cat in the " + z = ?

var y = "the";
var z = "hat";

 

var result = y + " cat in the " + hat;

Looks pretty similar right?

  • Making two strings into one string as we see with the "result" variable, is called concatenation. As shown we already know how to do it! 
  • We took our knowledge from assigning variables, and algebra to create the string: "the cat in the hat"

Concatentating strings is basically adding strings together.

Concatenating Strings

Congrats! You just wrote some code.

Where Are We?

  1. What We're Covering

  2. Assumptions

  3. Why?

  4. Math Review

  5. Assigning Variables in (Javascript) Code is like Math!

  6. Making One String from Two Strings.

  7. Creating your own!

  8. What did we do today?

Assessment

I want you to try and do the following.


1. Create two new variables in your console.
(go to your browser and hit F12)
2. Create a new variable by concatenating them together.

I'll be walking around and helping you folks out

 

Reach assessment: create two variables that are numbers and add them together.

What did we do today?

 Understood what code is, and what it powers
Created variable

String concatenation

Written our first lines of code, congrats!

Thank you for listening!

Marshmallow

Ghost

Gambit

Questions?

Please let me know where I can improve.

Made with Slides.com