HYF-Class20/home

Sarah: Welcome to JS: 3 weeks

Opened this issue · 0 comments

SarahNaji12 commented

my fork of module repository

Learning Objectives

1. What is Programming

What is a program? What is a programming language? How do programs and people
fit together?

  • Data in, Data Out: You understand that computer programs are used to
    transform data, and can explain a JS program from this module in terms of
    the data that goes in and the data that comes out.
  • Three Audiences: You can explain how a single file of code is used to
    communicate with 3 different audiences:
  • Developers: You can explain how code formatting, comments, logs and
    variable names make it easier (or harder!) for a developer to understand a
    program.
  • Computers: You can explain how a computer follows your instructions to
    store, read and modify data in program memory.
  • Users: You can explain how the computer creates a dynamic user
    experience by following different executions paths depending on user
    input.
  • Tracing Variables: You can complete a trace table for a program that
    uses only variables, and can check your work using the "trace" button.

2. Just Enough JavaScript

Go in depth on JavaScript you need to know for writing interactive text-based
programs in the browser. Along the way you will learn how each language feature
works in small programs.

  • JavaScript Syntax: Given a program, you can identify these parts of
    JavaScript syntax:
  • Primitives
  • Operators
  • Identifiers
  • Keywords
  • Checks
  • Blocks
  • Function Calls
  • 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 in their program must be
    identical to yours.
  • 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.
  • Tracing Execution: You can complete a "steps" trace table for all JS
    language features in Just Enough JavaScript, and can correct your table
    using console output from the "trace" button.
  • Analyzing Variables: You can list all the variables in a program, and
    answer these 5 questions for each variable:
    • Where is the variable declared?
    • What is the variable's scope?
    • Is the variable initialized with a value?
    • How many times is its value used (read) in the program?
    • How many times is the variable assigned a new value?
    • What types are assigned to this variable during the program's execution?
  • Completing Programs: You can successfully fill in blanks for a program
    when the missing words are provided, including distractors.
  • Translating Pseudo Code: Given a program written in Pseudo Code, you
    can translate it to working JavaScript.
  • Comparing Programs: You can compare two programs with similar code and
    explain if they have the same behavior or not. If they do not, you can
    explain how they behave differently and why.
  • Constructing Programs: You can reconstruct a program's lines and
    indentation, successfully ignoring distractor lines.

3. Understanding Programs

Learn how to understand a larger programs by finding connections between the
details and the big picture. By the end of this chapter you will know how to
read a new program and do a simple code review.

  • Stepping Through: You can pause a script in a your browser's 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.
  • 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.
  • Program Goals: You understand that a full JavaScript program can be
    explained as a series of smaller goals, and can write names for the goals
    in a simple working program.
  • Logging: You can tracing specific aspects of a program's execution and
    log them to the console.
  • Tracing Backwards You can trace backwards from a program's output to
    it's input.
  • 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).
  • Describing Programs: You can read a program and describe it with
    comments using to the methodology from /describing-programs:
    1. Zoom Out
    2. Zoom In
    3. Find Connections
    4. Describe Goals
  • Code Review: Given a working program you can review the code for
    clarity, correctness and style.
  • Same Behavior, Different Code: You can study simple programs with the
    same behavior (data in, data out) but different source code and explain
    how the differences matter for each audience.

4. Developing Programs

Learn to modify and write larger programs in JavaScript. You'll cover many of
the hidden skills necessary to develop quality software and to work
collaboratively on a code base.

  • Linting: You can find and fix simple linting errors in JavaScript
    programs.
  • Program Life Cycle: You can explain the two phases of a program's life
    cycle.
    1. Creation Phase
    2. Execution Phase
  • Fixing Errors: You can use the structured comment to describe an error
    in your program, and can make several educated guesses at how to fix the
    error.
  • Fixing Bugs: You can use the structured comment to describe and fix a
    bug in small programs.
  • Modifying Programs: You can make small changes in a program to change
    its behavior without breaking it.
  • Refactoring: Given a working program, you can make changes to the code
    without changing the program's behavior.
  • Writing Programs: Given a description of a program's behavior (user
    story + test cases    ), you can plan goals for the program and write code to
    pass the tests.
  • Reverse Engineering: Given a working program with unreadable code, you
    can:
  • Give the program a name.
  • Describe the program's behavior with a user story, acceptance criteria and
    test cases.
  • Plan goals for the program.
  • Develop your own working program with the exact same behavior.
  • Imagining Programs: Given an empty page, you can imagine and develop your
    own programs using Just Enough JavaScript. This includes:
  • A title.
  • A description with a user story, acceptance criteria and test cases.
  • Commented goals.
  • Fully working Code.

Week 1

I Need Help With:

What went well?

What went less well?

Lessons Learned

I'm still trying to learn, first time with JS

Week 2

I Need Help With:

at the moment no.

What went well?

  • i did all the exercise

What went less well?

nothing at this moment

Lessons Learned

how to create variables in js

Week 3

I Need Help With:

at the moment no.

What went well?

What went less well?

/

Lessons Learned