Herbert: Welcome to JS: 3 weeks

Question

Herbert: Welcome to JS: 3 weeks

Opened this issue a year ago · 2 comments

HerbertHomolka1 commented a year ago

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.

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.

Week 1

What went well?

JavaScript is very similiar to python that I already used. Often there are equivalents. For example the function any() has a js equivalent some(),
Understanding, creating & updating Trace table

What went less well?

some differences between python and javascript can be frustrating for me. Loops for example can be much easier with the use of range(). There are many things I have to get used to like arrow notation, the fact that for _ in myList will give you indexes not elements of the list etc etc.
I have not finished learning about DOM and js yet. I want to finish this videotoday and do some coding tommorow.

Answer 1 · 2023-05-26T18:39:41.000Z

@HerbertHomolka

loops in all programming languages have the same logic, you won't be using loops a lot anyway when you study higher-order functions in arrays.
arrow functions are super useful and used a lot in React and with higher-order functions.

const sayhello  = ( ) => {}

for in loop used with objects ( dict) and they don't give you the index, they give you the key, for of used in arrays

Here an example of both loops

'use strict;

const students = [
  {
    id: 1,
    name: 'John',
  },
  {
    id: 2,
    name: 'Jane',
  },
  {
    id: 3,
    name: 'Jack',
  },
];

for (const student of students) {
  console.log(student);
}

const user = {
  name: 'Sara',
  age: 23,
};

for (const key in user) {
  console.log( key, user[key]);
}

# same in Pyhton
user = {
    'name' : 'John',
    'age' : 20
}

for key  in user:
  print( key , user[key])

Answer 2 · 2023-06-01T17:44:39.000Z

@HerbertHomolka1 Your link goes to Sachin's fork.