Alina: Welcome to JS-week 1&2

[AlinaTaoRao]

my fork of the exercises repo

Study Plan

see lab-antwerp-1/AlinaTaoRao#4

---

Learning Objectives

• 🥚 Three Audiences: You can explain how a single file of code is used to communicate with 3 different audiences:
  • [x] Developers: You can explain how code formatting, comments, logs and variable names make it easier (or harder!) for a developer to understand a program.
  • [x] Computers: You can explain how a computer follows your instructions to store, read and modify data in program memory.
  • [x] Users: You can explain how the computer creates a dynamic user experience by following different executions paths depending on user input.
• 🥚 Listening and Reading:
  • [ ] You can read code out loud, and understand your classmates when they read code to you. You don't need to understand how a program works to master these learning objectives!
  • [ ] Listening You can exactly re-write a program that a classmate has read
  • [ ] Reading You can read a program out loud and guide your classmates to re-write exactly the same code without them seeing the program. (every indentation, semi-colon, comment and spelling must be identical) to you, without seeing the program they are reading.
• 🥚 Static vs. Dynamic Analysis: You can explain and use these two ways of studying a program, each can help you understand different aspects of your code. To help understand this concept, the options panel in Study Lenses is organized into static and dynamic study options:
  • [ ] Static: Studying the text in a code file without running it. Some static study methods are creating a flowchart, analyzing variables, filling out a trace table, and drawing on code.
  • [ ] Dynamic: Running code and studying the computer's behavior. Some dynamic study methods are running code and reading console logs, using the trace button, and stepping through in the debugger or JS Tutor.
• 🥚 Analyzing Variables: You can list all the variables in a program, and answer these 5 questions for each variable:
  • [x] Where is the variable declared?
  • [ ] What is the variable's scope?
  • [x] Is the variable initialized with a value?
  • [x] How many times is it's value used (read) in the program?
  • [x] How many times is the variable assigned a new value?
  • [x] What types are assigned to this variable during the program's execution?
• [ ] 🐣 Imperative Programming: You can explain what the Imperative Programming paradigm is, and can explain how you know the programs in Welcome to JS are Imperative.
• [ ] 🐣 Tracing Execution: You can complete a "steps" trace table and correct your table using console output from the "trace" button.
• [ ] 🐣 Logging: You can tracing specific aspects of a program's execution and log them to the console.
• [ ] 🐣 Completing Programs: You can successfully fill in blanks for a program when the missing words are provided, including distractors.
• [ ] 🐣 Describing Programs: You can read a program and describe it with comments using to the methodology from /describing-programs: zooming out -> zooming in -> connections -> goals
• 🐣 Naming Variables: You can analyze how a variable is used in a program and give it two names:
  • [ ] Generic: You can give a generic name to a variable based on how it is used in the program.
  • [ ] Specific: You can give a specific name to a variable based on how it's used and the program's domain (the program's specific data and use-case).
• [ ] 🐥 Constructing Programs: You can reconstruct a program's lines and indentation, successfully ignoring distractor lines.
• [ ] 🐥 Modifying Programs: You can make small changes in a program to change it's behavior without breaking it.
• [ ] 🐔 Stepping Through: You can pause a script in a step debugger, arrange the debugger, collapse extra panels, and step through a script written with Just Enough JS. At each point in execution you can make a prediction of the next line before executing, and can check your prediction using the scopes panel.
• [ ] 🐔 Authoring Programs: Given starter code with labeled goals, you can write a small program to match specs (user stories + test cases).

[AlinaTaoRao]

Week 1

• [ ] I have pushed my progress to my fork of exercises repo:welcome-to-js

Check-In

I Need Help With:

I'm good . Just need more practice.

What went well?

Review all the basic concepts from JS.

What went less well?

Tracing code.

Lessons Learned

1. Review concepts from Sololearn JavaScript.
2. Practice in exercises module to master loops, functions, objects, arrays, and Events concepts and trace code.

   Sunday Prep Work

[colevandersWands]

Practice in exercises module to master loops, functions, objects, arrays, and Events concepts and trace code.

@AlinaTaoRao , this is much more than you need to be studying right now. We'll cover all those things later in the course. Fo now it's best if you focus on tracing and reading code in Welcome to JS. Focusing on the language features in Just Enough JavaScript will help you practice the basics without getting lost in the wilderness.

[colevandersWands]

Tracing code.

@AlinaTaoRao , this is another reason to stick with the code in Welcome to Js for now. it's written to be easy for tracing so you can learn that skill faster. The moment you add arrays or functions or for loops into your code it becomes much harder to trace

[AlinaTaoRao]

Focusing on the language features in Just Enough JavaScript will help you practice the basics without getting lost in the wilderness.

@AlinaTaoRao , this is another reason to stick with the code in Welcome to Js for now. it's written to be easy for tracing so you can learn that skill faster.

@colevandersWands You are right. I'll finish /just-enough-javascript first, and then do ECMAScript6 in Sololearn instead of doing them at the same time. when I jumped into ECMAScript 6, I just knew that many syntax that I spent a lot of time to study before are outdated. I can't help curious what it now. So... 😰 . /just-enough-javascript. Almost halfway done. I'll finish it on time.

[colevandersWands]

The syntax you learned isn't time lost. Using var is close enough to let that it won't be hard to transition, the only difference between ES5 and ES6 in Welcome to JS is let. And function name() {} functions are still very common so you will want to know them.

If you're interested there are some new exercises on syntax here

[AlinaTaoRao]

Week 2

• [ ] I have pushed my progress to my fork of exercises repo:welcome-to-js

Check-In

I Need Help With:

Nothing specific.

What went well?

Basic concepts.

What went less well?

Build a common sense of logic way to solve a typic problem. Quickly figure out the logic path and result from a block of code.

Lessons Learned

Logic is the key.

Sunday Prep Work

[arnochauveau]

💪👍