2.1 - Primitive vs Abstract Data 🦖

Simple variables that can be stored in a single block of memory are called primitives. The typical primitive data types in a programming language are:

On the other hand, abstract data types require more processing power and memory. They are a combination of the primitive types.


We will start with the most basic abstract data type - Arrays.

Click here to find the GitHub Classroom repo for today's lesson

2.2 - 2D Arrays 🔢

What if your pencil case could hold other pencil cases?

Think of a single array like a shelf holding jars.

Now think of a bookshelf with many numbered shelves, each holding jars.

Need the third jar on the top shelf? myShelf[0][2]
How about the second jar on the middle shelf? myShelf[2][1]
Need the entire middle shelf? myShelf[2]

When is this useful, you might ask? All the time! Think about games like Tetris, Pacman, Bejeweled, or Battleship.

Let's check out some work with 2D Arrays  (2.2 - 2D Arrays)

Heads up! - Arrays in JS are passed & copied by reference

What does this mean - by reference?

It means that when you try to make a copy or pass an array into a function, it does not actually create separate arrays. It makes a link or shortcut to the array.

let og_sheep = ['🐑', '🐑'];
let sheeps2 = og_sheep;


    // [ '🐑', '🐑', '🐺' ]

    // [ '🐑', '🐑', '🐺' ]

😱 - our original sheeps have a wolf?!


2.3 - Abstract Data Types 😶‍🌫️

Let's learn how to declare something more custom than a number. Take a look at this simple example of creating a variable that has a name and a boolean for on or off:

let light_switch = {

    name: "Living Room",

    state: "off",

    change_state: function() { 

        if (this.state == "on")

          this.state == "off";


          this.state == "on";



That allows us to keep track of the name of the switch and the status of it, all in one variable, named light_switch.

Take a look at today's full lesson and task:  2.3 - Abstract Data Types

⭐  Arrays are an Abstract Data Type (ADT)!

We've been using Arrays like a magical bag of holding. Insert whatever you want in there, remove things, etc... But have you given any thought as to how they work or what we would do without them?

In other languages (C, C++, etc) the memory is a fixed size that the developer must allocate in advance. In JavaScript and Python, Arrays have no set size - adding to the array increases the size for us. Memory is allocated and deallocated for us by the "garbage collector" in the background. 

JavaScript's implementation of Arrays mimics a custom ADT called a doubly-linked list.

2.4 - The Stack ADT 🥞

Arrays provide access to any element at any time. But what if we only want to provide access to the last element placed in the array?

A stack is a well-known abstract data type that we call Last In First Out (LIFO). Similar to a stack of paper or plates, the only one you have direct access to is the one on top - the last one placed on the stack.

A Stack employs the following functions:

Here is a visual representation of push and pop.

Let's take a look at coding a stack:   2.4 - The Stack Data Type

2.5 - Classes and "new" 🆕

🤔  Did you ever notice that you can create a new array using the code new Array()?

So far we've made primitive and abstract data types. Most recently we implemented the Stack as a standalone ADT in JavaScript. But what if we wanted several stacks? Like what if we wanted a deck of cards, a stack of plates, and another Stack dedicated to reversing Strings?

We would have to code individual ADTs that all do the same thing. That's silly.

A Class is the idea of a description. Think of lower-class, middle-class, and upper-class families. It paints a certain picture in your mind because those "classes" of families have certain properties whether it be overall wealth, number of vehicles, or size of house.

Let's take a look at making blueprints for custom data types that we can clone - known as Classes.

2.5 - Classes

2.6 - Constructors 👷🏻🚧 and Class Methods

We can set the size of a new Array during instantiation: let arr = new Array(6)

❓ If we make a Rectangle class, can we set the length and width with:
let r = new Rectangle(14, 9)?

A Constructor is a special function (method) that automatically gets called when you use the keyword new to instantiate a class. We can also add other methods (functions) to our objects to make them more useful.

2.6 - Constructors & Class Methods

2.7 - Protection 🔒🦺

If an object contain a .password - how could we stop someone from seeing my_object.password?

🤔 The hidden word in a Wordle game... how can we hide or protect that so it's not easily found?

Properties and methods in a function default to being public. Anyone has access. But there is a way to make them private (hidden) or protected (read-only)!

2.7 - Protection & Get/Set

2.8 - Inheritance 👨‍👩‍👧‍👦 & Super! 🦸🏻

🤸🏻 Humans are a mammal - we have lungs and live births.
🐳 Whales are also a mammal.
🦒 So are Giraffes.

All of those "subclasses" of mammal share certain traits, but are also unique in various ways.

Similarly, classes in OOP can inherit properties and methods (called members) from their parent or superclass.

2.8 - Inheritance & Super!

The Unit 2 Summative Assessment (Assignment)

The cartesian plane, points, line segments, and polygons! All objects that interact with each other.

Are you ready?  (you're not, but let's just pretend that you are)

Unit 2 Summative - Cartesian Plane