LessonsSummary - isel-leic-ipw/2425i-IPW-LEIC33D GitHub Wiki

Lesson 01 - Presentation and Introduction

09-09-2024 (15:30/18h30 - G.0.08)

Summary

Lesson 02 - JavaScript Language. Introduction

16-09-2024 (15:30/18h30 - G.0.08)

  • V8 JavaScript Engine is an open-source project for a virtual machine by Google, integral to the Chrome Browser, released in 2008.

  • V8 as a Virtual Execution Environment with the same characteristics as other environments like JVM or CLR.

  • Components are distributed in JavaScript source code, and JavaScript can also be seen as an intermediate language target for compilers of languages like Scala, Clojure, among others.

  • The Node.js environment combines the V8 virtual machine + component distribution and reuse model -- NPM package manager

  • Standard for a scripting language. ECMA – 262

  • Historical evolution of JavaScript from its inception in 1995 as a scripting language for browsers to the EcmaScript 6 version.

  • Development environment:

    • Editors e.g. Visual Code, Notepad++, IntelliJ, etc.
    • Use strict mode
    • ESLint -- JavaScript linter

  • Analysis of JavaScript programming language characteristics: dynamic, functional, untyped, and interpreted.

  • Scopes:

    • let and const – variables that CANNOT be used outside the block in which they were declared. Temporal Dead Zone
    • var - scope is the function where it's declared. NOT recommended to use.

  • EcmaScript 6 type system: Object and Primitives (everything else that is not Object)

  • Primitive Types: Undefined, Null, Boolean, Number, String.

  • typeof and instanceof operators

  • template strings -- support for expression interpolation => ${expression}

  • Objects

    • A JavaScript object is a container of name-value pairs!
    • Literal Object: { prop1: value1, prop2: value2, …}
    • properties are object members that store values.
    • A property that stores a function is a method
    • 2 syntaxes to access properties:
      • Dot notation: - obj.propName
        • Can only be used to access properties with valid identifier names
      • Subscript notation
        • Access a property with a name given by an expression: obj[exp]
        • Can be used to access properties whose name is not a valid identifier
        • Call a method with a name given by an expression: obj[exp]()
    • Introspection on JavaScript objects (comparison with Reflection in .Net or Java):
      • Enumerate over property names of an object – for(var key in objRef)

Resources

Lesson 03 - JavaScript Language: Arrays and Functions

19-09-2024 (14:00/15h30 - G.0.08)

  • Arrays
    • Literal arrays: [“elem1”, , “elem2”] -- position 1 will have the element undefined
    • Automatically grow, like Java or .Net Lists
    • They are not typed, so they are heterogeneous.
    • Elements are accessed by a numeric key, or by string, just like other properties
    • The main difference from objects is that they have a length property.
  • Functions
    • Functions are declared as literals that create a function value. 3 ways:
      • unnamed function - function definition - e.g. function () {} (anonymous function)
      • named function - function declaration - e.g. function foo() {}
      • arrow function e.g. () => {} (anonymous function)
    • A function has a name property that holds the name declared in the function.
    • Anonymous functions have the name property equal to an empty string ("").
    • The name of the variable that refers to a function != the name property of that function
    • The number of arguments (actual parameters) doesn't have to match the number of formal parameters.

Recursos

Lesson 04 - JavaScript Language: Invocation and this in Functions

24-09-2024 (15:30/18h30 - G.0.08)

  • Function Invocation

    • Scope (visibility) of a function and a block.

    • Closure of a function:

      • A new one is created for each function invocation
      • It can outlive the execution of that function call if functions created in that call remain accessible

    • All functions receive two implicit parameters: this and arguments

    • arguments is a collection with array-like behavior but without its methods

  • 4 ways to call a function:

    1. As a function -- this equals the global object or undefined (if in strict mode)
    2. As a method -- this equals the target e.g. target.methodName()
    3. As a constructor -- this equals the created object e.g. new funcName()
    4. Through the methods function.apply() or function.call()

  • Constructor Function - Called with the prefix operator new

    • The new operator changes the meaning of this to refer to the created object;
    • The constructor implicitly returns the new object (this) unless there is an explicit return;
    • Constructor Function --- has an explicit prototype property;
    • Use of Function::call() to call a "base" constructor

  • strict mode