Main content
Course: Resources > Unit 1
Lesson 3: Computer programming teachers- Programming content overview
- Tracking progress of programming students
- Classroom debugging guide
- Pair programming in the classroom
- Teaching guide: Intro to JS - Drawing Basics
- Teaching guide: Intro to JS - Coloring
- Teaching guide: Intro to JS - Variables
- Teaching guide: Intro to JS - Animation basics
- Teaching guide: Intro to JS - Interactive Programs
- Teaching guide: Intro to JS - Resizing with variable expressions
- Teaching guide: Intro to JS - Text and strings
- Teaching guide: Intro to JS - Functions
- Teaching guide: Intro to JS - Logic and if statements
- Teaching guide: Intro to JS - Looping
- Teaching guide: Intro to JS - Arrays
- Teaching guide: Intro to JS - Objects
- Teaching guide: Intro to JS - Object-oriented design
- Programming classroom handouts
- Additional programming projects
- Lesson plans: teaching programming in the classroom
- Programming case study: Encouraging cross-disciplinary projects
- Programming case study: Going beyond the KA curriculum
- Programming case study: Teaching an elementary school class
© 2024 Khan AcademyTerms of usePrivacy PolicyCookie Notice
Teaching guide: Intro to JS - Logic and if statements
This is a teaching guide for the Intro to JS lesson on Logic and if statements.
What the student will learn
- How to use
if
/else
statements in their programs to execute different lines of code based on whether certain conditions are true. - How to use logical operators to evaluate to true/false values -
&&
,||
,===
,!==
,<
,>
,<=
,>=
. - How to store booleans in variables, to hold
true
/false
values. - How to use the global ProcessingJS boolean variable
mouseIsPressed
to check if the user is pressing the mouse, to help make interactive aspects like buttons.
The student will be able to write code like:
Where students struggle
- For many students, this may be their first introduction to logic - reasoning about whether statements are true or false, and making complex expressions using AND and OR to result in truthiness and falsiness. If students are struggling with logic, encourage them to think carefully through each conditional expression, like by writing it down on a sheet of paper and annotating each part of the expression with true or false.
- Students often take time to figure out how to put together multiple
if
/else
statements in the most logical way - they might forget to useelse
when they want exclusivity, or they may sequence theirif
/else
conditions in a flow that doesn’t result in what they want. Once again, encourage them to slow down and reason about how they want their program to work. Also, prompt them to think through all the possible values that could flow through the logic. Oftentimes, programmers (new and old!) forget to think about the "edge cases" in their logic. - Students may struggle with all the new syntax, like incorrectly putting semi-colons after the
if
statement and mistyping the operators incorrectly (e.g.&
instead of&&
&
may work, but it’s actually a different, more advanced operator).
Additional materials: Unplugged activities
An "unplugged" activity is one that you can do with students without needing to use a computer at all. They can help convey concepts in a more visceral way, and they can also be a backup activity for when computers fail.
Code.org offers a Coding with Cards activity (see overview video and lesson plan).
Additional materials: Discussion questions
These are questions that you can ask students individually after they've done the lesson, or lead a group discussion around, if everyone's gotten to the same point.
- Where do you use logic in every day life? What variables would you use to program that logic? (Examples for prompts: deciding what to wear outside, deciding what form of transport to use, deciding what to eat)
Additional materials: Trivia questions
These can be fun to do as a class after everyone’s gotten through the lesson. They can also lead to discussion about which questions are the hardest. Play them on Quizizz.
Want to join the conversation?
- Unfortunately this is an example of teaching bad coding practices. This could have been an excellent time to introduce the mouse functions instead of using the draw function to get mouse input. For example:
strokeWeight(9);
mouseMoved = function(){
background(255);
noStroke();
if (mouseX > 200) {
fill(248, 128, 0);
}else{
fill(255, 255, 0);
}
ellipse(mouseX, mouseY, 100, 100);
fill(0);
ellipse(mouseX-15, mouseY-15, 15, 20);
ellipse(mouseX+15, mouseY-15, 15, 20);
stroke(0);
noFill();
if (mouseX > 200) {
arc(mouseX, mouseY+30, 40, 30, 180, 360);
}else{
arc(mouseX, mouseY+10, 50, 20, 0, 180);
}
};
The reason using the draw function is not the proper method is that the draw function gets called continuously for the life of the program. It is doing work that is not necessary. The program only needs to respond when the user is actively interacting with the program as exemplified above.(5 votes) - 5675345.56546/345(2 votes)